liquid_feedback_frontend
annotate style/mdl/snackbar/_snackbar.scss @ 1312:a9406a081d6d
Show manual verification button only when configured
| author | bsw |
|---|---|
| date | Wed Aug 01 17:08:34 2018 +0200 (2018-08-01) |
| parents | 32cc544d5a5b |
| children |
| rev | line source |
|---|---|
| bsw/jbe@1309 | 1 /** |
| bsw/jbe@1309 | 2 * Copyright 2015 Google Inc. All Rights Reserved. |
| bsw/jbe@1309 | 3 * |
| bsw/jbe@1309 | 4 * Licensed under the Apache License, Version 2.0 (the "License"); |
| bsw/jbe@1309 | 5 * you may not use this file except in compliance with the License. |
| bsw/jbe@1309 | 6 * You may obtain a copy of the License at |
| bsw/jbe@1309 | 7 * |
| bsw/jbe@1309 | 8 * http://www.apache.org/licenses/LICENSE-2.0 |
| bsw/jbe@1309 | 9 * |
| bsw/jbe@1309 | 10 * Unless required by applicable law or agreed to in writing, software |
| bsw/jbe@1309 | 11 * distributed under the License is distributed on an "AS IS" BASIS, |
| bsw/jbe@1309 | 12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| bsw/jbe@1309 | 13 * See the License for the specific language governing permissions and |
| bsw/jbe@1309 | 14 * limitations under the License. |
| bsw/jbe@1309 | 15 */ |
| bsw/jbe@1309 | 16 |
| bsw/jbe@1309 | 17 @import "../variables"; |
| bsw/jbe@1309 | 18 @import "../mixins"; |
| bsw/jbe@1309 | 19 |
| bsw/jbe@1309 | 20 .mdl-snackbar { |
| bsw/jbe@1309 | 21 position: fixed; |
| bsw/jbe@1309 | 22 bottom: 0; |
| bsw/jbe@1309 | 23 left: 50%; |
| bsw/jbe@1309 | 24 cursor: default; |
| bsw/jbe@1309 | 25 background-color: $snackbar-background-color; |
| bsw/jbe@1309 | 26 z-index: 3; |
| bsw/jbe@1309 | 27 display: block; |
| bsw/jbe@1309 | 28 display: flex; |
| bsw/jbe@1309 | 29 justify-content: space-between; |
| bsw/jbe@1309 | 30 font-family: $preferred_font; |
| bsw/jbe@1309 | 31 will-change: transform; |
| bsw/jbe@1309 | 32 transform: translate(0, 80px); |
| bsw/jbe@1309 | 33 transition: transform 0.25s $animation-curve-fast-out-linear-in; |
| bsw/jbe@1309 | 34 pointer-events: none; |
| bsw/jbe@1309 | 35 @media(max-width: $snackbar-tablet-breakpoint - 1) { |
| bsw/jbe@1309 | 36 width: 100%; |
| bsw/jbe@1309 | 37 left: 0; |
| bsw/jbe@1309 | 38 min-height: 48px; |
| bsw/jbe@1309 | 39 max-height: 80px; |
| bsw/jbe@1309 | 40 } |
| bsw/jbe@1309 | 41 @media(min-width: $snackbar-tablet-breakpoint) { |
| bsw/jbe@1309 | 42 min-width: 288px; |
| bsw/jbe@1309 | 43 max-width: 568px; |
| bsw/jbe@1309 | 44 border-radius: 2px; |
| bsw/jbe@1309 | 45 transform: translate(-50%, 80px); |
| bsw/jbe@1309 | 46 } |
| bsw/jbe@1309 | 47 &--active { |
| bsw/jbe@1309 | 48 transform: translate(0, 0); |
| bsw/jbe@1309 | 49 pointer-events: auto; |
| bsw/jbe@1309 | 50 transition: transform 0.25s $animation-curve-linear-out-slow-in; |
| bsw/jbe@1309 | 51 |
| bsw/jbe@1309 | 52 @media(min-width: $snackbar-tablet-breakpoint) { |
| bsw/jbe@1309 | 53 transform: translate(-50%, 0); |
| bsw/jbe@1309 | 54 } |
| bsw/jbe@1309 | 55 } |
| bsw/jbe@1309 | 56 |
| bsw/jbe@1309 | 57 &__text { |
| bsw/jbe@1309 | 58 padding: 14px 12px 14px 24px; |
| bsw/jbe@1309 | 59 vertical-align: middle; |
| bsw/jbe@1309 | 60 color: white; |
| bsw/jbe@1309 | 61 float: left; |
| bsw/jbe@1309 | 62 } |
| bsw/jbe@1309 | 63 |
| bsw/jbe@1309 | 64 &__action { |
| bsw/jbe@1309 | 65 background: transparent; |
| bsw/jbe@1309 | 66 border: none; |
| bsw/jbe@1309 | 67 color: $snackbar-action-color; |
| bsw/jbe@1309 | 68 float: right; |
| bsw/jbe@1309 | 69 text-transform: uppercase; |
| bsw/jbe@1309 | 70 padding: 14px 24px 14px 12px; |
| bsw/jbe@1309 | 71 @include typo-button(); |
| bsw/jbe@1309 | 72 overflow: hidden; |
| bsw/jbe@1309 | 73 outline: none; |
| bsw/jbe@1309 | 74 opacity: 0; |
| bsw/jbe@1309 | 75 pointer-events: none; |
| bsw/jbe@1309 | 76 cursor: pointer; |
| bsw/jbe@1309 | 77 text-decoration: none; |
| bsw/jbe@1309 | 78 text-align: center; |
| bsw/jbe@1309 | 79 align-self: center; |
| bsw/jbe@1309 | 80 |
| bsw/jbe@1309 | 81 &::-moz-focus-inner { |
| bsw/jbe@1309 | 82 border: 0; |
| bsw/jbe@1309 | 83 } |
| bsw/jbe@1309 | 84 &:not([aria-hidden]) { |
| bsw/jbe@1309 | 85 opacity: 1; |
| bsw/jbe@1309 | 86 pointer-events: auto; |
| bsw/jbe@1309 | 87 } |
| bsw/jbe@1309 | 88 } |
| bsw/jbe@1309 | 89 } |