Tons of Solutions Engineering work done today for the rest of the CS team! Headway, Howard Hanna, Engels, Brighton, etc. Also completed Datasnippers auth flow and worked on Anthology's script. Cloned Anthology's courses (900..) and will clone Full Story on Monday.
This commit is contained in:
Norm Rasmussen
@ -0,0 +1,653 @@
|
||||
|
||||
/*
|
||||
Put your custom overlay styles in here
|
||||
You can use your northpass color palette in this file
|
||||
|
||||
{{ color_palette.button_font_color }}
|
||||
{{ color_palette.button_color }}
|
||||
{{ color_palette.button_hover_color }}
|
||||
{{ color_palette.header_font_color }}
|
||||
{{ color_palette.header_font_hover_color }}
|
||||
{{ color_palette.header_color }}
|
||||
*/
|
||||
|
||||
/* FONT IMPORT */
|
||||
@font-face {
|
||||
font-family: "EngelVoelkersHead";
|
||||
src: url("https://s3.amazonaws.com/static.northpass.com/engel-volkers/EngelVoelkersHead_W_Rg.woff") format('woff');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "EngelVoelkersHead";
|
||||
src: url("https://s3.amazonaws.com/static.northpass.com/engel-volkers/EngelVoelkersHead_W_Bd.woff") format('woff');
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "EngelVoelkersText";
|
||||
src: url("https://s3.amazonaws.com/static.northpass.com/engel-volkers/EngelVoelkersText_W_Rg.woff") format('woff');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "EngelVoelkersText";
|
||||
src: url("https://s3.amazonaws.com/static.northpass.com/engel-volkers/EngelVoelkersText_W_Lt.woff") format('woff');
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "EngelVoelkersText";
|
||||
src: url("https://s3.amazonaws.com/static.northpass.com/engel-volkers/EngelVoelkersText_W_BD.woff") format('woff');
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
|
||||
{% comment %}
|
||||
Styles for course.html.liquid template
|
||||
{% endcomment %}
|
||||
* {
|
||||
color: #0d0d0d !important;
|
||||
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: "EngelVoelkersText", Arial, sans-serif;
|
||||
color: #0d0d0d;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
body {
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
overflow-y: scroll;
|
||||
margin: 0 0 5% 0%;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
font-family: "EngelVoelkersHead", Georgia, serif;
|
||||
}
|
||||
|
||||
h3, h4, h5 {
|
||||
font-family: "EngelVoelkersText", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.header-modify {
|
||||
width: 1440px;
|
||||
}
|
||||
.uk-container-mod {
|
||||
}
|
||||
|
||||
{% comment %}
|
||||
Header Nav Styles
|
||||
{% endcomment %}
|
||||
.uk-navbar-nav{
|
||||
float: none ;
|
||||
display: flex;
|
||||
|
||||
}
|
||||
.course-top-nav li{
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content:flex-end;
|
||||
list-style: none;
|
||||
width: 100%;
|
||||
font-size: 18px;
|
||||
letter-spacing: .05px;
|
||||
list-style: none;
|
||||
height: auto;
|
||||
|
||||
}
|
||||
.course-top-nav li a {
|
||||
text-decoration:none;
|
||||
color: #444444;
|
||||
letter-spacing: 0.01px;
|
||||
font-size: 18px;
|
||||
font-weight:bolder;
|
||||
list-style: none;
|
||||
height: auto;
|
||||
line-height:30px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
|
||||
.current::after {
|
||||
content: "";
|
||||
bottom: 2px;
|
||||
height: 2px;
|
||||
background: red;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
@media all and (max-width: 879px) {
|
||||
.resize-nav li{
|
||||
flex-flow: column wrap !important;
|
||||
height: auto;
|
||||
}
|
||||
.resize-nav li a{
|
||||
justify-content:center;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.course-top-nav li a {
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.current::after{
|
||||
content: "";
|
||||
bottom: 2px;
|
||||
height: 2px;
|
||||
background: red;
|
||||
display: flex;
|
||||
width: 50%;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media all and (max-width: 500px) {
|
||||
.resize-nav {
|
||||
height: auto;
|
||||
|
||||
|
||||
}
|
||||
.resize-nav a {
|
||||
text-align: center;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.course-top-nav a:hover {
|
||||
-ms-transform: translateY(-2px);
|
||||
-webkit-transform: translateY(-2px);
|
||||
transform: translateY(-2px);
|
||||
transition:.5s;
|
||||
}
|
||||
|
||||
.uk-border {
|
||||
border: none !important;
|
||||
}
|
||||
.uk-border-bottom {
|
||||
border-bottom:none !important;
|
||||
}
|
||||
|
||||
|
||||
.my-course-title{
|
||||
letter-spacing: .05px;
|
||||
font-weight:bolder;
|
||||
color: #444444;
|
||||
letter-spacing: 0.01px;
|
||||
height:5%;
|
||||
}
|
||||
|
||||
.space-title {
|
||||
display:flex;
|
||||
}
|
||||
.uk-grid-modify {
|
||||
width: 1100px;
|
||||
}
|
||||
.search-box {
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
|
||||
{% comment %} .uk-margin-large-bottom .course-time p{
|
||||
color:red;
|
||||
margin-bottom: 0px;
|
||||
} {% endcomment %}
|
||||
|
||||
|
||||
.course-desc-clamp {
|
||||
margin-top:4% !important;
|
||||
display: -webkit-box !important;
|
||||
-webkit-box-orient: vertical !important;
|
||||
-webkit-line-clamp: 3 !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
|
||||
.course-desc-clamp p span{
|
||||
color: #444444 !important;
|
||||
|
||||
}
|
||||
|
||||
.uk-panel-teaser-mod {
|
||||
position: relative !important;
|
||||
display: inline-block !important;
|
||||
transition: transform 150ms ease-in-out !important;
|
||||
color: white;
|
||||
|
||||
}
|
||||
.uk-panel-teaser-mod img {
|
||||
display: block !important;
|
||||
max-width: 100% !important;
|
||||
height: auto !important;
|
||||
}
|
||||
.uk-panel-teaser-mod svg{
|
||||
position: absolute !important;
|
||||
bottom: 0 !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
{% comment %}
|
||||
Styles for percentage circle within Course image element
|
||||
{% endcomment %}
|
||||
.percent-circle {
|
||||
display: block !important;
|
||||
margin: 10px auto !important;
|
||||
max-width: 20% !important;
|
||||
max-height: 20% !important;
|
||||
}
|
||||
.circle-bg {
|
||||
fill: white;
|
||||
stroke: #eee;
|
||||
stroke-width: 2.2;
|
||||
}
|
||||
|
||||
.circle {
|
||||
fill: none;
|
||||
stroke-width: 2.2;
|
||||
stroke-linecap: round;
|
||||
}
|
||||
|
||||
.percent-circle.red .circle {
|
||||
stroke: rgb(210,4,0) ;
|
||||
}
|
||||
|
||||
.percentage {
|
||||
fill: #666;
|
||||
font-size: .70rem !important;
|
||||
color: black !important;
|
||||
text-anchor: middle !important;
|
||||
}
|
||||
|
||||
{% comment %}
|
||||
Homepage
|
||||
{% endcomment %}
|
||||
.uk-heading-mod {
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
letter-spacing: 0.02px;
|
||||
}
|
||||
.uk-subheading-mod {
|
||||
font-size: 20px;
|
||||
max-width: 735px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.school-hero-mod {
|
||||
max-width: 1044px;
|
||||
max-height: 400px;
|
||||
margin: 0 auto 0 auto;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.left-margin-h2 {
|
||||
margin: 0 auto 0 auto;
|
||||
padding-left:
|
||||
}
|
||||
.uk-text-center-mod {
|
||||
max-width: 800px;
|
||||
font-size: 21px;
|
||||
display:block;
|
||||
margin: 0 auto 0 auto;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.uk-heading-large {
|
||||
font-size: 25px;
|
||||
line-height: auto;
|
||||
}
|
||||
.uk-text-center-mod {
|
||||
max-width: 450px;
|
||||
font-size: 14x;
|
||||
display:block;
|
||||
margin: 0 auto 0 auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
{% comment %}
|
||||
Styles for Clock SVG next to Estimated Course Completion Time
|
||||
{% endcomment %}
|
||||
.clock-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content:flex-start;
|
||||
align-items: flex-end;
|
||||
background: white;
|
||||
color: #E60000 !important;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.clock-container svg{
|
||||
display: flex;
|
||||
width: 7%;
|
||||
margin-right: 2%;
|
||||
background: white;
|
||||
}
|
||||
|
||||
{% comment %} .svg-time-position.clock-container svg {
|
||||
display:flex;
|
||||
align-items: flex-end;
|
||||
} {% endcomment %}
|
||||
|
||||
.school-website-course-tile .uk-panel-box {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
#face { stroke-width: 3px; stroke: red; fill:white;}
|
||||
#hour, #min {
|
||||
stroke-width: 2.2px;
|
||||
fill: rgb(213,20,16);
|
||||
stroke: rgb(213,20,16);
|
||||
}
|
||||
#clock, #red {
|
||||
width:20%;
|
||||
}
|
||||
|
||||
|
||||
{% comment %}
|
||||
Course Catalog
|
||||
{% endcomment %}
|
||||
|
||||
.header-image img{
|
||||
margin: 0 auto;
|
||||
display:block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.category-chosen {
|
||||
background: rgb(255,255,255) !important;
|
||||
color: #E60000 !important;
|
||||
padding-left: 5px;
|
||||
font-size: 16px;
|
||||
text-align: left;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #E60000 !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 830px) {
|
||||
.category-chosen {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.uk-list-mod li a{
|
||||
line-height: 35px;
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
@media (min-width: 768px)
|
||||
.uk-list-mod {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.h3-size-mod {
|
||||
max-width: 160px;
|
||||
}
|
||||
{% comment %}
|
||||
Learning Path Style
|
||||
{% endcomment %}
|
||||
|
||||
.go-path-style {
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
font: inherit;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25px;
|
||||
vertical-align: middle;
|
||||
line-height: 39px;
|
||||
min-height: 30px;
|
||||
font-size: 18px;
|
||||
font-weight:bolder;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
transition: background-color 100ms ease-in;
|
||||
border: 1px solid #068ca8;
|
||||
border-color: #e60000 !important;
|
||||
color: #ffffff !important;
|
||||
background: #e60000 !important;
|
||||
|
||||
}
|
||||
|
||||
|
||||
{% comment %}
|
||||
.go-path-style {
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
font: inherit;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
vertical-align: middle;
|
||||
line-height: 39px;
|
||||
min-height: 30px;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
transition: background-color 100ms ease-in;
|
||||
border: 1px solid #068ca8;
|
||||
border-color: #d20400 !important;
|
||||
color: #ffffff !important;
|
||||
background: #d20400 !important;
|
||||
|
||||
}
|
||||
{% endcomment %}
|
||||
|
||||
{% comment %}
|
||||
My Dashboard Styles
|
||||
{% endcomment %}
|
||||
|
||||
.discover-events-button {
|
||||
background: rgb(210,4,0) !important;
|
||||
color: rgb(255,255,255) !important;
|
||||
padding: 0 25px;
|
||||
font-size: 18px;
|
||||
font-weight:bolder;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #eee !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
{% comment %}
|
||||
Footer Styles
|
||||
{% endcomment %}
|
||||
|
||||
.footer-container {
|
||||
border-top: 1px solid #e4e4e4;
|
||||
}
|
||||
|
||||
.footer-container .footer-content {
|
||||
padding-top: 50px;
|
||||
display: flex;
|
||||
-webkit-box-align: baseline;
|
||||
align-items: baseline;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
font-weight: 300;
|
||||
flex-wrap: wrap;
|
||||
margin: 0px auto;
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.group {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
-webkit-box-align: baseline;
|
||||
align-items: baseline;
|
||||
margin: 0 2.5% 0 2.5%;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 830px)
|
||||
.footer-container .footer-content .group {
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
padding: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
.group img{
|
||||
display: flex;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
@media all and (max-width: 830px) {
|
||||
.group {
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.copyright {
|
||||
font-size: 14px !important;
|
||||
display:flex;
|
||||
}
|
||||
@media all and (max-width: 830px) {
|
||||
.copyright {
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.footer-container img {
|
||||
border-style:none;
|
||||
}
|
||||
|
||||
.ev-links {
|
||||
display:flex;
|
||||
justify-content: space-between !important;
|
||||
margin: 0 4% 0 4%;
|
||||
width:400px;
|
||||
}
|
||||
|
||||
.ev-links a {
|
||||
margin: 0 10% 0 10%;
|
||||
justify-content: space-between
|
||||
|
||||
}
|
||||
|
||||
@media all and (max-width: 830px) {
|
||||
.ev-links a {
|
||||
margin-top: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.sk-branding-banner {
|
||||
-webkit-box-align: none;
|
||||
align-items: none;
|
||||
background-color: none;
|
||||
display: none;
|
||||
height: none;
|
||||
-webkit-box-pack: none;
|
||||
justify-content: none;
|
||||
}
|
||||
|
||||
.sk-branding-banner .sk-powered-button {
|
||||
display:none;
|
||||
height: 0px;
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
.sk-branding-banner.uk-button.uk-button-link.uk-text-small .sk-powered-button{
|
||||
display:none !important;
|
||||
height: 0px;
|
||||
width:0px;
|
||||
line-height: 0px !important;
|
||||
font-size: 0px !important;
|
||||
}
|
||||
|
||||
{% comment %}
|
||||
Events Page
|
||||
{% endcomment %}
|
||||
.stopwatch-color {
|
||||
color: rgb(210,4,0) !important;
|
||||
}
|
||||
|
||||
|
||||
.view-button {
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
margin-left: 4%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.apply-button {
|
||||
border-radius: 6px;
|
||||
font-size: 18px;
|
||||
font-weight:bolder;
|
||||
padding: 0 25px;
|
||||
}
|
||||
|
||||
{% comment %}
|
||||
Styles for Events List Segement in My Dashboard
|
||||
{% endcomment %}
|
||||
|
||||
.event-name-highlighted {
|
||||
font-size: 16px;
|
||||
list-style: none;
|
||||
line-height: 30px;
|
||||
color: rgb(210,4,0) !important;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.event-list-item__title {
|
||||
font-size: 16px;
|
||||
list-style: none;
|
||||
line-height: 30px;
|
||||
color: rgb(210,4,0) !important;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
||||
.event-list-item__actions {
|
||||
font-weight:550;
|
||||
}
|
||||
|
||||
.iZnTPu {
|
||||
font: white !important;
|
||||
display:none;
|
||||
}
|
||||
|
||||
.uk-float-right {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display:flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
Reference in New Issue
Block a user