Browse Source

Added responsiveness fixes for coming soon

master
Muthu Kumar 7 years ago
parent
commit
4de1ea7819
  1. 35
      docs/css/style.css
  2. 35
      sass/style.sass

35
docs/css/style.css

@ -10,15 +10,21 @@ body {
background: #000; }
h1, h2, h3, h4, h5, h6 {
font-weight: 300; }
font-weight: 300;
margin: 0; }
p {
margin: 0; }
h1 {
font-size: 2.8em;
line-height: 0em; }
font-size: 2.8em; }
.t-right {
text-align: right; }
.t-center {
text-align: center; }
.t-white {
color: #fff; }
@ -38,18 +44,9 @@ h1 {
font-size: 0.8em;
text-align: left; }
.is-relative {
position: relative; }
.row-full {
display: block;
display: grid;
align-content: center;
align-items: center;
justify-content: center;
margin: auto;
height: 100vh;
grid-template-columns: [full] 100%; }
@media screen and (max-width: 600px) {
.t-right {
text-align: center; } }
.row-full {
display: block;
@ -65,3 +62,11 @@ h1 {
align-self: center;
grid-area: full;
margin: auto; }
@media screen and (max-width: 600px) {
.row-full {
margin: 40vh auto;
height: auto; } }
.is-relative {
position: relative; }

35
sass/style.sass

@ -22,14 +22,20 @@ body
h1, h2, h3, h4, h5, h6
font-weight: 300
margin: 0
p
margin: 0
h1
font-size: 2.8em
line-height: 0em
.t-right
text-align: right
.t-center
text-align: center
.t-white
color: #fff
@ -49,8 +55,9 @@ h1
font-size: 0.8em
text-align: left
.is-relative
position: relative
@media screen and (max-width: 600px)
.t-right
text-align: center
// Grid
@ -64,19 +71,17 @@ h1
height: 100vh
grid-template-columns: [full] 100%
.row-full
display: block
display: grid
align-content: center
align-items: center
justify-content: center
margin: auto
height: 100vh
grid-template-columns: [full] 100%
.col-full
align-self: center
grid-area: full
margin: auto
@media screen and (max-width: 600px)
.row-full
margin: 40vh auto
height: auto
// Micro-class
.is-relative
position: relative
Loading…
Cancel
Save