X-Git-Url: https://osm.etsi.org/gitweb/?a=blobdiff_plain;f=skyquake%2Fframework%2Fstyle%2Fcommon.scss;fp=skyquake%2Fframework%2Fstyle%2Fcommon.scss;h=db161b26d3a9cf028d6d7924b366aa53d6837f56;hb=e29efc315df33d546237e270470916e26df391d6;hp=0000000000000000000000000000000000000000;hpb=9c5e457509ba5a1822c316635c6308874e61b4b9;p=osm%2FUI.git diff --git a/skyquake/framework/style/common.scss b/skyquake/framework/style/common.scss new file mode 100644 index 000000000..db161b26d --- /dev/null +++ b/skyquake/framework/style/common.scss @@ -0,0 +1,127 @@ + +/* + * + * Copyright 2016 RIFT.IO Inc + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +@import '../../node_modules/open-iconic/font/css/open-iconic.css'; +@import './_colors.scss'; + +$green: #31D2B1; +$black: #2D3036; +$white: #F8F9FC; +$headers: #EFF5FE; +$grey: #ABB6C6; + +/* Mixins */ + +@mixin arrow($size, $color) { + width: 0; + height:0; + &--up { + border-left: $size solid transparent; + border-right: $size solid transparent; + + border-bottom: $size solid $color; + } + &--down { + border-left: $size solid transparent; + border-right: $size solid transparent; + + border-top: $size solid $color; + } + &--left { + border-top: $size solid transparent; + border-bottom: $size solid transparent; + + border-right: $size solid $color; + } + &--right { + border-top: $size solid transparent; + border-bottom: $size solid transparent; + + border-left: $size solid $color; + } +} + + +/* General */ + + +.crouton { + color: #FFF; + line-height: 140%; + border-radius: 3px; + position: fixed; + top: 0px; + left: 0px; + right: 0px; + max-width: 700px; + width: 90%; + text-align: center; + z-index: 99999; + margin: 0 auto; + div { + padding: 20px; + &.info { + background-color: #1F8DD6; + } + &.success { + background-color: #50CD84; + } + &.warning { + background-color: #FF8859; + } + &.error { + background-color: #FF5F5F; + } + span { + display: block; + margin-bottom: 0; + margin-left: 0px; + } + .buttons { + text-align: right; + button { + &.btn, &.retry, &.close, &.cancel, &.ignore { + padding: 0px; + border: 1px solid transparent; + border-radius: 3px; + } + &:hover { + opacity: .75; + } + &.retry { + border-color: #FFF; + } + &.btn { + &.close { + border-color: #FF5F5F; + margin-left: 10px; + } + } + } + } + } +} +.noticeSubText { + padding-bottom:0.5rem; + color:$darker-gray; + font-size:0.75rem; + &_right { + text-align:right; + } +}