bartek/forkio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement code review suggestions

Browse Source
This commit is contained in:
Bartlomiej Pluta (PGS Software)
2018-04-03 10:58:20 +02:00
parent 8d6893d640
commit af83bd5384
8 changed files with 66 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/index.html
View File

@@ -59,9 +59,9 @@
<header class="header">
<div>
<p class="header__h1">Fork app</p>
<p class="header__h2">A real gamechanger in the world of web development</p>
<p class="header__h3">V. 2.8 for Mac and Windows</p>
<p class="header__title">Fork app</p>
<p class="header__subtitle">A real gamechanger in the world of web development</p>
<p class="header__description">V. 2.8 for Mac and Windows</p>
</div>
</header>
<section class="download">
@@ -73,9 +73,9 @@
<section class="editor">
<div class="container">
<div class="editor__description">
<p class="editor__h1">Revolutionary editor</p>
<p class="editor__title">Revolutionary editor</p>
<div class="row">
<p class="editor__h2 col-10">
<p class="editor__subtitle col-10">
Aenean cursus imperdiet nisl id fermentum. Aliquam pharetra dui laoreet vulputate dignissim. Sed
id
metus id quam auctor molestie eget ut augue.
@@ -112,15 +112,15 @@
<div class="container">
<div class="row">
<div class="about__features col-6">
<div class="row about__feature">
<div class="col-3 about__feature-icon">
<div class="row feature">
<div class="col-3 feature__icon">
<img src="img/features/1.png"/>
</div>
<div class="col-9">
<p class="about__feature-title">
<p class="feature__title">
Created to Make The Web Better
</p>
<p class="about__feature-description">
<p class="feature__description">
Aenean cursus imperdiet nisl id fermentum. Aliquam pharetra dui laoreet vulputate
dignissim.
Sed id metus id quam auctor molestie eget ut augue.
@@ -128,14 +128,14 @@
</div>
</div>
<div class="row about__feature">
<div class="col-3 about__feature-icon">
<div class="col-3 feature__icon">
<img src="img/features/2.png"/>
</div>
<div class="col-9">
<p class="about__feature-title">
<p class="feature__title">
Incredibly Powerful Tool
</p>
<p class="about__feature-description">
<p class="feature__description">
Maecenas eu dictum felis, a dignissim nibh. Mauris rhoncus felis odio, ut volutpat
massa
placerat ac. Curabitur dapibus iaculis mi gravida luctus. Aliquam erat volutpat.
@@ -143,14 +143,14 @@
</div>
</div>
<div class="row about__feature">
<div class="col-3 about__feature-icon">
<div class="col-3 feature__icon">
<img src="img/features/3.png"/>
</div>
<div class="col-9">
<p class="about__feature-title">
<p class="feature__title">
Experimental Stuff
</p>
<p class="about__feature-description">
<p class="feature__description">
Maecenas eu dictum felis, a dignissim nibh. Mauris rhoncus felis odio, ut volutpat
massa
placerat ac. Curabitur dapibus iaculis mi gravida luctus. Aliquam erat volutpat.
@@ -158,14 +158,14 @@
</div>
</div>
<div class="row about__feature">
<div class="col-3 about__feature-icon">
<div class="col-3 feature__icon">
<img src="img/features/4.png"/>
</div>
<div class="col-9">
<p class="about__feature-title">
<p class="feature__title">
Created to Make The Web Better
</p>
<p class="about__feature-description">
<p class="feature__description">
Maecenas eu dictum felis, a dignissim nibh. Mauris rhoncus felis odio, ut volutpat
massa
placerat ac. Curabitur dapibus iaculis mi gravida luctus. Aliquam erat volutpat.
@@ -174,7 +174,7 @@
</div>
</div>
<div class="about__what-you-get col-6">
<p class="about__h1 about__h1--no-wrap">&lt;Here is what you get&gt;</p>
<p class="about__title about__title--no-wrap">&lt;Here is what you get&gt;</p>
<img src="img/features/editor.png" alt="Revolutionary editor">
</div>
</div>
@@ -185,10 +185,10 @@
<div class="reviews__content col-10">
<div class="review">
<div class="author">
<img class="avatar" src="http://i.pravatar.cc/100&img=1" alt="Steven Strange">
<img class="avatar" src="http://i.pravatar.cc/100&amp;img=1" alt="Steven Strange">
<div class="author__details">
<p class="author__name">Steven Strange</p>
<p class="author__nickname nickname">DoctorS</p>
<p class="nickname nickname--strong">DoctorS</p>
</div>
</div>
<div class="row justify-content-center">
@@ -203,10 +203,10 @@
</div>
<div class="review">
<div class="author">
<img class="avatar" src="http://i.pravatar.cc/100&img=2" alt="Steven Strange">
<img class="avatar" src="http://i.pravatar.cc/100&amp;img=2" alt="Steven Strange">
<div class="author__details">
<p class="author__name">Aemiliana Alejo</p>
<p class="author__nickname nickname">alejo</p>
<p class="nickname nickname--strong">alejo</p>
</div>
</div>
<div class="row justify-content-center">
@@ -220,10 +220,10 @@
</div>
<div class="review">
<div class="author">
<img class="avatar" src="http://i.pravatar.cc/100&img=3" alt="Steven Strange">
<img class="avatar" src="http://i.pravatar.cc/100&amp;img=3" alt="Steven Strange">
<div class="author__details">
<p class="author__name">Melpomeni Étaín</p>
<p class="author__nickname nickname">etain</p>
<p class="nickname nickname--strong">etain</p>
</div>
</div>
<div class="row justify-content-center">

