Reconfigure add structure and add Gulp

2017-04-29 18:19:39 +03:00
parent 303dfd8aff
commit 3005f92bd2
9 changed files with 88 additions and 32 deletions
--- a/source/_assets/about-me.scss
+++ b/source/_assets/about-me.scss
@@ -0,0 +1,29 @@
+.about-me {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+
+
+    &__note {
+        text-align: center;
+        font-size: 120%;
+        max-width: 400px;
+        min-height: 3em;
+    }
+
+    &__links {
+        padding: 0;
+        margin-top: 4em;
+        list-style: none;
+        text-align: center;
+    }
+
+    &__link {
+        display: inline-block;
+    }
+
+    &__link + &__link {
+        margin-left: 1em;
+    }
+}
--- a/source/_assets/app.scss
+++ b/source/_assets/app.scss
@@ -0,0 +1,70 @@
+html, body {
+    font-size: 18px;
+    font-family: 'PT Serif', Serif;
+    padding: 0;
+    margin: 0;    
+}
+
+.content {
+    width: 840px;
+    margin: 0 auto;
+}
+
+.greeting,
+.hello {
+    margin-top: 1.8em;
+    font-size: 3.4em;
+    margin-bottom: 0.6em;
+    font-weight: normal;
+}
+
+.heading {
+    margin-top: 2.3em;
+    margin-bottom: 0.4em;
+    font-size: 1.2em;
+    font-weight: normal;
+}
+
+.hello {
+    display: none;
+}
+
+.text {
+    margin-bottom: 0.8em;
+}
+
+
+@media (max-width: 839px) {
+
+    body {
+        font-size: 16px;
+    }
+
+    .content {
+        margin: 20px 0;
+        width: auto;
+    }
+
+    .greeting,
+    .hello {
+        margin-top: 0.8em;
+    }
+
+    .greeting {
+        display: none;
+    }
+
+    .hello {
+        display: block;
+    }
+
+}
+
+@media (max-width: 480px) {
+
+    .content {
+        margin: 10px 0;
+        width: auto;
+    }
+
+}