refactor(assets): extract assets to their own repo
4
.gitmodules
vendored
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
[submodule "public"]
|
||||||
|
path = public
|
||||||
|
url = git@github.com:contentful/the-example-app-assets.git
|
||||||
|
branch = master
|
||||||
@@ -1,48 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-regular-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-regular-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-italic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-italic-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-bold-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-bold-webfont.woff') format('woff');
|
|
||||||
font-weight: bold;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-bolditalic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-bolditalic-webfont.woff') format('woff');
|
|
||||||
font-weight: bold;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'robotomedium';
|
|
||||||
src: url('/fonts/roboto-medium-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-medium-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'robotomedium';
|
|
||||||
src: url('/fonts/roboto-mediumitalic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-mediumitalic-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
@@ -1,266 +0,0 @@
|
|||||||
/* Based on FormHack v1.2.0 (formhack.io) */
|
|
||||||
/* But with some custom modifications */
|
|
||||||
|
|
||||||
/* Config ----------------------------- */
|
|
||||||
:root {
|
|
||||||
|
|
||||||
/* Font */
|
|
||||||
--fh-font-family: 'Raleway', sans-serif;
|
|
||||||
--fh-font-size: 16px;
|
|
||||||
--fh-font-color: var(--color-input-text);
|
|
||||||
|
|
||||||
/* Borders */
|
|
||||||
--fh-border-radius: 5px;
|
|
||||||
--fh-border-width: 1px;
|
|
||||||
--fh-border-style: solid;
|
|
||||||
--fh-border-color: var(--color-input-border);
|
|
||||||
|
|
||||||
/* Inputs, Textareas, Select, Option */
|
|
||||||
--fh-input-height: 40px;
|
|
||||||
--fh-input-width: 100%;
|
|
||||||
--fh-input-max-width: 100%;
|
|
||||||
--fh-input-bg-color: var(--color-input-bg);
|
|
||||||
--fh-focus-bg-color: var(--fh-input-bg-color);
|
|
||||||
--fh-focus-border-color: var(--color-palette-blue);
|
|
||||||
--fh-focus-font-color: var(--fh-font-color);
|
|
||||||
|
|
||||||
/* Select Vendor Styling */
|
|
||||||
--fh-select-vendor-styling: none; /* comment this out to maintain vendor styling */
|
|
||||||
|
|
||||||
|
|
||||||
/* Buttons & Input Submits */
|
|
||||||
--fh-button-height: 40px;
|
|
||||||
--fh-button-width: 100%;
|
|
||||||
--fh-button-min-width: 200px;
|
|
||||||
--fh-button-font-color: var(--cta-color);
|
|
||||||
--fh-button-bg-color: var(--cta-bg);
|
|
||||||
--fh-button-hover-bg-color: var(--cta-bg-hover);
|
|
||||||
--fh-button-hover-font-color: var(--fh-button-font-color);
|
|
||||||
|
|
||||||
/* Layout */
|
|
||||||
--fh-layout-display: block;
|
|
||||||
--fh-layout-margin: calc(var(--spacing) * 1) 0; /* change to "10px auto" to center */
|
|
||||||
--fh-layout-text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Global Reset Styles ------------------ */
|
|
||||||
|
|
||||||
input,
|
|
||||||
textarea,
|
|
||||||
select,
|
|
||||||
option,
|
|
||||||
optgroup,
|
|
||||||
button,
|
|
||||||
legend,
|
|
||||||
fieldset,
|
|
||||||
.cta {
|
|
||||||
box-sizing: border-box;
|
|
||||||
outline: none;
|
|
||||||
|
|
||||||
font-family: var(--fh-font-family);
|
|
||||||
font-size: var(--fh-font-size);
|
|
||||||
color: var(--fh-font-color);
|
|
||||||
vertical-align: top;
|
|
||||||
|
|
||||||
display: var(--fh-layout-display);
|
|
||||||
margin: var(--fh-layout-margin);
|
|
||||||
text-align: var(--fh-layout-text-align);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
datalist {
|
|
||||||
font-family: var(--fh-font-family);
|
|
||||||
font-size: var(--fh-font-size);
|
|
||||||
}
|
|
||||||
|
|
||||||
label {
|
|
||||||
display: var(--fh-layout-display);
|
|
||||||
margin: var(--fh-layout-margin) 0 0;
|
|
||||||
text-align: var(--fh-layout-text-align);
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 0.875em;
|
|
||||||
|
|
||||||
& + input {
|
|
||||||
margin-top: calc(var(--spacing) * 0.25)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Input & Textarea ------------------ */
|
|
||||||
|
|
||||||
/* Fields with standard width */
|
|
||||||
input[type="text"],
|
|
||||||
input[type="email"],
|
|
||||||
input[type="password"],
|
|
||||||
input[type="search"],
|
|
||||||
input[type="color"],
|
|
||||||
input[type="date"],
|
|
||||||
input[type="datetime-local"],
|
|
||||||
input[type="month"],
|
|
||||||
input[type="number"],
|
|
||||||
input[type="tel"],
|
|
||||||
input[type="time"],
|
|
||||||
input[type="url"],
|
|
||||||
input[type="week"],
|
|
||||||
input[list],
|
|
||||||
input[type="file"],
|
|
||||||
/* select, */
|
|
||||||
textarea {
|
|
||||||
width: var(--fh-input-width);
|
|
||||||
max-width: var(--fh-input-max-width);
|
|
||||||
padding: calc( var(--fh-input-height) / 5 );
|
|
||||||
background-color: var(--fh-input-bg-color);
|
|
||||||
|
|
||||||
border-radius: var(--fh-border-radius);
|
|
||||||
border-width: var(--fh-border-width);
|
|
||||||
border-style: var(--fh-border-style);
|
|
||||||
border-color: var(--fh-border-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Fields with standard height */
|
|
||||||
input[type="text"],
|
|
||||||
input[type="email"],
|
|
||||||
input[type="password"],
|
|
||||||
input[type="search"],
|
|
||||||
input[type="color"],
|
|
||||||
input[type="date"],
|
|
||||||
input[type="datetime-local"],
|
|
||||||
input[type="month"],
|
|
||||||
input[type="number"],
|
|
||||||
input[type="tel"],
|
|
||||||
input[type="time"],
|
|
||||||
input[type="url"],
|
|
||||||
input[type="week"],
|
|
||||||
input[list] {
|
|
||||||
height: var(--fh-input-height);
|
|
||||||
line-height: var(--fh-input-height);
|
|
||||||
-webkit-appearance: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Other */
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="range"] {
|
|
||||||
height: var(--fh-input-height);
|
|
||||||
width: var(--fh-input-width);
|
|
||||||
max-width: var(--fh-input-max-width);
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="file"] {
|
|
||||||
min-height: var(--fh-input-height);
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="search"] {
|
|
||||||
height: var(--fh-input-height);
|
|
||||||
-webkit-appearance: none;
|
|
||||||
}
|
|
||||||
input[type="search"]::-webkit-search-cancel-button,
|
|
||||||
input[type="search"]::-webkit-search-decoration {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"],
|
|
||||||
input[type="radio"] {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
/* For checkbox and radio to be centered, need to wrap the input and label in a span -
|
|
||||||
/* .checkbox-container {
|
|
||||||
/* display: block;
|
|
||||||
/* text-align: center;
|
|
||||||
/* }
|
|
||||||
|
|
||||||
|
|
||||||
/* Fieldset ------------------ */
|
|
||||||
|
|
||||||
fieldset {
|
|
||||||
padding: 0;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
legend {
|
|
||||||
padding: 0;
|
|
||||||
font-weight: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Buttons, Input Type Submit/Reset ------------------ */
|
|
||||||
|
|
||||||
button,
|
|
||||||
input[type="button"],
|
|
||||||
input[type="submit"],
|
|
||||||
input[type="reset"],
|
|
||||||
input[type="image"],
|
|
||||||
.cta {
|
|
||||||
display: inline-block;
|
|
||||||
height: var(--fh-button-height);
|
|
||||||
min-width: var(--fh-button-min-width);
|
|
||||||
background-color: var(--fh-button-bg-color);
|
|
||||||
padding: 0 2em;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
line-height: var(--fh-button-height);
|
|
||||||
color: var(--fh-button-font-color);
|
|
||||||
font-weight: normal;
|
|
||||||
|
|
||||||
-webkit-appearance: none;
|
|
||||||
-moz-appearance: none;
|
|
||||||
|
|
||||||
border: none;
|
|
||||||
border-radius: var(--cta-radius);
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="image"] {
|
|
||||||
text-align: center;
|
|
||||||
padding: calc( var(--fh-input-height) / 5 );
|
|
||||||
}
|
|
||||||
|
|
||||||
/* States ------------------ */
|
|
||||||
|
|
||||||
input[disabled],
|
|
||||||
textarea[disabled],
|
|
||||||
select[disabled],
|
|
||||||
option[disabled],
|
|
||||||
button[disabled] {
|
|
||||||
cursor: not-allowed;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:focus,
|
|
||||||
textarea:focus,
|
|
||||||
select:focus,
|
|
||||||
option:focus {
|
|
||||||
border-color: var(--color-palette-blue);
|
|
||||||
color: var(--fh-font-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
button:focus,
|
|
||||||
.cta:focus {
|
|
||||||
background-color: var(--fh-button-hover-bg-color);
|
|
||||||
color: var(--fh-button-hover-font-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"]:focus,
|
|
||||||
input[type="radio"]:focus {
|
|
||||||
outline: var(--fh-focus-border-color) solid 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
input[type="button"]:hover,
|
|
||||||
input[type="submit"]:hover,
|
|
||||||
input[type="reset"]:hover,
|
|
||||||
button:focus,
|
|
||||||
input[type="button"]:focus,
|
|
||||||
input[type="submit"]:focus,
|
|
||||||
input[type="reset"]:focus,
|
|
||||||
.cta:hover,
|
|
||||||
.cta:focus {
|
|
||||||
background-color: var(--fh-button-hover-bg-color);
|
|
||||||
color: var(--fh-button-hover-font-color);
|
|
||||||
}
|
|
||||||
@@ -1,65 +0,0 @@
|
|||||||
@block form-item {
|
|
||||||
& + .form-item {
|
|
||||||
margin-top: var(--spacing);
|
|
||||||
}
|
|
||||||
|
|
||||||
& input {
|
|
||||||
margin: 0 0 calc(var(--spacing) * 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element help-text {
|
|
||||||
font-size: 0.875em;
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element error-message {
|
|
||||||
font-size: 0.875em;
|
|
||||||
color: var(--color-text-error);
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
display: inline-block;
|
|
||||||
background: url('/images/icon-error.svg') no-repeat left center;
|
|
||||||
background-size: contain;
|
|
||||||
width: 12px;
|
|
||||||
height: 12px;
|
|
||||||
padding-right: 0.3em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@block status-block {
|
|
||||||
display: flex;
|
|
||||||
margin: var(--spacing) 0;
|
|
||||||
padding: calc(var(--spacing) * 0.5);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
|
|
||||||
font-size: 0.875em;
|
|
||||||
|
|
||||||
@modifier success {
|
|
||||||
background: var(--color-status-block-bg-success);
|
|
||||||
}
|
|
||||||
|
|
||||||
@modifier error {
|
|
||||||
background: var(--color-status-block-bg-error);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element icon {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
margin-right: calc(var(--spacing) * 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element content {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element title {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element message {
|
|
||||||
color: var(--color-status-block-message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
@import './fonts';
|
|
||||||
@import './typography';
|
|
||||||
@import './formhack';
|
|
||||||
@import './forms';
|
|
||||||
@@ -1,36 +0,0 @@
|
|||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
font-weight: normal;
|
|
||||||
line-height: 1.31;
|
|
||||||
color: var(--color-text-headlines);
|
|
||||||
|
|
||||||
&:first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
p, label, .form-item {
|
|
||||||
& a {
|
|
||||||
color: var(--color-link-content);
|
|
||||||
text-decoration: underline;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: var(--color-link-content-hover);
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
&:first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
&:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,82 +0,0 @@
|
|||||||
@block course-card {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: var(--spacing);
|
|
||||||
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
box-shadow: var(--card-box-shadow);
|
|
||||||
|
|
||||||
@element categories {
|
|
||||||
flex: 0 0 var(--line-height);
|
|
||||||
margin-bottom: calc(var(--spacing) * 0.5);
|
|
||||||
height: var(--line-height);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element category {
|
|
||||||
display: inline-block;
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
font-size: 0.75em;
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
content: ' • ';
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:last-child:after {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element category-link {
|
|
||||||
display: inline-block;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element title {
|
|
||||||
flex: 0 1 15vh;
|
|
||||||
max-height: 120px;
|
|
||||||
margin: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
padding-bottom: calc(var(--spacing) * 0.5);
|
|
||||||
margin-bottom: calc(var(--spacing) * 0.5);
|
|
||||||
border-bottom: 1px solid var(--color-bg-separator);
|
|
||||||
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
font-weight: normal;
|
|
||||||
font-size: 1.625em;
|
|
||||||
line-height: 1.38;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element description {
|
|
||||||
flex: 0 1 15vh;
|
|
||||||
max-height: 120px;
|
|
||||||
overflow: hidden;
|
|
||||||
margin: 0 0 calc(var(--spacing));
|
|
||||||
|
|
||||||
line-height: 1.63;
|
|
||||||
color: var(--color-course-card-description);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link-wrapper {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link {
|
|
||||||
display: inline-block;
|
|
||||||
padding-bottom: 0.3em;
|
|
||||||
border-bottom: 1px solid var(--color-link-content);
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: var(--color-link-content);
|
|
||||||
font-size: 0.75em;
|
|
||||||
line-height: 2.17;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: var(--color-link-content-hover);
|
|
||||||
border-bottom-color: var(--color-link-content-hover);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,61 +0,0 @@
|
|||||||
@import './card';
|
|
||||||
|
|
||||||
@block course {
|
|
||||||
@element title {
|
|
||||||
margin-bottom: calc(var(--spacing));
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview {
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
float: right;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
box-shadow: var(--card-box-shadow);
|
|
||||||
width: 228px;
|
|
||||||
margin: 0 0 var(--spacing) var(--spacing);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview-title {
|
|
||||||
border-bottom: 1px solid var(--color-sidebar-seperator);
|
|
||||||
padding: calc(var(--spacing) / 2) 0;
|
|
||||||
margin: 0;
|
|
||||||
line-height: 1.31;
|
|
||||||
font-weight: normal;
|
|
||||||
text-transform: uppercase;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview-item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: calc(var(--spacing) / 2);
|
|
||||||
border-bottom: 1px solid var(--color-sidebar-seperator);
|
|
||||||
|
|
||||||
line-height: 1.54;
|
|
||||||
font-size: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview-icon {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
padding-right: calc(var(--spacing) / 2);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview-value {
|
|
||||||
flex: 1 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overview-cta-wrapper {
|
|
||||||
padding: calc(var(--spacing) / 2) 0;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
@element overview-cta {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
@element cta {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,42 +0,0 @@
|
|||||||
@block breadcrumb {
|
|
||||||
margin-bottom: calc(var(--spacing) * 0.25);
|
|
||||||
|
|
||||||
font-size: 0.875em;
|
|
||||||
|
|
||||||
& ul {
|
|
||||||
display: flex;
|
|
||||||
list-style: none;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
& li {
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
&:after{
|
|
||||||
content: '';
|
|
||||||
display: inline-block;
|
|
||||||
background: url('/images/icon-breadcrumb.svg');
|
|
||||||
background-size: contain;
|
|
||||||
background-position: center center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
width: 4px;
|
|
||||||
height: 8px;
|
|
||||||
padding: 0 calc(var(--spacing) * 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:last-child:after{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
& a {
|
|
||||||
display: inline-block;
|
|
||||||
text-transform: capitalize;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: var(--color-link-content-hover);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,48 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-regular-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-regular-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-italic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-italic-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-bold-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-bold-webfont.woff') format('woff');
|
|
||||||
font-weight: bold;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'roboto';
|
|
||||||
src: url('/fonts/roboto-bolditalic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-bolditalic-webfont.woff') format('woff');
|
|
||||||
font-weight: bold;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'robotomedium';
|
|
||||||
src: url('/fonts/roboto-medium-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-medium-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'robotomedium';
|
|
||||||
src: url('/fonts/roboto-mediumitalic-webfont.woff2') format('woff2'),
|
|
||||||
url('/fonts/roboto-mediumitalic-webfont.woff') format('woff');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
@@ -1,90 +0,0 @@
|
|||||||
@block footer {
|
|
||||||
padding: var(--spacing) 0;
|
|
||||||
|
|
||||||
& p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
min-height: 80px;
|
|
||||||
|
|
||||||
border-bottom: 1px solid var(--color-bg-separator);
|
|
||||||
|
|
||||||
& > * {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element navigation {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element apps {
|
|
||||||
flex: 1 0 auto;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
|
|
||||||
& a {
|
|
||||||
display: inline-block;
|
|
||||||
width: 138px;
|
|
||||||
|
|
||||||
& + a {
|
|
||||||
margin-left: calc(var(--spacing) * 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
& img {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element lower {
|
|
||||||
display: flex;
|
|
||||||
min-height: 80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element disclaimer {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element disclaimer-logo {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
width: 24px;
|
|
||||||
height: 27px;
|
|
||||||
margin-right: calc(var(--spacing) * 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element disclaimer-text {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
|
|
||||||
color: var(--color-text-footer);
|
|
||||||
font-size: 0.75em;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element social {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 0 0 var(--spacing);
|
|
||||||
|
|
||||||
& a + a {
|
|
||||||
margin-left: calc(var(--spacing) * 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
& img {
|
|
||||||
width: 24px;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@@ -1,221 +0,0 @@
|
|||||||
@block header {
|
|
||||||
margin-bottom: calc(var(--spacing) * 0.75);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-wrapper {
|
|
||||||
background: var(--color-palette-blue-dark);
|
|
||||||
padding: calc(var(--spacing) * 0.25) 0;
|
|
||||||
color: var(--color-header-upper-text-secondary);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
font-size: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-first {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 1 auto;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-second {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 1 auto;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-link {
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-copy {
|
|
||||||
display: inline-flex;
|
|
||||||
margin: 0 0 calc(var(--spacing) / 4);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
margin: 0 calc(var(--spacing) / 2) 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element upper-icon {
|
|
||||||
display: inline-block;
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
margin-right: calc(var(--spacing) / 4);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element lower-wrapper {
|
|
||||||
}
|
|
||||||
|
|
||||||
@element lower {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: space-between;
|
|
||||||
padding: calc(var(--spacing) * 0.5) 0 calc(var(--spacing) * 0.25);
|
|
||||||
border-bottom: 1px solid var(--color-bg-separator);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element title {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-family: var(--font-regular);
|
|
||||||
letter-spacing: 3px;
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: var(--color-header-upper-text-primary);
|
|
||||||
|
|
||||||
& img {
|
|
||||||
display: inline-block;
|
|
||||||
width: 24px;
|
|
||||||
height: auto;
|
|
||||||
margin-right: calc(var(--spacing) / 4);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
margin: 0 calc(var(--spacing) / 2) 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element logo {
|
|
||||||
display: flex;
|
|
||||||
flex: 0 0 100%;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 0 200px;
|
|
||||||
justify-content: start;
|
|
||||||
}
|
|
||||||
|
|
||||||
& img {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
max-width: 169px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls {
|
|
||||||
display: flex;
|
|
||||||
flex: 1 1 auto;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-around;
|
|
||||||
color: var(--color-header-upper-text-primary);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls_group {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
margin: 0 0 calc(var(--spacing) * 0.5);
|
|
||||||
padding: calc(var(--spacing) * 0.0625) calc(var(--spacing) / 2);
|
|
||||||
|
|
||||||
border: none;
|
|
||||||
background: var(--color-palette-blue-medium);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
margin: 0 calc(var(--spacing) * 0.75) 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls_label {
|
|
||||||
position: relative;
|
|
||||||
z-index: 1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls_dropdown {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 2;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
width: 260px;
|
|
||||||
max-width: 90vw;
|
|
||||||
margin: calc(var(--spacing) / 2 - 4px) 0 0;
|
|
||||||
|
|
||||||
opacity: 0;
|
|
||||||
background: #fff;
|
|
||||||
border-radius: 2px;
|
|
||||||
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
transition: 0.3s opacity ease;
|
|
||||||
pointer-events: none;
|
|
||||||
|
|
||||||
@modifier active {
|
|
||||||
opacity: 1;
|
|
||||||
pointer-events: all;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: -5px;
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
|
|
||||||
background-color: inherit;
|
|
||||||
transform: translateX(-50%) rotate(45deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls_help_text {
|
|
||||||
padding: calc(var(--spacing) / 2);
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element controls_button {
|
|
||||||
box-sizing: border-box;
|
|
||||||
height: auto;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
border-radius: 0;
|
|
||||||
background: var(--header-dropdown-bg);
|
|
||||||
|
|
||||||
color: var(--header-dropdown-btn-color);
|
|
||||||
font-size: 1em;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: var(--header-dropdown-bg-hover);
|
|
||||||
color: var(--header-dropdown-btn-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
@modifier active {
|
|
||||||
background: var(--header-dropdown-bg-active);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,34 +0,0 @@
|
|||||||
@import './header';
|
|
||||||
@import './footer';
|
|
||||||
|
|
||||||
@import './table-of-contents';
|
|
||||||
@import './sidebar-menu';
|
|
||||||
@import './main-navigation';
|
|
||||||
@import './breadcrumb';
|
|
||||||
|
|
||||||
body {
|
|
||||||
background-color: var(--color-bg-default);
|
|
||||||
color: var(--color-text-default);
|
|
||||||
font-family: var(--font-regular);
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: var(--line-height);
|
|
||||||
}
|
|
||||||
|
|
||||||
@block main {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 100vh;
|
|
||||||
|
|
||||||
@element header {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
@element content {
|
|
||||||
flex: 1 0 auto;
|
|
||||||
display: flex;
|
|
||||||
align-items: stretch;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
@element footer {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,40 +0,0 @@
|
|||||||
@block main-navigation {
|
|
||||||
& ul {
|
|
||||||
display: flex;
|
|
||||||
list-style: none;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
|
|
||||||
& li {
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
& + li {
|
|
||||||
margin-left: calc(var(--spacing) / 4);
|
|
||||||
}
|
|
||||||
|
|
||||||
& a {
|
|
||||||
display: block;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: bold;
|
|
||||||
padding: 0.7em 1em;
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
|
|
||||||
&.active,
|
|
||||||
&:hover {
|
|
||||||
background: var(--color-bg-grey);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: var(--color-text-default);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,28 +0,0 @@
|
|||||||
@block sidebar-menu {
|
|
||||||
@element list {
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element item {
|
|
||||||
margin: 0 0 calc(var(--spacing) * 0.5);
|
|
||||||
padding: 0;
|
|
||||||
font-size: 0.9em;
|
|
||||||
line-height: 1.8;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link {
|
|
||||||
display: block;
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&.active {
|
|
||||||
color: var(--color-text-default);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,69 +0,0 @@
|
|||||||
:root {
|
|
||||||
--toc-gap-left: calc(var(--spacing));
|
|
||||||
--toc-gap-total: calc(var(--toc-gap-left) + var(--spacing) * 0.5);
|
|
||||||
}
|
|
||||||
@block table-of-contents {
|
|
||||||
@element list {
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
padding-left: var(--toc-gap-left);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element item {
|
|
||||||
margin: 0 0 calc(var(--spacing) * 0.25);
|
|
||||||
padding: 0;
|
|
||||||
font-size: 0.9em;
|
|
||||||
line-height: 1.8;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link {
|
|
||||||
display: block;
|
|
||||||
color: var(--color-text-grey);
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&.active {
|
|
||||||
color: var(--color-text-default);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
position: relative;
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
|
|
||||||
&:before,
|
|
||||||
&:after {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
left: calc(var(--toc-gap-total) * -1 + 4px);
|
|
||||||
bottom: 0;
|
|
||||||
width: 3px;
|
|
||||||
background: var(--color-course-active);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.visited {
|
|
||||||
position:relative;
|
|
||||||
|
|
||||||
&:before,
|
|
||||||
&:after {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
&:after {
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
top: 50%;
|
|
||||||
left: calc(var(--toc-gap-total) / 2 * -1 - 8px);
|
|
||||||
transform: translateY(-50%);
|
|
||||||
|
|
||||||
background: url('/images/icon-viewed.svg') no-repeat center center;
|
|
||||||
background-size: contain;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,99 +0,0 @@
|
|||||||
/*
|
|
||||||
|
|
||||||
github.com style (c) Vasily Polovnyov <vast@whiteants.net>
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
.hljs {
|
|
||||||
display: block;
|
|
||||||
overflow-x: auto;
|
|
||||||
padding: 0.5em;
|
|
||||||
color: #333;
|
|
||||||
background: #f8f8f8;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-comment,
|
|
||||||
.hljs-quote {
|
|
||||||
color: #998;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-keyword,
|
|
||||||
.hljs-selector-tag,
|
|
||||||
.hljs-subst {
|
|
||||||
color: #333;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-number,
|
|
||||||
.hljs-literal,
|
|
||||||
.hljs-variable,
|
|
||||||
.hljs-template-variable,
|
|
||||||
.hljs-tag .hljs-attr {
|
|
||||||
color: #008080;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-string,
|
|
||||||
.hljs-doctag {
|
|
||||||
color: #d14;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-title,
|
|
||||||
.hljs-section,
|
|
||||||
.hljs-selector-id {
|
|
||||||
color: #900;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-subst {
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-type,
|
|
||||||
.hljs-class .hljs-title {
|
|
||||||
color: #458;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-tag,
|
|
||||||
.hljs-name,
|
|
||||||
.hljs-attribute {
|
|
||||||
color: #000080;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-regexp,
|
|
||||||
.hljs-link {
|
|
||||||
color: #009926;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-symbol,
|
|
||||||
.hljs-bullet {
|
|
||||||
color: #990073;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-built_in,
|
|
||||||
.hljs-builtin-name {
|
|
||||||
color: #0086b3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-meta {
|
|
||||||
color: #999;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-deletion {
|
|
||||||
background: #fdd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-addition {
|
|
||||||
background: #dfd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-emphasis {
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-strong {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
@import './modules';
|
|
||||||
|
|
||||||
@block modules-container {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
}
|
|
||||||
@@ -1,71 +0,0 @@
|
|||||||
@block module-copy {
|
|
||||||
@modifier emphasized {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
padding: calc(var(--spacing) * 0.75) 0;
|
|
||||||
background-color: var(--module-copy-emphasized-bg);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
color: var(--module-copy-emphasized-color);
|
|
||||||
|
|
||||||
& a {
|
|
||||||
color: inherit;
|
|
||||||
&:hover {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element first {
|
|
||||||
@modifier emphasized {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
width: 50vw;
|
|
||||||
padding: 0 var(--spacing);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
padding-left: var(--spacing);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element second {
|
|
||||||
@modifier emphasized {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
padding: 0 var(--spacing);
|
|
||||||
width: 20vw;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@element headline {
|
|
||||||
@modifier emphasized {
|
|
||||||
color: var(--module-copy-emphasized-headlines-color);
|
|
||||||
font-size: 1.25em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element copy {
|
|
||||||
@modifier emphasized {
|
|
||||||
font-size: 0.875em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element cta {
|
|
||||||
@modifier emphasized {
|
|
||||||
background-color: var(--module-copy-emphasized-cta-bg);
|
|
||||||
color: var(--module-copy-emphasized-cta-color);
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,37 +0,0 @@
|
|||||||
@block module-hero-image {
|
|
||||||
@element wrapper {
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
max-height: 60vh;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element image{
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element headline-wrapper {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element headline {
|
|
||||||
color: #fff;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 4.5vw;
|
|
||||||
line-height: 1;
|
|
||||||
text-shadow: 0px 3px 0px #b2a98f,
|
|
||||||
0px 14px 10px rgba(0,0,0,0.15),
|
|
||||||
0px 24px 2px rgba(0,0,0,0.1),
|
|
||||||
0px 34px 30px rgba(0,0,0,0.1);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
font-size: 4em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,98 +0,0 @@
|
|||||||
@block module-higlighted-course {
|
|
||||||
@element wrapper {
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
height: 50vh;
|
|
||||||
min-height: 250px;
|
|
||||||
max-height: 500px;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
background-size: cover;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element overlay {
|
|
||||||
z-index: 1;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
opacity: 0.8;
|
|
||||||
border-radius: 4px;
|
|
||||||
background-color: #3c3d41;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element content {
|
|
||||||
z-index: 2;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
padding: var(--spacing) calc(var(--spacing) * 2);
|
|
||||||
|
|
||||||
color: var(--color-text-dark-bg-grey);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element categories {
|
|
||||||
flex: 0 0 var(--line-height);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element category {
|
|
||||||
display: inline-block;
|
|
||||||
margin-right: var(--spacing);
|
|
||||||
|
|
||||||
font-size: 0.75em;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element title {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
margin: 0 0 calc(var(--spacing) * 0.25);
|
|
||||||
|
|
||||||
color: var(--color-text-dark-bg);
|
|
||||||
font-size: 4vw;
|
|
||||||
line-height: 1.3;
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
font-size: 3.25em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element description-wrapper {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
max-width: 400px;
|
|
||||||
line-height: 1.3;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
font-size: 1.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
& p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link-wrapper {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
margin-top: var(--spacing);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element link {
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
border-bottom: 1px solid var(--color-text-dark-bg);
|
|
||||||
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: var(--color-text-dark-bg);
|
|
||||||
font-size: 0.75em;
|
|
||||||
line-height: 2.17;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,18 +0,0 @@
|
|||||||
@import './copy';
|
|
||||||
@import './hero-image';
|
|
||||||
@import './highlighted-course';
|
|
||||||
|
|
||||||
@block module {
|
|
||||||
max-width: var(--content-max-width);
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 2vw;
|
|
||||||
|
|
||||||
& img {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
& + .module {
|
|
||||||
margin-top: var(--spacing);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
@block grid-list {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 0 calc(50% - var(--spacing));
|
|
||||||
margin: 0 calc(var(--spacing) / 2 * -1);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element item {
|
|
||||||
flex: 0 0 100%;
|
|
||||||
margin-bottom: var(--spacing);
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
box-sizing: border-box;
|
|
||||||
flex: 0 0 calc(50% - var(--spacing));
|
|
||||||
margin: 0 calc(var(--spacing) / 2) var(--spacing);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
@import 'layout-centered';
|
|
||||||
@import 'layout-no-sidebar';
|
|
||||||
@import 'layout-sidebar';
|
|
||||||
@import 'grid-list';
|
|
||||||
@@ -1,11 +0,0 @@
|
|||||||
@block layout-centered {
|
|
||||||
max-width: var(--content-max-width);
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 2vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
@block layout-centered-small {
|
|
||||||
max-width: calc(var(--content-max-width) - 360px);
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 2vw;
|
|
||||||
}
|
|
||||||
@@ -1,11 +0,0 @@
|
|||||||
@block layout-no-sidebar {
|
|
||||||
padding: 0 calc(var(--spacing) / 2);
|
|
||||||
max-width: var(--content-max-width);
|
|
||||||
margin: 0 auto;
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
padding-left: calc(var(--layout-sidebar-sidebar-width) + var(--spacing));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,53 +0,0 @@
|
|||||||
@block layout-sidebar {
|
|
||||||
padding: 0 calc(var(--spacing) / 2);
|
|
||||||
max-width: var(--content-max-width);
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
display: flex;
|
|
||||||
align-items: flex-start;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element sidebar {
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
width: var(--layout-sidebar-sidebar-width);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
box-shadow: var(--card-box-shadow);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element sidebar-header {
|
|
||||||
padding: calc(var(--spacing) / 2) var(--spacing);
|
|
||||||
border-bottom: 1px solid var(--color-sidebar-seperator);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element sidebar-title {
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
font-size: 1.25em;
|
|
||||||
font-weight: normal;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@element sidebar-content {
|
|
||||||
background: var(--color-sidebar-bg);
|
|
||||||
padding: calc(var(--spacing) * 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element content {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
@media (--breakpoint-desktop) {
|
|
||||||
flex: 0 1 var(--layout-sidebar-content-width);
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-left: var(--spacing);
|
|
||||||
}
|
|
||||||
|
|
||||||
& > * {
|
|
||||||
max-width: var(--layout-sidebar-content-width);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,72 +0,0 @@
|
|||||||
@block lesson-module {
|
|
||||||
margin-top: var(--spacing);
|
|
||||||
|
|
||||||
& img {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@block lesson {
|
|
||||||
@element title {
|
|
||||||
margin-bottom: var(--spacing);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element cta {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@block lesson-module-code {
|
|
||||||
@element header {}
|
|
||||||
@element code-area {
|
|
||||||
background: var(--code-bg);
|
|
||||||
}
|
|
||||||
|
|
||||||
@element trigger {
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
height: 30px;
|
|
||||||
padding: 0 1em;
|
|
||||||
margin-right: 1em;
|
|
||||||
|
|
||||||
background: var(--code-trigger-bg);
|
|
||||||
|
|
||||||
border-top: 3px solid transparent;
|
|
||||||
|
|
||||||
line-height: 30px;
|
|
||||||
font-family: var(--font-medium);
|
|
||||||
font-size: 0.875em;
|
|
||||||
color: var(--code-trigger-color);
|
|
||||||
|
|
||||||
cursor: pointer;
|
|
||||||
user-select: none;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: var(--color-link-content-hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
@modifier active {
|
|
||||||
background: var(--code-trigger-bg-active);
|
|
||||||
color: var(--code-trigger-color-active) !important;
|
|
||||||
cursor: default;
|
|
||||||
border-color: var(--code-trigger-border-active);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@element code {
|
|
||||||
display: none;
|
|
||||||
|
|
||||||
@modifier active {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
& pre {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,15 +0,0 @@
|
|||||||
@import 'normalize.css';
|
|
||||||
|
|
||||||
@import './variables';
|
|
||||||
|
|
||||||
@import './base';
|
|
||||||
|
|
||||||
@import './layout';
|
|
||||||
|
|
||||||
@import './global';
|
|
||||||
|
|
||||||
@import './hljs-github';
|
|
||||||
|
|
||||||
@import './course';
|
|
||||||
@import './landing-page';
|
|
||||||
@import './lesson';
|
|
||||||
@@ -1,78 +0,0 @@
|
|||||||
@custom-media --breakpoint-desktop (min-width: 700px);
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--content-max-width: 980px;
|
|
||||||
--spacing: 32px;
|
|
||||||
--border-radius: 4px;
|
|
||||||
|
|
||||||
--line-height: 1.5em;
|
|
||||||
|
|
||||||
--font-regular: 'roboto', Helvetica, sans-serif;
|
|
||||||
--font-medium: 'robotomedium', Helvetica, sans-serif;
|
|
||||||
|
|
||||||
--color-palette-blue: #5c9fef;
|
|
||||||
--color-palette-blue-medium: #3c80cf;
|
|
||||||
--color-palette-blue-dark: #3072be;
|
|
||||||
--color-palette-red: #cd3f39;
|
|
||||||
|
|
||||||
--color-text-default: #536171;
|
|
||||||
--color-text-headlines: #2a3039;
|
|
||||||
--color-text-grey: #8091a5;
|
|
||||||
--color-text-dark-bg: #fff;
|
|
||||||
--color-text-dark-bg-grey: #a9b9c0;
|
|
||||||
--color-text-error: var(--color-palette-red);
|
|
||||||
|
|
||||||
--color-link-content: var(--color-palette-blue);
|
|
||||||
--color-link-content-hover: var(--color-palette-blue-medium);
|
|
||||||
|
|
||||||
--color-bg-default: #fff;
|
|
||||||
--color-bg-grey: #f7f9fa;
|
|
||||||
--color-bg-separator: #e5ebed;
|
|
||||||
|
|
||||||
--color-text-footer: #a9b9c0;
|
|
||||||
|
|
||||||
--color-sidebar-bg: #f7f9fa;
|
|
||||||
--color-sidebar-seperator: #eeeeee;
|
|
||||||
|
|
||||||
--color-course-active: #536171;
|
|
||||||
--color-course-card-description: #536171;
|
|
||||||
|
|
||||||
--color-status-block-bg-success: #f4fffb;
|
|
||||||
--color-status-block-bg-error: #fbe3e2;
|
|
||||||
--color-status-block-message: #536171;
|
|
||||||
|
|
||||||
--color-input-text: #536171;
|
|
||||||
--color-input-bg: #fff;
|
|
||||||
--color-input-border: #d3dce0;
|
|
||||||
|
|
||||||
--color-header-upper-text-primary: #fff;
|
|
||||||
--color-header-upper-text-secondary: #abc6e5;
|
|
||||||
|
|
||||||
--layout-sidebar-sidebar-width: 228px;
|
|
||||||
--layout-sidebar-content-width: 732px;
|
|
||||||
|
|
||||||
--card-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
--cta-color: #fff;
|
|
||||||
--cta-bg: var(--color-palette-blue);
|
|
||||||
--cta-bg-hover: var(--color-palette-blue-medium);
|
|
||||||
--cta-radius: 3px;
|
|
||||||
|
|
||||||
--header-dropdown-btn-color: #263545;
|
|
||||||
--header-dropdown-bg: #fff;
|
|
||||||
--header-dropdown-bg-active: #d3dce0;
|
|
||||||
--header-dropdown-bg-hover: #e5ebed;
|
|
||||||
|
|
||||||
--module-copy-emphasized-bg: #8091a5;
|
|
||||||
--module-copy-emphasized-color: #c3cfd5;
|
|
||||||
--module-copy-emphasized-headlines-color: #fff;
|
|
||||||
--module-copy-emphasized-cta-bg: #536171;
|
|
||||||
--module-copy-emphasized-cta-color: #fff;
|
|
||||||
|
|
||||||
--code-bg: var(--color-bg-grey);
|
|
||||||
--code-trigger-bg: #fff;
|
|
||||||
--code-trigger-bg-active: var(--code-bg);
|
|
||||||
--code-trigger-color: var(--color-text-grey);
|
|
||||||
--code-trigger-color-active: var(--color-text-default);
|
|
||||||
--code-trigger-border-active: #c3cfd5;
|
|
||||||
}
|
|
||||||
13
package.json
@@ -6,9 +6,7 @@
|
|||||||
"start:watch": "nodemon ./bin/www --ignore public/",
|
"start:watch": "nodemon ./bin/www --ignore public/",
|
||||||
"start": "node ./bin/www",
|
"start": "node ./bin/www",
|
||||||
"lint": "eslint ./app.js routes",
|
"lint": "eslint ./app.js routes",
|
||||||
"format": "eslint --fix . bin --ignore public node_modules",
|
"format": "eslint --fix . bin --ignore public node_modules"
|
||||||
"styles": "postcss -c ./postcss.config.js ./assets/stylesheets/style.css -d ./public/stylesheets",
|
|
||||||
"styles:watch": "npm run styles -- -w"
|
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=8.4.0"
|
"node": ">=8.4.0"
|
||||||
@@ -23,7 +21,6 @@
|
|||||||
"jstransformer-markdown-it": "^2.0.0",
|
"jstransformer-markdown-it": "^2.0.0",
|
||||||
"marked": "^0.3.6",
|
"marked": "^0.3.6",
|
||||||
"morgan": "~1.7.0",
|
"morgan": "~1.7.0",
|
||||||
"normalize.css": "^7.0.0",
|
|
||||||
"pug": "~2.0.0-beta6",
|
"pug": "~2.0.0-beta6",
|
||||||
"serve-favicon": "~2.3.0"
|
"serve-favicon": "~2.3.0"
|
||||||
},
|
},
|
||||||
@@ -33,14 +30,6 @@
|
|||||||
"eslint-plugin-promise": "^3.4.2",
|
"eslint-plugin-promise": "^3.4.2",
|
||||||
"eslint-plugin-standard": "^2.0.1",
|
"eslint-plugin-standard": "^2.0.1",
|
||||||
"nodemon": "^1.12.1",
|
"nodemon": "^1.12.1",
|
||||||
"postcss": "^6.0.12",
|
|
||||||
"postcss-atrule-bem": "^3.0.1",
|
|
||||||
"postcss-browser-reporter": "^0.5.0",
|
|
||||||
"postcss-cli": "^4.1.1",
|
|
||||||
"postcss-cssnext": "^3.0.2",
|
|
||||||
"postcss-import": "^11.0.0",
|
|
||||||
"postcss-reporter": "^5.0.0",
|
|
||||||
"postcss-url": "^7.1.2",
|
|
||||||
"pug-lint": "^2.5.0"
|
"pug-lint": "^2.5.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
plugins: {
|
|
||||||
'postcss-import': {},
|
|
||||||
'postcss-url': {},
|
|
||||||
'postcss-atrule-bem': {},
|
|
||||||
'postcss-cssnext': {},
|
|
||||||
'postcss-browser-reporter': {},
|
|
||||||
'postcss-reporter': {}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1
public
Submodule
@@ -1,14 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 138 44">
|
|
||||||
<defs>
|
|
||||||
<path id="a" d="M0 0h138v44H0z"/>
|
|
||||||
</defs>
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<mask id="b" fill="#fff">
|
|
||||||
<use xlink:href="#a"/>
|
|
||||||
</mask>
|
|
||||||
<g fill-rule="nonzero" mask="url(#b)">
|
|
||||||
<path fill="#000" d="M3.08 0A3.07 3.07 0 0 0 0 3.07v37.86A3.07 3.07 0 0 0 3.08 44h131.7a3.07 3.07 0 0 0 3.08-3.07V3.07A3.07 3.07 0 0 0 134.8 0H3.06z"/>
|
|
||||||
<path fill="#FFF" d="M40.64 8.24v6.82h2.3c2.22 0 3-1.45 3-3.42 0-2-.8-3.4-3-3.4h-2.3zm1.03.94h1.17c1.5 0 2.05 1 2.05 2.48 0 1.7-.7 2.46-2.1 2.46h-1.2V9.18zm7.84.52c-1.3 0-2.3.93-2.3 2.37v.7c0 1.53 1 2.38 2.3 2.38 1.4 0 2.4-.86 2.4-2.4v-.68c0-1.5-.9-2.37-2.3-2.37zm0 .87c.9 0 1.3.66 1.3 1.55v.6c0 .9-.4 1.55-1.3 1.55-.8 0-1.3-.65-1.3-1.55v-.6c0-.9.5-1.55 1.3-1.55zm10.4-.8h-1l-.9 4.05-1.2-4.04h-.9l-1.1 4.04-.9-4.04h-1.1l1.4 5.28h1.1l1.1-3.9 1.18 3.9h1zM61 15.1h1v-3c0-.87.45-1.5 1.33-1.5.66 0 1.08.37 1.08 1.18v3.26h1.1V11.5c0-1.2-.7-1.8-1.8-1.8-1 0-1.4.62-1.6 1.03H62v-.95h-1v5.28zm6.16 0h1V7.9h-1zM72 9.68c-1.36 0-2.32.93-2.32 2.37v.7c0 1.53.95 2.38 2.3 2.38 1.36 0 2.33-.86 2.33-2.4v-.68c0-1.5-.9-2.37-2.3-2.37zm0 .87c.8 0 1.28.66 1.28 1.55v.6c0 .9-.45 1.55-1.3 1.55-.84 0-1.3-.65-1.3-1.55v-.6c0-.9.5-1.55 1.3-1.55zm5.22 4.58c.78 0 1.25-.37 1.5-.77h.04v.68h.96v-3.58c0-1.3-.9-1.78-2.03-1.78-1.3 0-2 .6-2 1.47h.9c.1-.35.3-.6 1-.6.6 0 1 .28 1 .9v.5h-1.3c-1.2 0-1.9.63-1.9 1.56 0 1 .7 1.7 1.7 1.7zm.3-.84c-.53 0-1-.3-1-.9 0-.5.28-.8.96-.8h1.23v.5c0 .6-.5 1-1.1 1zm5.7-4.6c-1.26 0-2.05.9-2.05 2.2v.9c0 1.4.8 2.2 2.02 2.2.8 0 1.4-.5 1.5-.9v.9h1V7.9h-1v2.7h-.1c-.2-.46-.7-.87-1.6-.87zm.23.9c.78 0 1.33.5 1.33 1.3v.8c0 .9-.52 1.4-1.3 1.4-.8 0-1.3-.6-1.3-1.5V12c0-1 .5-1.53 1.27-1.53zm8.46-.9c-1.3 0-2.3.9-2.3 2.3v.7c0 1.5 1 2.4 2.3 2.4 1.4 0 2.4-.9 2.4-2.4V12c0-1.5-.9-2.37-2.3-2.37zm0 .8c.9 0 1.3.6 1.3 1.5v.6c0 .9-.4 1.5-1.3 1.5-.8 0-1.3-.7-1.3-1.6V12c0-.9.5-1.52 1.3-1.52zm3.8 4.5h1v-2.9c0-.9.5-1.5 1.4-1.5.7 0 1.1.3 1.1 1.1V15h1.1v-3.5c0-1.2-.7-1.8-1.8-1.8s-1.4.62-1.6 1.03v-.95h-1v5.28zm8.8-5.3h-.8v.8h.8v2.9c0 1 .3 1.5 1.6 1.5.2 0 .6-.1.7-.1V14l-.4.05c-.6 0-.8-.14-.8-.7v-2.8h1.2v-.8h-1.2V8.5h-1v1.32zm3.6 5.2h1V12c0-.86.5-1.5 1.3-1.5.7 0 1.2.4 1.2 1.2V15h1v-3.5c0-1.2-.7-1.8-1.7-1.8-1.1 0-1.5.66-1.6 1.03V7.88h-1v7.18zm8.2.1c1.4 0 2-.9 2.1-1.5h-1c-.1.3-.5.6-1.1.6-.8 0-1.3-.6-1.3-1.3v-.3h3.5V12c0-1.44-.9-2.36-2.2-2.36-1.3 0-2.2.86-2.2 2.35v.7c0 1.5.9 2.3 2.3 2.3zm-1.3-3.2v-.1c0-.8.5-1.4 1.3-1.4s1.3.5 1.3 1.3v.1H115zM41.7 33.5l1.16-3.67h4.72l1.16 3.68h2.6L46.7 19.9h-2.8l-4.67 13.6h2.44zm3.58-11.18L47.03 28h-3.67l1.8-5.68h.1zM58.5 33.65c2.42 0 4-1.72 4-4.78V27.6c0-3.08-1.6-4.8-3.97-4.8-1.65 0-2.72.7-3.14 1.66h-.1v-1.53H53v14.15h2.36v-5.06h.1c.44.9 1.4 1.63 3.04 1.63zm-.73-1.92c-1.52 0-2.42-1.3-2.42-3v-1.08c0-1.77.9-2.94 2.38-2.94 1.46 0 2.37 1.1 2.37 3.1v.9c0 2.1-1 3.1-2.36 3.1zm12.53 1.92c2.4 0 4-1.72 4-4.78V27.6c0-3.08-1.6-4.8-4-4.8-1.64 0-2.7.7-3.13 1.66h-.1v-1.53h-2.3v14.15h2.35v-5.06h.1c.44.9 1.4 1.63 3.04 1.63zm-.75-1.92c-1.52 0-2.42-1.3-2.42-3v-1.08c0-1.77.9-2.94 2.38-2.94s2.4 1.1 2.4 3.1v.9c0 2.1-.9 3.1-2.3 3.1zm10.3-2.04c.05 1.8 1.33 4 5.18 4 3.17 0 5.33-1.6 5.33-4.2 0-2.4-1.6-3.4-3.63-3.8l-2.2-.6c-1.26-.3-1.9-.9-1.9-1.8 0-1.2 1.03-1.9 2.55-1.9 1.72 0 2.6.9 2.7 2h2.3c-.06-2.5-2.23-4-4.98-4-2.7 0-5 1.4-5 4.03 0 2.23 1.6 3.3 3.4 3.7l2.2.53c1.43.36 2.13.9 2.13 1.9 0 1.24-1 2.04-2.73 2.04-1.9 0-2.9-1-3-2.1h-2.35zM93.4 23h-1.52v1.85h1.48v5.66c0 2.2.76 3.1 3.37 3.1.48 0 .9 0 1.1-.1v-1.8c-.13.1-.32.1-.52.1-1.1 0-1.6-.3-1.6-1.4v-5.5h2.1V23h-2.1v-2.65h-2.3V23zm10.7-.26c-3.18 0-4.76 2.17-4.76 5.08v.75c0 3.1 1.58 5.1 4.76 5.1 3.2 0 4.76-2.03 4.76-5.12v-.75c0-3-1.57-5.07-4.76-5.07zm0 1.86c1.84 0 2.37 1.58 2.37 3.3v.6c0 1.7-.52 3.3-2.37 3.3s-2.4-1.6-2.4-3.3v-.6c0-1.7.56-3.3 2.4-3.3zm7.13 8.9h2.4v-6.2c0-1.42.6-2.46 2.37-2.46.4 0 .8.02.98.08v-2.07c-.2-.04-.46-.07-.78-.07-1.68 0-2.26.87-2.52 1.53h-.1V23h-2.35v10.5zm11.54.17c3 0 4.17-1.87 4.34-3.3h-2.2c-.1.75-.7 1.42-2 1.42-1.6 0-2.4-1.3-2.4-2.8v-.4h6.9v-1c0-3-1.6-5.1-4.6-5.1-2.9 0-4.6 1.95-4.6 5.02v.9c0 3.1 1.7 5 4.8 5zm-2.4-6.54v-.02c0-1.4.86-2.5 2.28-2.5 1.4 0 2.26 1.1 2.26 2.6v.1h-4.5zM25.2 22.8c-.02-3.27 2.7-4.87 2.82-4.94-1.54-2.25-3.92-2.55-4.75-2.58-2-.2-3.94 1.2-4.96 1.2s-2.6-1.18-4.3-1.14c-2.1.03-4.2 1.3-5.3 3.25-2.3 4-.6 9.8 1.6 13.1 1.1 1.5 2.4 3.3 4.1 3.2 1.7-.1 2.3-1.1 4.3-1.1s2.6 1 4.3 1c1.8 0 2.9-1.6 4-3.2 1.3-1.8 1.8-3.6 1.8-3.7 0 0-3.4-1.3-3.4-5.3zm-3.24-9.64c.9-1.1 1.5-2.63 1.33-4.17-1.3 0-2.9.9-3.9 1.9-.8.9-1.6 2.5-1.4 4 1.4.1 2.9-.7 3.8-1.8z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 4.4 KiB |
@@ -1,41 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 138 44">
|
|
||||||
<defs>
|
|
||||||
<path id="a" d="M0 0h138v44H0z"/>
|
|
||||||
<linearGradient id="c" x1="60.16%" x2="33.56%" y1="91.85%" y2="-59.59%">
|
|
||||||
<stop offset="0%" stop-color="#D6FFA1"/>
|
|
||||||
<stop offset="32.64%" stop-color="#93E2A7"/>
|
|
||||||
<stop offset="100%" stop-color="#00A3B5"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="d" x1="-32.17%" x2="80.17%" y1="-129.74%" y2="114%">
|
|
||||||
<stop offset="0%" stop-color="#FF177B"/>
|
|
||||||
<stop offset="67.21%" stop-color="#FFA976"/>
|
|
||||||
<stop offset="100%" stop-color="#FFEC73"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="e" x1="50.82%" x2="-.03%" y1="74.66%" y2="-29.34%">
|
|
||||||
<stop offset="0%" stop-color="#63FFD4"/>
|
|
||||||
<stop offset="48.54%" stop-color="#32A0BA"/>
|
|
||||||
<stop offset="83.49%" stop-color="#1262A9"/>
|
|
||||||
<stop offset="100%" stop-color="#064AA2"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="f" x1="119.51%" x2="-23.11%" y1="35.53%" y2="61.01%">
|
|
||||||
<stop offset="0%" stop-color="#FF4521"/>
|
|
||||||
<stop offset="34.11%" stop-color="#D43E65"/>
|
|
||||||
<stop offset="79.35%" stop-color="#9F36B9"/>
|
|
||||||
<stop offset="100%" stop-color="#8A33DB"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<mask id="b" fill="#fff">
|
|
||||||
<use xlink:href="#a"/>
|
|
||||||
</mask>
|
|
||||||
<g fill-rule="nonzero" mask="url(#b)">
|
|
||||||
<path fill="#000" d="M3.07 0A3.07 3.07 0 0 0 0 3.07v37.86A3.07 3.07 0 0 0 3.07 44h131.86a3.07 3.07 0 0 0 3.07-3.07V3.07A3.07 3.07 0 0 0 134.93 0H3.07z"/>
|
|
||||||
<path fill="#FFF" d="M37.83 13.23h-2.25l-.47 1.35h-1l2.2-5.82h.9l2.2 5.82h-1.1l-.4-1.35zm-1.96-.82h1.68L36.7 10l-.83 2.4zm8.77 2.2h-1l-2.6-4.1v4.2h-1V8.8h1l2.6 4.15V8.8h1zm1.2 0V8.8h1.7c.52 0 .98.12 1.38.34.4.23.7.56.92.98.22.42.33.9.33 1.45v.3c0 .54-.1 1.03-.33 1.44-.22.4-.53.8-.94 1-.4.3-.87.4-1.4.4h-1.67zm1-5v4.2h.66c.53 0 .94-.1 1.22-.5.28-.3.43-.8.43-1.4v-.3c0-.6-.13-1.1-.4-1.4-.28-.3-.68-.5-1.2-.5h-.7zm6.47 2.8h-1.1v2.3h-1V8.8h2.1c.7 0 1.2.15 1.6.45.4.3.6.8.6 1.37 0 .4-.1.7-.3.98a1.78 1.78 0 0 1-.8.6l1.4 2.46v.05h-1.1l-1.2-2.2zm-1.1-.8h1.1c.4 0 .6-.1.8-.2.2-.1.3-.4.3-.7 0-.3-.1-.5-.3-.7-.1-.1-.4-.2-.8-.2h-1.1v2zm8.8.3c0 .6-.1 1.1-.3 1.5-.2.5-.5.8-.8 1-.3.3-.8.4-1.2.4s-.9-.1-1.2-.3a2.3 2.3 0 0 1-.8-1c-.2-.4-.3-.9-.3-1.4v-.3c0-.5.1-1 .3-1.5.2-.4.5-.7.9-1a2.3 2.3 0 0 1 1.2-.3c.5 0 .9.1 1.3.4.4.2.7.6.9 1 .2.5.3 1 .3 1.5v.3zm-1-.3c0-.6-.1-1.1-.4-1.5-.2-.3-.6-.5-1-.5s-.7.2-1 .5c-.2.4-.3.8-.3 1.5v.4c0 .7.2 1.2.4 1.5.3.4.6.5 1.1.5.5 0 .8-.1 1.1-.5.3-.3.4-.8.4-1.5v-.3zm3 3h-1V8.8h1zm1.3 0V8.8H66c.5 0 .96.12 1.35.34.5.2.8.5 1 .9.2.44.34.9.34 1.47v.3c0 .6-.1 1.1-.4 1.5-.2.5-.6.8-1 1-.4.2-.9.4-1.4.4h-1.7zm1-5v4.2h.7c.6 0 1-.1 1.3-.5.3-.3.5-.8.5-1.4v-.3c0-.6-.1-1.1-.4-1.4-.3-.4-.7-.5-1.2-.5h-.7zm9.7 3.7h-2.3l-.4 1.4h-1.1l2.2-5.9h.9l2.2 5.9h-1.1l-.4-1.3zm-2-.8h1.7l-.8-2.4-.8 2.4zm5.2 0v2.2h-1V8.8h2.2c.7 0 1.2.17 1.6.5.4.35.6.8.6 1.35 0 .6-.2 1.1-.5 1.4-.4.3-.9.5-1.6.5h-1.2zm0-.8h1.2c.4 0 .7-.1.9-.2.2-.1.3-.4.3-.7 0-.3-.1-.5-.3-.7-.2-.2-.4-.3-.8-.3h-1.2v2zm5.3.8v2.2h-1V8.8h2.2c.7 0 1.2.17 1.6.5.4.35.6.8.6 1.35 0 .6-.1 1.1-.5 1.4-.3.3-.9.5-1.5.5h-1.2zm0-.8h1.2c.4 0 .7-.1.9-.2.2-.1.3-.4.3-.7 0-.3-.1-.5-.3-.7-.2-.2-.4-.3-.8-.3h-1.3v2zm10.9.2c0 .6-.1 1.1-.3 1.5-.2.5-.4.8-.8 1-.4.3-.8.4-1.3.4s-.9-.1-1.3-.3a2.3 2.3 0 0 1-.9-1c-.2-.4-.3-.9-.3-1.4v-.3c0-.5.1-1 .3-1.5.2-.4.5-.7.9-1a2.3 2.3 0 0 1 1.3-.4c.5 0 .9.2 1.3.4s.7.6.9 1c.2.5.3 1 .3 1.5v.3zm-1-.3c0-.6-.1-1.1-.3-1.5-.2-.3-.6-.5-1-.5s-.8.2-1 .5c-.2.4-.4.8-.4 1.5v.4c0 .7.1 1.2.4 1.5.3.4.6.5 1.1.5.4 0 .7-.1 1-.5.2-.3.36-.8.36-1.5v-.3zm6.6 3.1h-1l-2.6-4.1v4.2h-1v-6h1L99 13V8.8h1z"/>
|
|
||||||
<path fill="url(#c)" d="M14.46 7.57L1.02.2C.66 0 .32-.04 0 .06l11.04 11 3.42-3.48z" transform="translate(8.33 16.577)"/>
|
|
||||||
<path fill="url(#d)" d="M3.48 6.9l4.6-2.5c.92-.5.92-1.33 0-1.84L3.48 0 0 3.43 3.48 6.9z" transform="translate(19.37 24.2)"/>
|
|
||||||
<path fill="url(#e)" d="M.66 0C.26.15 0 .56 0 1.18v19.75c0 .6.26 1.02.66 1.17L11.7 11.05.66 0z" transform="translate(7.667 16.577)"/>
|
|
||||||
<path fill="url(#f)" d="M0 11.05c.3.1.66.05 1.02-.15l13.44-7.42L11.04 0 0 11.05z" transform="translate(8.33 27.628)"/>
|
|
||||||
<path fill="#FFF" d="M119.97 37.86l5.76-13.3h-1.87l-2.67 6.63h-.1l-2.8-6.7h-1.9l3.8 8.6-2.2 4.6h1.7m-11.7-11c.3-.8 1.4-2.2 3.7-2.2 2.2 0 4.1 1.3 4.1 3.9V34h-1.7v-1.26h-.1c-.5.76-1.5 1.56-3.1 1.56-1.9 0-3.5-1.15-3.5-3.05 0-2.07 1.8-3.2 4-3.2 1.2 0 2.1.36 2.5.57v-.26c0-1.38-1.1-2.22-2.4-2.22-1 0-1.9.47-2.2 1.32l-1.6-.67zm1.4 4.5c0 .9 1 1.4 1.9 1.4 1.4 0 2.8-1.2 2.8-2.7 0 0-.8-.6-2.2-.6-1.8 0-2.6.9-2.6 1.8zM105 20.9h1.5v13.3H105zm-10.3 0h4.5c2.2 0 4.17 1.6 4.17 3.9s-1.95 3.9-4.16 3.9h-2.8v5.34H95V20.9zm1.7 6.3h2.84c1.53 0 2.4-1.2 2.4-2.3s-.86-2.3-2.4-2.3h-2.8v4.7zM89 32.3c-.5.8-1.7 2-3.8 2-2.6 0-4.5-1.9-4.5-4.4 0-2.7 1.92-4.5 4.3-4.5 2.32 0 3.5 1.8 3.9 2.8l.2.5-6.1 2.5c.45.9 1.2 1.34 2.2 1.34 1 0 1.7-.5 2.22-1.24l1.53 1zm-3.97-5.2c-1 0-2.4.9-2.38 2.6l4.1-1.6c-.25-.6-.9-1-1.7-1zm-7.3 7h2V20.9h-2zm-1.38-.4c0 3.3-2 4.7-4.35 4.7-2.2 0-3.5-1.5-4-2.6l2-.8c.3.7 1.08 1.57 2.3 1.57 1.5 0 2.43-.9 2.43-2.62v-.64h-.07c-.45.6-1.3 1-2.4 1-2.26 0-4.34-1.9-4.34-4.4s2.07-4.5 4.34-4.5c1.08 0 1.94.5 2.4 1h.06v-.7h1.9v8.1zm-6.7-3.8c0 1.6 1.1 2.7 2.5 2.7s2.4-1.1 2.4-2.7-1.05-2.7-2.4-2.7c-1.4 0-2.53 1.2-2.53 2.7zm-2.86 0c0 2.6-2.1 4.5-4.6 4.5-2.5 0-4.6-1.9-4.6-4.5s2-4.5 4.5-4.5 4.52 1.9 4.52 4.5zm-7.1 0c0 1.6 1.1 2.7 2.5 2.7s2.6-1.1 2.6-2.7-1.2-2.7-2.6-2.7-2.6 1.1-2.6 2.7zm-2.9 0c0 2.6-2.1 4.5-4.6 4.5-2.5 0-4.6-1.9-4.6-4.5s2.02-4.5 4.53-4.5c2.5 0 4.6 1.9 4.6 4.5zm-7.1 0c0 1.6 1.2 2.7 2.5 2.7 1.4 0 2.6-1.1 2.6-2.7s-1.2-2.7-2.6-2.7c-1.4 0-2.58 1.1-2.58 2.7zm-9.2 4.4c2.1 0 3.6-.6 4.9-1.9 1.3-1.2 1.6-3 1.6-4.4a6.1 6.1 0 0 0-.1-1.2h-6.4v1.9h4.6c-.2 1-.5 1.8-1.1 2.4-.66.6-1.7 1.4-3.54 1.4a5.02 5.02 0 0 1-5.1-5.1 5.02 5.02 0 0 1 5.1-5.1 4.95 4.95 0 0 1 3.5 1.3l1.3-1.34c-1.2-1.1-2.7-1.93-4.87-1.93-3.9 0-7.13 3.1-7.13 6.92s3.3 6.94 7.2 6.94z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 5.8 KiB |
@@ -1,9 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 27">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path fill="#F8E419" d="M8.082 18.86l.002-.002a7.554 7.554 0 0 1-2.195-5.332c0-2.082.84-3.968 2.193-5.333L8.08 8.19a2.977 2.977 0 0 0 0-4.19 2.93 2.93 0 0 0-4.16 0A13.475 13.475 0 0 0 0 13.524a13.47 13.47 0 0 0 3.92 9.526 2.93 2.93 0 0 0 4.163 0 2.977 2.977 0 0 0 0-4.19"/>
|
|
||||||
<path fill="#56AED2" d="M8.268 8.14l.003.002a7.448 7.448 0 0 1 5.297-2.212c2.068 0 3.94.847 5.296 2.214l.005-.004a2.926 2.926 0 0 0 4.16 0 2.98 2.98 0 0 0 0-4.193A13.285 13.285 0 0 0 13.565 0a13.28 13.28 0 0 0-9.46 3.947 2.98 2.98 0 0 0 0 4.193 2.926 2.926 0 0 0 4.163 0"/>
|
|
||||||
<path fill="#E0534E" d="M18.863 18.65l-.003-.003a7.448 7.448 0 0 1-5.294 2.21 7.436 7.436 0 0 1-5.295-2.212v.004a2.926 2.926 0 0 0-4.16 0 2.98 2.98 0 0 0 0 4.19 13.285 13.285 0 0 0 9.46 3.946 13.28 13.28 0 0 0 9.46-3.948 2.98 2.98 0 0 0 0-4.194 2.926 2.926 0 0 0-4.163 0"/>
|
|
||||||
<path fill="#1E78A4" d="M8.27 8.352a2.93 2.93 0 0 1-4.164 0 2.977 2.977 0 0 1 0-4.19 2.93 2.93 0 0 1 4.163 0 2.977 2.977 0 0 1 0 4.19"/>
|
|
||||||
<path fill="#BE433B" d="M8.27 22.84a2.93 2.93 0 0 1-4.164 0 2.977 2.977 0 0 1 0-4.19 2.93 2.93 0 0 1 4.163 0 2.977 2.977 0 0 1 0 4.19"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,3 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="5" height="8" viewBox="0 0 5 8">
|
|
||||||
<path fill="none" fill-rule="evenodd" stroke="#8091A5" stroke-width="1.5" d="M1 7l3-2.89L1 1"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 187 B |
@@ -1,7 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M12 2C6.46 2 2 6.48 2 12s4.47 10 10 10c5.52 0 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/>
|
|
||||||
<path d="M0 0h24v24H0z"/>
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M12.5 7H11v6l5.25 3.15.75-1.23-4.5-2.67z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 418 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path d="M-2-2h24v24H-2z"/>
|
|
||||||
<path fill="#CD3F39" fill-rule="nonzero" d="M10 0C4.48 0 0 4.48 0 10s4.48 10 10 10 10-4.48 10-10S15.52 0 10 0zm1 15H9v-2h2v2zm0-4H9V5h2v6z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 291 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M12 0C5.38 0 0 5.38 0 12s5.38 12 12 12 12-5.38 12-12S18.62 0 12 0zm3.6 11.5h-2.1v7h-3v-7h-2v-2h2V8.34c0-1.1.35-2.82 2.65-2.82h2.35v2.3h-1.4c-.25 0-.6.13-.6.66V9.5h2.34l-.24 2z"/>
|
|
||||||
<path d="M0 0h24v24H0z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 370 B |
@@ -1,3 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 33">
|
|
||||||
<path fill="#abc6e5" fill-rule="evenodd" d="M16.608.455C7.614.455.32 7.748.32 16.745c0 7.197 4.667 13.302 11.14 15.456.815.15 1.112-.352 1.112-.784 0-.386-.014-1.41-.022-2.77-4.53.984-5.487-2.184-5.487-2.184-.74-1.882-1.81-2.383-1.81-2.383-1.478-1.01.113-.99.113-.99C7 23.203 7.86 24.767 7.86 24.767c1.454 2.49 3.814 1.77 4.742 1.353.148-1.05.57-1.77 1.034-2.176-3.617-.41-7.42-1.81-7.42-8.05 0-1.78.635-3.234 1.677-4.372-.168-.412-.727-2.07.16-4.31 0 0 1.367-.44 4.48 1.67 1.298-.363 2.692-.543 4.077-.55 1.384.007 2.777.187 4.078.55 3.11-2.11 4.475-1.67 4.475-1.67.89 2.24.33 3.898.163 4.31C26.37 12.66 27 14.115 27 15.892c0 6.26-3.81 7.636-7.437 8.04.584.502 1.105 1.496 1.105 3.016 0 2.177-.02 3.934-.02 4.468 0 .436.294.943 1.12.784 6.468-2.16 11.13-8.26 11.13-15.455 0-8.997-7.293-16.29-16.29-16.29"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 878 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path d="M-2 22h24V-2H-2z"/>
|
|
||||||
<path fill="#FFF" fill-rule="nonzero" d="M10 20C4.48 20 0 15.52 0 10S4.48 0 10 0s10 4.48 10 10-4.48 10-10 10zm1-15H9v2h2V5zm0 4H9v6h2V9z" opacity=".6"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 303 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z"/>
|
|
||||||
<path d="M0 0h24v24H0z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 316 B |
@@ -1,4 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
||||||
<path fill="none" d="M-1-1h582v402H-1z"/>
|
|
||||||
<path fill="#0EB87F" fill-rule="evenodd" d="M10 15.5c-2.33 0-4.31-1.46-5.11-3.5h10.22c-.8 2.04-2.78 3.5-5.11 3.5M13.5 9a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3m-7 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3m3.5 9c4.42 0 8-3.58 8-8s-3.58-8-8-8-8 3.58-8 8 3.58 8 8 8m.01-18C15.53 0 20 4.48 20 10s-4.47 10-9.99 10C4.48 20 0 15.52 0 10S4.48 0 10.01 0"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 457 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M12 0C5.38 0 0 5.38 0 12s5.38 12 12 12 12-5.38 12-12S18.62 0 12 0zm5.26 9.38v.34c0 3.48-2.64 7.5-7.48 7.5A7.45 7.45 0 0 1 5.75 16a5.3 5.3 0 0 0 3.9-1.08A2.64 2.64 0 0 1 7.2 13.1c.37.1.8.06 1.16-.04a2.63 2.63 0 0 1-2.1-2.58v-.05c.35.2.76.32 1.2.33a2.63 2.63 0 0 1-.83-3.5A7.46 7.46 0 0 0 12.07 10a2.63 2.63 0 0 1 4.48-2.4c.6-.12 1.95-.27 1.95-.27-.35.53-.72 1.66-1.24 2.03z"/>
|
|
||||||
<path d="M0 0h24v24H0z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 567 B |
@@ -1,6 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 11">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<path d="M0-3h17v17H0z"/>
|
|
||||||
<path fill="#A9B9C0" fill-rule="nonzero" d="M8.5.188C4.958.188 1.934 2.39.708 5.5c1.226 3.11 4.25 5.313 7.792 5.313S15.066 8.61 16.292 5.5C15.066 2.39 12.042.187 8.5.187zm0 8.854A3.543 3.543 0 0 1 4.958 5.5 3.543 3.543 0 0 1 8.5 1.958 3.543 3.543 0 0 1 12.042 5.5 3.543 3.543 0 0 1 8.5 9.042zm0-5.667c-1.176 0-2.125.95-2.125 2.125 0 1.176.95 2.125 2.125 2.125 1.176 0 2.125-.95 2.125-2.125 0-1.176-.95-2.125-2.125-2.125z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 571 B |
@@ -1,17 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 168 43">
|
|
||||||
<g fill="none" fill-rule="evenodd">
|
|
||||||
<g transform="translate(0 2)">
|
|
||||||
<path fill="#D9453F" d="M3.75 37v-7.1H28V37z"/>
|
|
||||||
<circle cx="9.3" cy="14.3" r="9.3" fill="#F5A623"/>
|
|
||||||
<path fill="#3C80CF" d="M35 27.6L19 .4h16z"/>
|
|
||||||
</g>
|
|
||||||
<g font-size="20">
|
|
||||||
<text fill="#2A3039" font-family="AvenirNext-Bold, Avenir Next" font-weight="bold" letter-spacing="-.3" transform="translate(45 18)">
|
|
||||||
<tspan x="0" y="20">example app</tspan>
|
|
||||||
</text>
|
|
||||||
<text fill="#8091A5" font-family="PTSerif-Italic, PT Serif" font-style="italic" transform="translate(45 -27)">
|
|
||||||
<tspan x="0" y="43">The</tspan>
|
|
||||||
</text>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 727 B |
1
public/scripts/hoverintent.min.js
vendored
@@ -1 +0,0 @@
|
|||||||
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.hoverintent=e()}}(function(){return function e(t,n,o){function r(u,f){if(!n[u]){if(!t[u]){var s="function"==typeof require&&require;if(!f&&s)return s(u,!0);if(i)return i(u,!0);var c=new Error("Cannot find module '"+u+"'");throw c.code="MODULE_NOT_FOUND",c}var a=n[u]={exports:{}};t[u][0].call(a.exports,function(e){var n=t[u][1][e];return r(n||e)},a,a.exports,e,t,n,o)}return n[u].exports}for(var i="function"==typeof require&&require,u=0;u<o.length;u++)r(o[u]);return r}({1:[function(e,t,n){"use strict";var o=e("xtend");t.exports=function(e,t,n){function r(e,t){return p&&(p=clearTimeout(p)),d=0,n.call(e,t)}function i(e){c=e.clientX,a=e.clientY}function u(e,n){if(p&&(p=clearTimeout(p)),Math.abs(v-c)+Math.abs(l-a)<y.sensitivity)return d=1,t.call(e,n);v=c,l=a,p=setTimeout(function(){u(e,n)},y.interval)}function f(t){return p&&(p=clearTimeout(p)),e.removeEventListener("mousemove",i,!1),1!==d&&(v=t.clientX,l=t.clientY,e.addEventListener("mousemove",i,!1),p=setTimeout(function(){u(e,t)},y.interval)),this}function s(t){return p&&(p=clearTimeout(p)),e.removeEventListener("mousemove",i,!1),1===d&&(p=setTimeout(function(){r(e,t)},y.timeout)),this}var c,a,v,l,m={},d=0,p=0,y={sensitivity:7,interval:100,timeout:0};return m.options=function(e){return y=o({},y,e),m},m.remove=function(){e&&(e.removeEventListener("mouseover",f,!1),e.removeEventListener("mouseout",s,!1))},e&&(e.addEventListener("mouseover",f,!1),e.addEventListener("mouseout",s,!1)),m}},{xtend:2}],2:[function(e,t,n){function o(){for(var e={},t=0;t<arguments.length;t++){var n=arguments[t];for(var o in n)r.call(n,o)&&(e[o]=n[o])}return e}t.exports=o;var r=Object.prototype.hasOwnProperty},{}]},{},[1])(1)});
|
|
||||||
@@ -1,75 +0,0 @@
|
|||||||
document.addEventListener('DOMContentLoaded', () => {
|
|
||||||
// Header dropdowns
|
|
||||||
const controls = document.querySelectorAll('.header__controls_group')
|
|
||||||
|
|
||||||
controls.forEach((control) => {
|
|
||||||
const ref = control.querySelector('.header__controls_label')
|
|
||||||
const dropdownRef = control.querySelector('.header__controls_dropdown')
|
|
||||||
|
|
||||||
let popper = null
|
|
||||||
|
|
||||||
hoverintent(control, null, () => {
|
|
||||||
if (popper) {
|
|
||||||
dropdownRef.classList.remove('header__controls_dropdown--active')
|
|
||||||
window.setTimeout(popper.destroy, 500)
|
|
||||||
}
|
|
||||||
}).options({
|
|
||||||
sensitivity: 10,
|
|
||||||
interval: 150,
|
|
||||||
timeout: 300
|
|
||||||
})
|
|
||||||
|
|
||||||
ref.addEventListener('click', (e) => {
|
|
||||||
dropdownRef.classList.add('header__controls_dropdown--active')
|
|
||||||
popper = new Popper(
|
|
||||||
e.target,
|
|
||||||
dropdownRef,
|
|
||||||
{
|
|
||||||
// popper options here
|
|
||||||
}
|
|
||||||
)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
// const apiRef =
|
|
||||||
// const apiDropdownRef = document.querySelector('#control-api .header__controls_dropdown')
|
|
||||||
|
|
||||||
// const apiTooltip =
|
|
||||||
|
|
||||||
// Init highlight.js
|
|
||||||
hljs.initHighlightingOnLoad()
|
|
||||||
|
|
||||||
// apply textFit to module headlines
|
|
||||||
textFit(document.getElementsByClassName('module-higlighted-course__title'), {multiLine: false})
|
|
||||||
|
|
||||||
// Lesson code switcher logic
|
|
||||||
const modules = Array.from(document.getElementsByClassName('lesson-module-code'))
|
|
||||||
|
|
||||||
modules.forEach((module) => {
|
|
||||||
const triggers = Array.from(module.getElementsByClassName('lesson-module-code__trigger'))
|
|
||||||
const codes = Array.from(module.getElementsByClassName('lesson-module-code__code'))
|
|
||||||
|
|
||||||
const handleTriggerClick = (e) => {
|
|
||||||
const target = e.target.getAttribute('data-target')
|
|
||||||
|
|
||||||
// Mark correct trigger as active
|
|
||||||
triggers.forEach((trigger) => {
|
|
||||||
trigger.classList.remove('lesson-module-code__trigger--active')
|
|
||||||
})
|
|
||||||
e.target.classList.add('lesson-module-code__trigger--active')
|
|
||||||
|
|
||||||
// Show correct code fields
|
|
||||||
codes.forEach((code) => {
|
|
||||||
code.classList.remove('lesson-module-code__code--active')
|
|
||||||
if (code.id === target) {
|
|
||||||
code.classList.add('lesson-module-code__code--active')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// Attach click handler to triggers
|
|
||||||
triggers.forEach((trigger) => {
|
|
||||||
trigger.onclick = handleTriggerClick
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
5
public/scripts/popper.min.js
vendored
1
public/scripts/textFit.min.js
vendored
@@ -1 +0,0 @@
|
|||||||
(function(root,factory){"use strict";if(typeof define==="function"&&define.amd){define([],factory)}else if(typeof exports==="object"){module.exports=factory()}else{root.textFit=factory()}})(typeof global==="object"?global:this,function(){"use strict";var defaultSettings={alignVert:false,alignHoriz:false,multiLine:false,detectMultiLine:true,minFontSize:6,maxFontSize:80,reProcess:true,widthOnly:false,alignVertWithFlexbox:false};return function textFit(els,options){if(!options)options={};var settings={};for(var key in defaultSettings){if(options.hasOwnProperty(key)){settings[key]=options[key]}else{settings[key]=defaultSettings[key]}}if(typeof els.toArray==="function"){els=els.toArray()}var elType=Object.prototype.toString.call(els);if(elType!=="[object Array]"&&elType!=="[object NodeList]"&&elType!=="[object HTMLCollection]"){els=[els]}for(var i=0;i<els.length;i++){processItem(els[i],settings)}};function processItem(el,settings){if(!isElement(el)||!settings.reProcess&&el.getAttribute("textFitted")){return false}if(!settings.reProcess){el.setAttribute("textFitted",1)}var innerSpan,originalHeight,originalHTML,originalWidth;var low,mid,high;originalHTML=el.innerHTML;originalWidth=innerWidth(el);originalHeight=innerHeight(el);if(!originalWidth||!settings.widthOnly&&!originalHeight){if(!settings.widthOnly)throw new Error("Set a static height and width on the target element "+el.outerHTML+" before using textFit!");else throw new Error("Set a static width on the target element "+el.outerHTML+" before using textFit!")}if(originalHTML.indexOf("textFitted")===-1){innerSpan=document.createElement("span");innerSpan.className="textFitted";innerSpan.style["display"]="inline-block";innerSpan.innerHTML=originalHTML;el.innerHTML="";el.appendChild(innerSpan)}else{innerSpan=el.querySelector("span.textFitted");if(hasClass(innerSpan,"textFitAlignVert")){innerSpan.className=innerSpan.className.replace("textFitAlignVert","");innerSpan.style["height"]="";el.className.replace("textFitAlignVertFlex","")}}if(settings.alignHoriz){el.style["text-align"]="center";innerSpan.style["text-align"]="center"}var multiLine=settings.multiLine;if(settings.detectMultiLine&&!multiLine&&innerSpan.scrollHeight>=parseInt(window.getComputedStyle(innerSpan)["font-size"],10)*2){multiLine=true}if(!multiLine){el.style["white-space"]="nowrap"}low=settings.minFontSize+1;high=settings.maxFontSize+1;while(low<=high){mid=parseInt((low+high)/2,10);innerSpan.style.fontSize=mid+"px";if(innerSpan.scrollWidth<=originalWidth&&(settings.widthOnly||innerSpan.scrollHeight<=originalHeight)){low=mid+1}else{high=mid-1}}innerSpan.style.fontSize=mid-1+"px";if(settings.alignVert){addStyleSheet();var height=innerSpan.scrollHeight;if(window.getComputedStyle(el)["position"]==="static"){el.style["position"]="relative"}if(!hasClass(innerSpan,"textFitAlignVert")){innerSpan.className=innerSpan.className+" textFitAlignVert"}innerSpan.style["height"]=height+"px";if(settings.alignVertWithFlexbox&&!hasClass(el,"textFitAlignVertFlex")){el.className=el.className+" textFitAlignVertFlex"}}}function innerHeight(el){var style=window.getComputedStyle(el,null);return el.clientHeight-parseInt(style.getPropertyValue("padding-top"),10)-parseInt(style.getPropertyValue("padding-bottom"),10)}function innerWidth(el){var style=window.getComputedStyle(el,null);return el.clientWidth-parseInt(style.getPropertyValue("padding-left"),10)-parseInt(style.getPropertyValue("padding-right"),10)}function isElement(o){return typeof HTMLElement==="object"?o instanceof HTMLElement:o&&typeof o==="object"&&o!==null&&o.nodeType===1&&typeof o.nodeName==="string"}function hasClass(element,cls){return(" "+element.className+" ").indexOf(" "+cls+" ")>-1}function addStyleSheet(){if(document.getElementById("textFitStyleSheet"))return;var style=[".textFitAlignVert{","position: absolute;","top: 0; right: 0; bottom: 0; left: 0;","margin: auto;","display: flex;","justify-content: center;","flex-direction: column;","}",".textFitAlignVertFlex{","display: flex;","}",".textFitAlignVertFlex .textFitAlignVert{","position: static;","}"].join("");var css=document.createElement("style");css.type="text/css";css.id="textFitStyleSheet";css.innerHTML=style;document.body.appendChild(css)}});
|
|
||||||
@@ -29,11 +29,13 @@ block content
|
|||||||
h3.course__overview-title Overview
|
h3.course__overview-title Overview
|
||||||
if course.fields.duration
|
if course.fields.duration
|
||||||
.course__overview-item
|
.course__overview-item
|
||||||
img.course__overview-icon(src='/images/icon-duration.svg')
|
svg.course__overview-icon
|
||||||
|
use(xlink:href='/icons/icons.svg#duration')
|
||||||
.course__overview-value Duration: #{course.fields.duration} min
|
.course__overview-value Duration: #{course.fields.duration} min
|
||||||
if course.fields.skillLevel
|
if course.fields.skillLevel
|
||||||
.course__overview-item
|
.course__overview-item
|
||||||
img.course__overview-icon(src='/images/icon-skill-level.svg')
|
svg.course__overview-icon
|
||||||
|
use(xlink:href='/icons/icons.svg#skill-level')
|
||||||
.course__overview-value Skill level: #{course.fields.skillLevel}
|
.course__overview-value Skill level: #{course.fields.skillLevel}
|
||||||
.course__overview-cta-wrapper
|
.course__overview-cta-wrapper
|
||||||
a.course__overview-cta.cta(href=`/courses/${course.fields.slug}/lessons/${course.fields.lessons[0].fields.slug}${queryString}`) Start course
|
a.course__overview-cta.cta(href=`/courses/${course.fields.slug}/lessons/${course.fields.lessons[0].fields.slug}${queryString}`) Start course
|
||||||
|
|||||||
@@ -19,14 +19,16 @@ html
|
|||||||
.header__upper.layout-centered
|
.header__upper.layout-centered
|
||||||
.header__upper-first
|
.header__upper-first
|
||||||
.header__title
|
.header__title
|
||||||
img(src='/images/icon-info.svg')
|
svg.course__overview-icon
|
||||||
|
use(xlink:href='/icons/icons.svg#info')
|
||||||
span Example Application
|
span Example Application
|
||||||
.header__upper-copy
|
.header__upper-copy
|
||||||
a(href=`/about${queryString}`) What is this?
|
a(href=`/about${queryString}`) What is this?
|
||||||
.header__upper-second
|
.header__upper-second
|
||||||
.header__upper-copy
|
.header__upper-copy
|
||||||
a.header__upper-link(href='https://images.contentful.com/82t39nctsu20/1JOkYZnY8YG0w88ImweME2/c8aef71dfe1ea633e16e17d99379416c/Github-repo_2x__1_.png' target='_blank' rel='noopener')
|
a.header__upper-link(href='https://images.contentful.com/82t39nctsu20/1JOkYZnY8YG0w88ImweME2/c8aef71dfe1ea633e16e17d99379416c/Github-repo_2x__1_.png' target='_blank' rel='noopener')
|
||||||
img.header__upper-icon(src='/images/icon-github.svg')
|
svg.header__upper-icon
|
||||||
|
use(xlink:href='/icons/icons.svg#github')
|
||||||
| View on Github
|
| View on Github
|
||||||
|
|
||||||
.header__controls
|
.header__controls
|
||||||
@@ -105,11 +107,9 @@ html
|
|||||||
.footer__social
|
.footer__social
|
||||||
p
|
p
|
||||||
a(href='https://www.facebook.com/contentful/' target='_blank' rel='noopener')
|
a(href='https://www.facebook.com/contentful/' target='_blank' rel='noopener')
|
||||||
img(src='/images/icon-facebook.svg' alt='Our Facebook profile')
|
svg
|
||||||
|
use(xlink:href='/icons/icons.svg#facebook')
|
||||||
a(href='https://twitter.com/contentful' target='_blank' rel='noopener')
|
a(href='https://twitter.com/contentful' target='_blank' rel='noopener')
|
||||||
img(src='/images/icon-twitter.svg' alt='Our Twitter profile')
|
svg
|
||||||
script(src='/scripts/highlight.pack.js')
|
use(xlink:href='/icons/icons.svg#twitter')
|
||||||
script(src='/scripts/textFit.min.js')
|
|
||||||
script(src='/scripts/popper.min.js')
|
|
||||||
script(src='/scripts/hoverintent.min.js')
|
|
||||||
script(src='/scripts/index.js')
|
script(src='/scripts/index.js')
|
||||||
|
|||||||
@@ -10,13 +10,13 @@ block content
|
|||||||
|
|
||||||
if success
|
if success
|
||||||
.status-block.status-block--success
|
.status-block.status-block--success
|
||||||
img.status-block__icon(src='/images/icon-success.svg')
|
img.status-block__icon(src='/images/success.svg')
|
||||||
.status-block__content
|
.status-block__content
|
||||||
.status-block__title Changes saved successfully!
|
.status-block__title Changes saved successfully!
|
||||||
|
|
||||||
if hasErrors
|
if hasErrors
|
||||||
.status-block.status-block--error
|
.status-block.status-block--error
|
||||||
img.status-block__icon(src='/images/icon-error.svg')
|
img.status-block__icon(src='/images/error.svg')
|
||||||
.status-block__content
|
.status-block__content
|
||||||
.status-block__title Error occurred
|
.status-block__title Error occurred
|
||||||
.status-block__message Some errors occurred. Please check the error messages next to the fields.
|
.status-block__message Some errors occurred. Please check the error messages next to the fields.
|
||||||
|
|||||||