diff options
author | kibigo! <marrus-sh@users.noreply.github.com> | 2017-12-07 13:35:37 -0800 |
---|---|---|
committer | kibigo! <marrus-sh@users.noreply.github.com> | 2017-12-07 13:36:18 -0800 |
commit | 96126a5b01cae79b4e76e68b02681e00f4622d81 (patch) | |
tree | 3148451ed86cbf6843e08496462535b72f764eaa /app/javascript/flavours/glitch/styles | |
parent | 67d625c42d35dcc01d3e9bde910e5ac88b63b979 (diff) |
Packaged local_settings styles in common
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/boost.scss (renamed from app/javascript/flavours/glitch/styles/boost.scss) | 0 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/doodle.scss (renamed from app/javascript/flavours/glitch/styles/doodle.scss) | 0 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/emoji_picker.scss (renamed from app/javascript/flavours/glitch/styles/emoji_picker.scss) | 0 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/index.scss (renamed from app/javascript/flavours/glitch/styles/components.scss) | 4 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/local_settings.scss | 81 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/index.scss | 3 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/reset copy.scss | 91 |
7 files changed, 84 insertions, 95 deletions
diff --git a/app/javascript/flavours/glitch/styles/boost.scss b/app/javascript/flavours/glitch/styles/components/boost.scss index b07b72f8e..b07b72f8e 100644 --- a/app/javascript/flavours/glitch/styles/boost.scss +++ b/app/javascript/flavours/glitch/styles/components/boost.scss diff --git a/app/javascript/flavours/glitch/styles/doodle.scss b/app/javascript/flavours/glitch/styles/components/doodle.scss index a4a1cfc84..a4a1cfc84 100644 --- a/app/javascript/flavours/glitch/styles/doodle.scss +++ b/app/javascript/flavours/glitch/styles/components/doodle.scss diff --git a/app/javascript/flavours/glitch/styles/emoji_picker.scss b/app/javascript/flavours/glitch/styles/components/emoji_picker.scss index 2b46d30fc..2b46d30fc 100644 --- a/app/javascript/flavours/glitch/styles/emoji_picker.scss +++ b/app/javascript/flavours/glitch/styles/components/emoji_picker.scss diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components/index.scss index ade8df018..7aeab0a6a 100644 --- a/app/javascript/flavours/glitch/styles/components.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -1,5 +1,3 @@ -@import 'variables'; - .app-body { -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; @@ -4830,3 +4828,5 @@ noscript { } @import 'doodle'; +@import 'emoji_picker'; +@import 'local_settings'; diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss new file mode 100644 index 000000000..16c8cf003 --- /dev/null +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -0,0 +1,81 @@ +.glitch.local-settings { + position: relative; + display: flex; + flex-direction: row; + background: $ui-secondary-color; + color: $ui-base-color; + border-radius: 8px; + height: 80vh; + width: 80vw; + max-width: 740px; + max-height: 450px; + overflow: hidden; + + label { + display: block; + } + + h1 { + font-size: 18px; + font-weight: 500; + line-height: 24px; + margin-bottom: 20px; + } + + h2 { + font-size: 15px; + font-weight: 500; + line-height: 20px; + margin-top: 20px; + margin-bottom: 10px; + } +} + +.glitch.local-settings__navigation__item { + display: block; + padding: 15px 20px; + color: inherit; + background: $primary-text-color; + border-bottom: 1px $ui-primary-color solid; + cursor: pointer; + text-decoration: none; + outline: none; + transition: background .3s; + + &:hover { + background: $ui-secondary-color; + } + + &.active { + background: $ui-highlight-color; + color: $primary-text-color; + } + + &.close, &.close:hover { + background: $error-value-color; + color: $primary-text-color; + } +} + +.glitch.local-settings__navigation { + background: $primary-text-color; + color: $ui-base-color; + width: 200px; + font-size: 15px; + line-height: 20px; + overflow-y: auto; +} + +.glitch.local-settings__page { + display: block; + flex: auto; + padding: 15px 20px 15px 20px; + width: 360px; + overflow-y: auto; +} + +.glitch.local-settings__page__item { + select { + margin-bottom: 5px; + } +} diff --git a/app/javascript/flavours/glitch/styles/index.scss b/app/javascript/flavours/glitch/styles/index.scss index c962a1f62..a5169f881 100644 --- a/app/javascript/flavours/glitch/styles/index.scss +++ b/app/javascript/flavours/glitch/styles/index.scss @@ -14,8 +14,7 @@ @import 'forms'; @import 'accounts'; @import 'stream_entries'; -@import 'components'; -@import 'emoji_picker'; +@import 'components/index'; @import 'about'; @import 'tables'; @import 'admin'; diff --git a/app/javascript/flavours/glitch/styles/reset copy.scss b/app/javascript/flavours/glitch/styles/reset copy.scss deleted file mode 100644 index cc5ba9d7c..000000000 --- a/app/javascript/flavours/glitch/styles/reset copy.scss +++ /dev/null @@ -1,91 +0,0 @@ -/* 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($ui-base-color, 4%); - border: 0px none $base-border-color; - border-radius: 50px; -} - -::-webkit-scrollbar-thumb:hover { - background: lighten($ui-base-color, 6%); -} - -::-webkit-scrollbar-thumb:active { - background: lighten($ui-base-color, 4%); -} - -::-webkit-scrollbar-track { - border: 0px none $base-border-color; - border-radius: 0; - background: rgba($base-overlay-background, 0.1); -} - -::-webkit-scrollbar-track:hover { - background: $ui-base-color; -} - -::-webkit-scrollbar-track:active { - background: $ui-base-color; -} - -::-webkit-scrollbar-corner { - background: transparent; -} |