diff options
| author | Jude <julie_wang1@brown.edu> | 2019-03-09 11:28:34 -0500 |
|---|---|---|
| committer | Jude <julie_wang1@brown.edu> | 2019-03-09 11:28:34 -0500 |
| commit | f858a4fc74476c5720cc215c70f12733d757d085 (patch) | |
| tree | 3a984187eec283ae056448bbf3d1aa429161aaad /src/client/views/Main.scss | |
| parent | 2d9c1fd55c4d2c9bf275aeaf6a83703cebba374f (diff) | |
improved text node and reduced selection border thickness
Diffstat (limited to 'src/client/views/Main.scss')
| -rw-r--r-- | src/client/views/Main.scss | 213 |
1 files changed, 106 insertions, 107 deletions
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss index e8b522cbb..1c1e08b2f 100644 --- a/src/client/views/Main.scss +++ b/src/client/views/Main.scss @@ -1,162 +1,161 @@ @import "global_variables"; -@import url('https://fonts.googleapis.com/css?family=Work+Sans:300,700'); html, body { - width: 100%; - height: 100%; - overflow: hidden; - font-family: 'Work Sans', sans-serif; - margin: 0; + width: 100%; + height: 100%; + overflow: hidden; + font-family: $sans-serif; + margin: 0; } h1 { - font-size: 50px; - position: fixed; - top: 30px; - left: 50%; - transform: translateX(-50%); - color: $dark-color; - text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; - z-index: 9999; - font-family: 'Work Sans', sans-serif; - font-weight: 700; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; + font-size: 50px; + position: fixed; + top: 30px; + left: 50%; + transform: translateX(-50%); + color: $dark-color; + text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; + z-index: 9999; + font-family: $sans-serif; + font-weight: 700; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } p { - margin: 0px; - padding: 0px; + margin: 0px; + padding: 0px; } ::-webkit-scrollbar { - -webkit-appearance: none; - height: 5px; - width: 5px; + -webkit-appearance: none; + height: 5px; + width: 5px; } ::-webkit-scrollbar-thumb { - border-radius: 2px; - background-color: rgba(0, 0, 0, .5); + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.5); } // button stuff button { - background: $dark-color; - outline: none; - border: 0px; - color: $light-color; - text-transform: uppercase; - letter-spacing: 2px; - font-size: 75%; - padding: 10px; - transition: transform 0.2s; + background: $dark-color; + outline: none; + border: 0px; + color: $light-color; + text-transform: uppercase; + letter-spacing: 2px; + font-size: 75%; + padding: 10px; + transition: transform 0.2s; } button:hover { - background: $dark-accent; - transform: scale(1.05); + background: $main-accent; + transform: scale(1.05); } .clear-db-button { - position: absolute; - left: 47%; - bottom: 1em; - font-size: 50%; + position: absolute; + left: 47%; + bottom: 1em; + font-size: 50%; } .add-button { - position: relative; - width: 2em; - height: 2em; - border-radius: 1em; - font-size: 24px; - margin-right: 0.4em; + position: relative; + width: 2em; + height: 2em; + border-radius: 1em; + font-size: 24px; + margin-right: 0.4em; } .add-button:hover { - transform: scale(1.15); + transform: scale(1.15); } .main-undoButtons { - position: absolute; - width: 150px; - right: 0px; + position: absolute; + width: 150px; + right: 0px; } // add nodes menu #add-nodes-menu { - position: absolute; - left: 1em; - bottom: 1em; - label { - background: $dark-color; - color: $light-color; - padding: 10px; - display: inline-block; - border-radius: 1em; - font-size: 24px; - width: 1.09em; - margin-right: 0.4em; - text-align: center; - cursor: pointer; - transition: transform 0.5s; - } - label:hover { - background: $dark-accent; - } - input { - display: none; - } - input:not(:checked)~#add-options-content { - display: none; - } - input:checked~label { - transform: rotate(45deg); - transition: transform 0.5s; - cursor: pointer; - } + position: absolute; + left: 1em; + bottom: 1em; + label { + background: $dark-color; + color: $light-color; + padding: 10px; + display: inline-block; + border-radius: 1em; + font-size: 24px; + width: 1.09em; + margin-right: 0.4em; + text-align: center; + cursor: pointer; + transition: transform 0.5s; + } + label:hover { + background: $main-accent; + } + input { + display: none; + } + input:not(:checked) ~ #add-options-content { + display: none; + } + input:checked ~ label { + transform: rotate(45deg); + transition: transform 0.5s; + cursor: pointer; + } } #add-options-content { - display: table; - opacity: 1; - margin: 0; - padding: 0; - position: relative; - float: right; - bottom: 0.3em; - margin-bottom: -1.68em; + display: table; + opacity: 1; + margin: 0; + padding: 0; + position: relative; + float: right; + bottom: 0.3em; + margin-bottom: -1.68em; } ul#add-options-list { - list-style: none; + list-style: none; + padding: 0; + li { + display: inline-block; padding: 0; - li { - display: inline-block; - padding: 0; - } + } } // goldenlayout stuff div .lm_header { - background: $dark-color; - min-height: 2em; + background: $dark-color; + min-height: 2em; } .lm_tab { - margin-top: 0.7em !important; - padding-top: 0.5em !important; - min-height: 1.4em; - padding-bottom: 0px; - border-radius: 5px; - font-family: 'Work Sans', sans-serif !important; + margin-top: 0.7em !important; + padding-top: 0.5em !important; + min-height: 1.4em; + padding-bottom: 0px; + border-radius: 5px; + font-family: $sans-serif !important; } .lm_header .lm_controls { - right: 1em !important; -}
\ No newline at end of file + right: 1em !important; +} |
