4 * Copyright 2016 RIFT.IO Inc
6 * Licensed under the Apache License, Version 2.0 (the "License");
7 * you may not use this file except in compliance with the License.
8 * You may obtain a copy of the License at
10 * http://www.apache.org/licenses/LICENSE-2.0
12 * Unless required by applicable law or agreed to in writing, software
13 * distributed under the License is distributed on an "AS IS" BASIS,
14 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15 * See the License for the specific language governing permissions and
16 * limitations under the License.
21 path[data-outline-indicator-svg-outline-path] {
27 $font-path: '../assets';
28 $robo-black: $font-path + '/Roboto-Black-webfont.woff';
29 $robo-black-italic: $font-path + '/Roboto-BlackItalic-webfont.woff';
30 $robo-bold: $font-path + '/Roboto-Bold-webfont.woff';
31 $robo-bold-italic: $font-path + '/Roboto-BoldItalic-webfont.woff';
32 $robo-light: $font-path + '/Roboto-Light-webfont.woff';
33 $robo-light-italic: $font-path + '/Roboto-LightItalic-webfont.woff';
34 $robo-medium: $font-path + '/Roboto-Medium-webfont.woff';
35 $robo-medium-italic: $font-path + '/Roboto-MediumItalic-webfont.woff';
36 $robo-reg: $font-path + '/Roboto-Regular-webfont.woff';
37 $robo-reg-italic: $font-path + '/Roboto-Italic-webfont.woff';
38 $robo-thin: $font-path + '/Roboto-Thin-webfont.woff';
39 $robo-thin-italic: $font-path + '/Roboto-ThinItalic-webfont.woff';
41 $robo-cond-bold: $font-path + '/RobotoCondensed-Bold-webfont.woff';
42 $robo-cond-bold-italic: $font-path + '/RobotoCondensed-BoldItalic-webfont.woff';
43 $robo-cond-light: $font-path + '/RobotoCondensed-Light-webfont.woff';
44 $robo-cond-light-italic: $font-path + '/RobotoCondensed-LightItalic-webfont.woff';
45 $robo-cond-reg: $font-path + '/RobotoCondensed-Regular-webfont.woff';
46 $robo-cond-reg-italic: $font-path + '/RobotoCondensed-Italic-webfont.woff';
49 font-family: 'Roboto';
50 src: url($robo-thin) format('woff');
55 font-family: 'Roboto';
56 src: url($robo-thin-italic) format('woff');
61 font-family: 'Roboto';
62 src: url($robo-light) format('woff');
67 font-family: 'Roboto';
68 src: url($robo-light-italic) format('woff');
73 font-family: 'Roboto';
74 src: url($robo-reg) format('woff');
79 font-family: 'Roboto';
80 src: url($robo-reg-italic) format('woff');
85 font-family: 'Roboto';
86 src: url($robo-medium) format('woff');
91 font-family: 'Roboto';
92 src: url($robo-medium-italic) format('woff');
97 font-family: 'Roboto';
98 src: url($robo-bold) format('woff');
103 font-family: 'Roboto';
104 src: url($robo-bold-italic) format('woff');
109 font-family: 'Roboto';
110 src: url($robo-black) format('woff');
115 font-family: 'Roboto';
116 src: url($robo-black-italic) format('woff');
121 font-family: 'RobotoCondensed';
122 src: url($robo-cond-light) format('woff');
127 font-family: 'RobotoCondensed';
128 src: url($robo-cond-light-italic) format('woff');
133 font-family: 'RobotoCondensed';
134 src: url($robo-cond-reg) format('woff');
139 font-family: 'RobotoCondensed';
140 src: url($robo-cond-reg-italic) format('woff');
145 font-family: 'RobotoCondensed';
146 src: url($robo-cond-bold) format('woff');
151 font-family: 'RobotoCondensed';
152 src: url($robo-cond-bold-italic) format('woff');
157 $font-family-serif: Georgia, Times, 'Times New Roman', serif;
158 $font-family-sans-serif: Roboto, Helvetica, Arial, sans-serif;
159 $font-family-display: $font-family-sans-serif;
160 $font-family-icons: 'FontAwesome';
161 $font-family-default: $font-family-sans-serif;
164 background: $primary-bg-color;
166 font-family: $font-family-sans-serif;
170 ::-webkit-scrollbar {
175 -webkit-box-sizing: border-box;
176 -moz-box-sizing: border-box;
177 box-sizing: border-box;
184 border-collapse: collapse;
187 *, *:before, *:after {
188 -webkit-box-sizing: inherit;
189 -moz-box-sizing: inherit;
200 font-variant-caps: all-small-caps;
201 font-variant: small-caps;
202 text-transform: uppercase;
206 vertical-align: middle;
210 input[type="image"] {
212 box-shadow: 2px 2px rgba(0, 0, 0, 0.15);
214 display: inline-block;
217 text-decoration: none;
218 text-transform: uppercase;
221 background-color: #7E9BC1;
225 background-color:#4C5E74;
230 background-color: rgb(159, 196, 244);
235 input[type="image"] {
253 border: 1px solid $field-background-color !important;;
254 border-radius: $field-border-radius;
256 background-color: $field-background-color !important;
260 background-color: white !important;
262 &::-webkit-input-placeholder {
263 color: #eee8d5 !important;
266 &:-moz-placeholder { /* Firefox 18- */
267 color: #eee8d5 !important;
270 &::-moz-placeholder { /* Firefox 19+ */
271 color: #eee8d5 !important;
274 &:-ms-input-placeholder {
275 color: #eee8d5 !important;
282 -moz-appearance: none;
285 -webkit-appearance: none;
286 -webkit-border-radius: $field-border-radius;
293 appearance: none; // using -prefix-free http://leaverou.github.io/prefixfree/
294 background: $field-background-color url(../../../node_modules/open-iconic/svg/caret-bottom.svg) no-repeat right 6px center;
295 background-size: 10px;
297 color: $field-background-color;
298 radius: $field-border-radius;
304 // Removes default arrow for IE10+
305 // IE 8/9 get dafault arrow which covers caret image
306 // as long as caret image is small than and positioned
307 // behind default arrow
319 font-family: monospace;
322 .ContentEditableDiv {
327 border-radius: $field-border-radius;
335 border-right: 1px solid $button-border-color;
337 border-top-left-radius: 2px;
338 border-bottom-left-radius: 2px;
342 border-top-right-radius: 2px;
343 border-bottom-right-radius: 2px;
350 -ms-overflow-style: -ms-autohiding-scrollbar;
351 background-color: $panel-bg-color;
369 -ms-overflow-style: -ms-autohiding-scrollbar;
384 background-color: $panel-bg-color-contrast;
385 border-top: 1px solid $panel-border-color-light;
395 display: inline-block;
399 /* react-tooltip overrides */
400 .__react_component_tooltip {
401 transition: opacity 300ms cubic-bezier(0.230, 1.000, 0.320, 1.000) !important;
404 /* simple css-only drop-down menu */
406 display: inline-flex;
422 background-color: #f1f1f1;
423 box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.15);
433 > .Button:hover .sub-menu {
447 fill: white;/* font color */
448 stroke: white !important;/* font color */