Skip to content

Commit

Permalink
Merge branch 'master' into feat/favicon
Browse files Browse the repository at this point in the history
  • Loading branch information
martincadoux committed Mar 15, 2018
2 parents d120074 + 71205f8 commit f1c5eb0
Show file tree
Hide file tree
Showing 13 changed files with 226 additions and 107 deletions.
4 changes: 1 addition & 3 deletions README.md
Expand Up @@ -105,15 +105,13 @@ C'est le fichier qui permet de configurer votre codelabs. Il doit absolument com
{
"title": "TITRE",
"permalink": "URL",
"excerpt": "DESCIPTION",
"excerpt": "DESCRIPTION",
"stepTitles": [
"TITRE STEP 1",
"TITRE STEP 2",
"TITRE STEP 3"
],
"date": "DATE",
"cover": "URL DE LA COVER",
"time": "TEMPS",
"authors": [
{
"name": "NOM DE L'AUTHOR",
Expand Down
6 changes: 6 additions & 0 deletions app.yaml
@@ -1,2 +1,8 @@
runtime: custom
env: flex

automatic_scaling:
min_num_instances: 1
max_num_instances: 3
cpu_utilization:
target_utilization: 0.8
4 changes: 4 additions & 0 deletions nginx.conf
Expand Up @@ -39,6 +39,10 @@ http {
listen 8080;
root /usr/share/nginx/www;
index index.html index.htm;

if ($http_x_forwarded_proto = "http") {
return 301 https://$host$request_uri;
}

location / {
try_files $uri $uri/ /index.html;
Expand Down
9 changes: 9 additions & 0 deletions public/index.html
Expand Up @@ -4,6 +4,15 @@
<title>Eleven's Codelabs</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-99013054-4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-99013054-4');
</script>
</head>
<body>
<div id="root"></div>
Expand Down
1 change: 1 addition & 0 deletions src/assets/images/icons/icon_english.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/assets/images/icons/icon_rocket.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 0 additions & 4 deletions src/assets/scss/base/_global.scss
Expand Up @@ -16,10 +16,6 @@ figure {

html {
background: $background-color;
font-size: 75%;
@media (min-width: 768px) {
font-size: 100%;
}
}
// Typography
::selection {
Expand Down
161 changes: 114 additions & 47 deletions src/assets/scss/includes/_header.scss
@@ -1,76 +1,143 @@
.site-header {
align-items: center;
background: $brand-color;
border-bottom: 1px solid $border-color;
display: flex;
flex-flow: row wrap;
padding: 20px 45px;
width: 100%;

.branding__content {
display: inline-block;
margin-bottom: 5px;
width: 120px;
@media (min-width: 48em) {
margin-bottom: 0;
width: 160px;
&.-yellow {
background-color: $brand-yellow;
}

&__content {
display: flex;
flex-flow: column wrap;
align-items: center;
width: 100%;
@media (min-width: em(768px)) {
flex-flow: row nowrap;
height: auto;
margin: 0 auto;
width: 100%;
}
}

a {
color: $header-link-color;
}
}

.branding {
display: inline-block;
margin-bottom: em(5px);
height: em(40px);
width: em(120px);
@media (min-width: em(768px)) {
margin: 0 em(30px) 0 0;
height: em(60px);
width: em(160px);
max-width: em(255px);
flex: 1 1 em(200px);
}

&__content {
&:hover {
background: none;
text-decoration: none;
}
}

&__image {
display: block;
max-width: 100%;
&__image {
display: block;
margin: 0 auto;
height: em(40px);
width: em(120px);
max-width: 100%;
@media (min-width: em(768px)) {
margin: 0;
height: em(60px);
width: em(160px);
}
}
}

a {
color: $header-link-color;
}
.avatar {
border-radius: .2rem;
float: left;
height: 2rem;
margin-right: 1rem;
margin-top: -3px;
width: 2rem;
}

.avatar {
border-radius: .2rem;
float: left;
height: 2rem;
margin-right: 1rem;
margin-top: -3px;
width: 2rem;
.course-header {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
@media (min-width: em(768px)) {
flex-direction: row;
align-items: baseline;
flex: 1 1 em(400px);
}

.site-title {
flex: auto;
float: left;
font-size: 1rem;
font-weight: bold;
line-height: 1.5;
text-align: center;
&__title {
$context: 24px;

font-size: em($context);
margin-bottom: em(20px, $context);
@media (min-width: em(768px)) {
margin-bottom: 0;
}
}

.site-nav {
ul {
&__duration {
$context: 20px;

font-size: $context;
margin: 0;
&:before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2MCA2MCI+PHBhdGggZD0iTTMwIDBDMTMuNDU4IDAgMCAxMy40NTggMCAzMHMxMy40NTggMzAgMzAgMzAgMzAtMTMuNDU4IDMwLTMwUzQ2LjU0MiAwIDMwIDB6bTAgNThDMTQuNTYxIDU4IDIgNDUuNDM5IDIgMzBTMTQuNTYxIDIgMzAgMnMyOCAxMi41NjEgMjggMjgtMTIuNTYxIDI4LTI4IDI4eiIvPjxwYXRoIGQ9Ik0zMCA2YTEgMSAwIDAgMC0xIDF2MjNIMTRhMSAxIDAgMSAwIDAgMmgxNmExIDEgMCAwIDAgMS0xVjdhMSAxIDAgMCAwLTEtMXoiLz48L3N2Zz4=");
display: inline-block;
line-height: 1.5;
list-style: none;
margin: 0;
padding: 0;
text-align: center;
margin-right: em(10px, $context);
width: em(35px, $context);
vertical-align: middle;
}
}
}

.links {
$margin: em(8px);

display: flex;
flex-direction: row;
width: 100%;
max-width: em(165px);
@media (min-width: em(768px)) {
margin: 0 0 0 em(30px);
}

&__list {
display: flex;
flex-direction: row;
align-items: center;
margin: 0;
padding: 0;
line-height: 1;
list-style: none;
text-align: center;

li {
&.-language:before {
content: "";
display: inline-block;
margin-right: .4rem;
margin: 0 $margin;
width: em(1px);
height: em(24px);
background-color: $brand-black;
vertical-align: middle;
}
}

.branding,
.search-bar,
.site-nav {
@media (max-width: 480px) {
flex: 0 0 100%;
text-align: center;
&__item {
& + & {
margin-left: $margin;
}
}
}
47 changes: 26 additions & 21 deletions src/assets/scss/objects/_course-page.scss
@@ -1,9 +1,9 @@
.summary {
flex: 1 1 em(200px);
margin: 0 0 em(70px);
margin: 0 0 em(30px);
@media (min-width: em(768px)) {
max-width: em(370px);
margin: 0 em(70px) 0 0;
max-width: em(255px);
margin: 0 em(30px) 0 0;
}

&__steps {
Expand All @@ -28,18 +28,19 @@
@media (min-width: em(768px)) {
flex-direction: row;
flex: 1 1 em(70px);
padding: 0;
text-align: left;
}

& + & {
@media (min-width: em(768px)) {
margin-top: em(60px);
margin-top: em(20px);
}
}
}

&__step-number {
$context: 40px;
$context: 32px;

font-size: em($context);
display: flex;
Expand All @@ -49,20 +50,22 @@
flex: 0 0 auto;
border: 2px solid $brand-yellow;
border-radius: 50%;
width: em(70px, $context);
height: em(70px, $context);
width: em(50px, $context);
height: em(50px, $context);
.-current & {
background-color: $brand-yellow;
}
}

&__step-title {
$context: 18px;

color: #bbc1c4;
font-size: em(22px);
font-size: $context;
line-height: 1.1;
margin: em(15px) 0 0;
margin: em(15px, $context) 0 0;
@media (min-width: em(768px)) {
margin: 0 0 0 em(15px);
margin: 0 0 0 em(15px, $context);
}
}
}
Expand All @@ -75,16 +78,26 @@

&__content {
flex: 1 1 em(400px);
margin-bottom: em(60px);
width: 100%;
}

&__chapter {
$context: 20px;

font-size: em($context);
margin-bottom: em(20px, $context);
}

&__navigation {
display: flex;
flex-direction: row;
justify-content: space-between;
}

&__button {
position: fixed;
bottom: em(20px);
background-color: $brand-yellow;
border: none;
border-radius: 30%;
Expand All @@ -96,19 +109,11 @@

&.-previous {
transform: rotate(180deg);
left: em(20px);
}
}

&__duration {
$context: 20px;

font-size: $context;
&:before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2MCA2MCI+PHBhdGggZD0iTTMwIDBDMTMuNDU4IDAgMCAxMy40NTggMCAzMHMxMy40NTggMzAgMzAgMzAgMzAtMTMuNDU4IDMwLTMwUzQ2LjU0MiAwIDMwIDB6bTAgNThDMTQuNTYxIDU4IDIgNDUuNDM5IDIgMzBTMTQuNTYxIDIgMzAgMnMyOCAxMi41NjEgMjggMjgtMTIuNTYxIDI4LTI4IDI4eiIvPjxwYXRoIGQ9Ik0zMCA2YTEgMSAwIDAgMC0xIDF2MjNIMTRhMSAxIDAgMSAwIDAgMmgxNmExIDEgMCAwIDAgMS0xVjdhMSAxIDAgMCAwLTEtMXoiLz48L3N2Zz4=");
display: inline-block;
margin-right: em(10px, $context);
width: em(35px, $context);
vertical-align: middle;
&.-next {
right: em(20px);
}
}

Expand Down
6 changes: 1 addition & 5 deletions src/assets/scss/objects/_layout.scss
Expand Up @@ -11,13 +11,9 @@

.container {
margin: 0 auto;
padding: 2.5em;
padding: em(20px);
max-width: em($max-width-layout);

@media (min-width: em(480px)) {
padding: em(45px);
}

@media (min-width: em(1360px)) {
padding-left: 0;
padding-right: 0;
Expand Down

0 comments on commit f1c5eb0

Please sign in to comment.