diff options
| author | schneefux <schneefux+commit@schneefux.xyz> | 2017-03-22 19:19:26 +0100 |
|---|---|---|
| committer | schneefux <schneefux+commit@schneefux.xyz> | 2017-03-22 19:19:26 +0100 |
| commit | d42c8b528eb595101954f478e0024e3f079f6fbf (patch) | |
| tree | 61a528cf94f1f6941f4683ae8736a4a0135c035e /templates/assets/sass/material-kit/_example-pages.scss | |
| download | minionlivesmatter-d42c8b528eb595101954f478e0024e3f079f6fbf.tar.gz minionlivesmatter-d42c8b528eb595101954f478e0024e3f079f6fbf.zip | |
first implementation of fun stats site
Diffstat (limited to 'templates/assets/sass/material-kit/_example-pages.scss')
| -rw-r--r-- | templates/assets/sass/material-kit/_example-pages.scss | 236 |
1 files changed, 236 insertions, 0 deletions
diff --git a/templates/assets/sass/material-kit/_example-pages.scss b/templates/assets/sass/material-kit/_example-pages.scss new file mode 100644 index 0000000..fa83690 --- /dev/null +++ b/templates/assets/sass/material-kit/_example-pages.scss @@ -0,0 +1,236 @@ +.wrapper > .header{ + min-height: 300px; + background-position: center center; + background-size: cover; +} +.main{ + background: #FFFFFF; + position: relative; + z-index: 3; + +} +.main-raised{ + margin: -60px 30px 0px; + border-radius: $border-radius-base * 2; + @include shadow-16dp(); +} + +.title{ + font-weight: $font-weight-bold; + color: $black-color; +} +h2.title{ + margin-bottom: $margin-base * 2; +} +.description{ + color: $gray-light; +} + +// general style for example pages +.header-filter{ + position: relative; + + &:after{ + position: absolute; + z-index: 1; + width: 100%; + height: 100%; + display: block; + left: 0; + top: 0; + content: ""; + background-color: rgba(0,0,0,.4); + } + + .container{ + z-index: 2; + position: relative; + } +} +.gallery{ + .image{ + img{ + width: 100%; + } + } +} +.features{ + padding: 80px 0 0; +} + +.team{ + margin-top: 80px; + + .team-player{ + .title{ + margin: $margin-base * 2 auto; + } + img{ + max-width: 170px; + } + } +} +.nav-align-center{ + text-align: center; + + .nav-pills{ + display: inline-block; + } +} +.navbar-absolute{ + position: absolute; + width: 100%; + padding-top: 10px; + z-index: 1031; +} + +.index-page{ + .wrapper > .header{ + height: 90vh; + } + .brand{ + margin-top: 30vh; + color: #FFFFFF; + text-align: center; + + h1{ + font-size: 4.8em; + font-weight: 600; + } + h3{ + font-size: 1.5em; + text-transform: uppercase; + max-width: 400px; + margin: 10px auto 0; + } + } + .section-basic{ + padding-top: 15px; + } + .header-filter:after{ + background: rgba(101, 47, 142, 0.64); + background: linear-gradient(45deg, rgba(101, 47, 142, 0.88) 0%, rgba(125, 46, 185, 0.45) 100%); + background: -moz-linear-gradient(135deg, rgba(101, 47, 142, 0.88) 0%, rgba(125, 46, 185, 0.45) 100%); + background: -webkit-linear-gradient(135deg, rgba(101, 47, 142, 0.88) 0%, rgba(125, 46, 185, 0.45) 100%); + + } +} + +// style for the landing page +.landing-page{ + + .header{ + height: 100vh; + + .container{ + padding-top: 26vh; + color: #FFFFFF; + } + + .share{ + margin-top: 150px; + } + h1{ + font-weight: 600; + } + .title{ + color: $white-color; + } + } + + .wrapper{ + background: #CCCCCC; + } +} + +// style for the profile page + +.profile-page{ + .header{ + height: 380px; + background-position: top center; + } + .profile{ + text-align: center; + + img{ + max-width: 160px; + margin: -80px auto 0; + } + } + .description{ + margin: $margin-base * 2 auto 0; + max-width: 600px; + } + .profile-tabs{ + margin-top: $margin-base * 4; + } + .gallery{ + margin-top: $margin-base * 3; + padding-bottom: 50px; + + img{ + width: 100%; + margin-bottom: $margin-base * 2; + } + } +} + +.signup-page{ + .wrapper{ + > .header{ + min-height: 100vh; + } + .card-signup{ + margin: 160px 0 40px; + } + } + .footer{ + .copyright, + a{ + color: #FFFFFF; + } + } +} +.landing-page, +.profile-page, +.signup-page, +.index-page{ + .navbar-transparent{ + padding-top: 25px; + } +} + +@media (max-width: 991px){ + .landing-page .header{ + height: auto; + min-height: 100vh; + + .container{ + padding-bottom: 70px + } + } +} +@media (max-width: 768px){ + .footer{ + .copyright{ + display: inline-block; + text-align: center; + padding: 10px 0; + float: none !important; + width: 100%; + + } + } + + .navbar.navbar-transparent{ + background-color: rgba(0,0,0,.4); + padding-top: 10px; + border-radius: 0; + } + + .main-raised{ + margin-left: 10px; + margin-right: 10px; + } +} |
