diff options
Diffstat (limited to 'app/assets/stylesheets/application.scss')
-rw-r--r-- | app/assets/stylesheets/application.scss | 306 |
1 files changed, 7 insertions, 299 deletions
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index ba16d4a21..35bdd3b6a 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -4,305 +4,13 @@ @import 'fonts/montserrat'; @import 'font-awesome'; -/* http://meyerweb.com/eric/tools/css/reset/ - v2.0 | 20110126 - License: none (public domain) -*/ - -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, embed, -figure, figcaption, footer, header, hgroup, -menu, nav, output, ruby, section, summary, -time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - font-size: 100%; - font: inherit; - vertical-align: baseline; -} - -/* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, -footer, header, hgroup, menu, nav, section { - display: block; -} - -body { - line-height: 1; -} - -ol, ul { - list-style: none; -} - -blockquote, q { - quotes: none; -} - -blockquote:before, blockquote:after, -q:before, q:after { - content: ''; - content: none; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -::-webkit-scrollbar { - width: 8px; - height: 8px; -} - -::-webkit-scrollbar-thumb { - background: lighten($color1, 4%); - border: 0px none $color5; - border-radius: 50px; -} - -::-webkit-scrollbar-thumb:hover { - background: lighten($color1, 6%); -} - -::-webkit-scrollbar-thumb:active { - background: lighten($color1, 4%); -} - -::-webkit-scrollbar-track { - border: 0px none $color5; - border-radius: 0; - background: rgba($color8, 0.1); -} - -::-webkit-scrollbar-track:hover { - background: $color1; -} - -::-webkit-scrollbar-track:active { - background: $color1; -} - -::-webkit-scrollbar-corner { - background: transparent; -} - -body { - font-family: 'Roboto', sans-serif; - background: $color1 image-url('background-photo.jpeg'); - background-size: cover; - background-attachment: fixed; - font-size: 13px; - line-height: 18px; - font-weight: 400; - color: $color5; - padding-bottom: 140px; - text-rendering: optimizelegibility; - font-feature-settings: "kern"; - text-size-adjust: none; - - &.app-body { - position: fixed; - width: 100%; - height: 100%; - padding: 0; - background: $color1; - } - - &.embed { - background: transparent; - margin: 0; - - .container { - position: absolute; - width: 100%; - height: 100%; - overflow: hidden; - } - } - - &.admin { - background: darken($color1, 4%); - position: fixed; - width: 100%; - height: 100%; - padding: 0; - } - - @media screen and (max-width: 360px) { - padding-bottom: 0; - } -} - -button:focus { - outline: none; -} - -.app-holder { - display: flex; - width: 100%; - height: 100%; - align-items: center; - justify-content: center; -} - -.container { - width: 700px; - margin: 0 auto; - margin-top: 40px; - - @media screen and (max-width: 700px) { - width: 100%; - margin: 0; - } -} - -.logo-container { - max-width: 400px; - margin: 100px auto; - margin-bottom: 0; - cursor: default; - - @media screen and (max-width: 360px) { - margin: 30px auto; - } - - h1 { - display: block; - text-align: center; - color: $color5; - font-size: 48px; - font-weight: 500; - - img { - display: block; - margin: 20px auto; - width: 180px; - height: 180px; - } - - a { - color: inherit; - text-decoration: none; - outline: 0; - - img { - opacity: 0.8; - transition: all 0.8s ease; - } - - &:hover { - img { - opacity: 1; - transition-duration: 0.2s; - } - } - } - - small { - display: block; - font-size: 12px; - font-weight: 400; - font-family: 'Roboto Mono', monospace; - } - } -} - -.no-list { - list-style: none; - - li { - display: inline-block; - margin: 0 5px; - } -} - -.footer { - text-align: center; - margin-top: 30px; - font-size: 12px; - color: darken($color2, 25%); - - .domain { - font-weight: 500; - - a { - color: inherit; - text-decoration: none; - } - } - - .powered-by { - font-weight: 400; - - a { - color: inherit; - text-decoration: underline; - font-weight: 500; - - &:hover { - text-decoration: none; - } - } - } -} - -.compact-header { - h1 { - font-size: 24px; - line-height: 28px; - color: $color3; - overflow: hidden; - font-weight: 500; - margin-bottom: 20px; - - a { - color: inherit; - text-decoration: none; - } - - small { - font-weight: 400; - color: $color2; - } - - img { - display: inline-block; - margin-bottom: -5px; - margin-right: 15px; - width: 36px; - height: 36px; - } - } -} - -.landing-strip { - background: rgba(darken($color1, 7%), 0.8); - color: $color3; - font-weight: 400; - padding: 14px; - border-radius: 4px; - margin-bottom: 20px; - - strong, a { - font-weight: 500; - } - - a { - color: inherit; - text-decoration: underline; - } -} - +@import 'reset'; +@import 'basics'; +@import 'containers'; +@import 'lists'; +@import 'footer'; +@import 'compact_header'; +@import 'landing_strip'; @import 'forms'; @import 'accounts'; @import 'stream_entries'; |