3
src/js/script.js
View File

@@ -2,11 +2,12 @@
'use strict';
var scrollTop = 0;
var scrollThreshold = $(window).height() / 2;
$(window).scroll(function () {
scrollTop = $(window).scrollTop();
if (scrollTop >= $(window).height() / 2) {
if (scrollTop >= scrollThreshold) {
$('.navbar').addClass('navbar--shrink');
} else {
$('.navbar').removeClass('navbar--shrink');

31
src/scss/_about.scss
View File

@@ -4,36 +4,13 @@
height: 710px;
}
.about__feature {
margin: 20px 0 0 10px;
}
.about__feature-icon {
text-align: center;
}
.about__feature-title {
margin-bottom: 10px;
font-family: Montserrat, sans-serif;
font-size: 16px;
font-weight: 600;
color: $dark-text;
}
.about__feature-description {
font-family: Montserrat, sans-serif;
font-size: 14px;
color: $regular-text;
}
.about__h1 {
.about__title {
font-family: Montserrat, sans-serif;
font-weight: bold;
font-size: 48px;
color: $primary;
}
.about__h1--no-wrap {
white-space: nowrap;
&--no-wrap {
white-space: nowrap;
}
}

16
src/scss/_author.scss
View File

@@ -24,18 +24,18 @@
color: $primary-dark;
}
.author__nickname {
margin: 0;
padding: 0;
font-family: Montserrat, sans-serif;
font-weight: 600;
font-size: 16px;
}
.nickname {
color: $primary;
&:before {
content: '@';
}
&--strong {
margin: 0;
padding: 0;
font-family: Montserrat, sans-serif;
font-weight: 600;
font-size: 16px;
}
}

4
src/scss/_editor.scss
View File

@@ -2,7 +2,7 @@
text-align: center;
}
.editor__h1 {
.editor__title {
margin-top: 60px;
font-family: Montserrat, sans-serif;
font-size: 54px;
@@ -11,7 +11,7 @@
color: $primary-dark;
}
.editor__h2 {
.editor__subtitle {
margin: 0 auto;
font-family: Source Sans Pro, sans-serif;
font-size: 21px;

21
src/scss/_feature.scss Normal file
View File

@@ -0,0 +1,21 @@
.feature {
margin: 20px 0 0 10px;
}
.feature__icon {
text-align: center;
}
.feature__title {
margin-bottom: 10px;
font-family: Montserrat, sans-serif;
font-size: 16px;
font-weight: 600;
color: $dark-text;
}
.feature__description {
font-family: Montserrat, sans-serif;
font-size: 14px;
color: $regular-text;
}

6
src/scss/_header.scss
View File

@@ -4,7 +4,7 @@
padding-top: 110px;
}
.header__h1 {
.header__title {
font-family: Montserrat, sans-serif;
font-size: 82px;
font-weight: bold;
@@ -13,7 +13,7 @@
text-align: center;
}
.header__h2 {
.header__subtitle {
font-family: Lato, sans-serif;
font-size: 30px;
color: $primary;
@@ -21,7 +21,7 @@
margin-bottom: 0;
}
.header__h3 {
.header__description {
margin-top: 20px;
font-family: Montserrat, sans-serif;
font-size: 16px;

1
src/scss/style.scss
View File

@@ -7,5 +7,6 @@
@import "download";
@import "editor";
@import "about";
@import "feature";
@import "reviews";
@import "social";