Seperated out the sticker scss so that it's not dependent on the frame being present.
This commit is contained in:
parent
ae04ff7613
commit
1de4ccb467
@ -6,6 +6,7 @@ $pink: #de6c74 !default;
|
|||||||
$red: #b00020 !default;
|
$red: #b00020 !default;
|
||||||
$orange: #fd7e14 !default;
|
$orange: #fd7e14 !default;
|
||||||
$yellow: #ee9700 !default;
|
$yellow: #ee9700 !default;
|
||||||
|
$yellow-bright: #fffe4e !default;
|
||||||
$green: #004733 !default;
|
$green: #004733 !default;
|
||||||
$teal: #00bb9c !default;
|
$teal: #00bb9c !default;
|
||||||
$cyan: #0dcaf0 !default;
|
$cyan: #0dcaf0 !default;
|
||||||
@ -29,3 +30,8 @@ $leftMenu-color: #ddd;
|
|||||||
$leftMenu-HoverColour: $blue;
|
$leftMenu-HoverColour: $blue;
|
||||||
$leftMenu-selected-color: $blue;
|
$leftMenu-selected-color: $blue;
|
||||||
$leftMenu-submenu-open: $blue;
|
$leftMenu-submenu-open: $blue;
|
||||||
|
|
||||||
|
// Sticker
|
||||||
|
$sticker-background: $yellow-bright;
|
||||||
|
$sticker-color: $leftMenu-background;
|
||||||
|
$sticker-border-color: darken($yellow-bright, 10%);
|
||||||
|
|||||||
@ -4,29 +4,6 @@
|
|||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.sticker {
|
|
||||||
position: fixed;
|
|
||||||
top: 30px;
|
|
||||||
left: -60px;
|
|
||||||
padding: 4px 0;
|
|
||||||
width: 200px;
|
|
||||||
text-align: center;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 0.875em;
|
|
||||||
line-height: 1em;
|
|
||||||
background: #fffe4e;
|
|
||||||
color: #333;
|
|
||||||
border-top: 2px solid #c9c353;
|
|
||||||
border-bottom: 2px solid #c9c353;
|
|
||||||
-webkit-transform: rotate(-45deg);
|
|
||||||
-moz-transform: rotate(-45deg);
|
|
||||||
-ms-transform: rotate(-45deg);
|
|
||||||
-o-transform: rotate(-45deg);
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
z-index: 2;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.frame-row {
|
.frame-row {
|
||||||
|
|||||||
24
src/Sass/_sticker.scss
Normal file
24
src/Sass/_sticker.scss
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
@import "./_esuiteVariables.scss";
|
||||||
|
|
||||||
|
.sticker {
|
||||||
|
position: fixed;
|
||||||
|
top: 30px;
|
||||||
|
left: -60px;
|
||||||
|
padding: 4px 0;
|
||||||
|
width: 200px;
|
||||||
|
text-align: center;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 0.875em;
|
||||||
|
line-height: 1em;
|
||||||
|
background: $sticker-background;
|
||||||
|
color: $sticker-color;
|
||||||
|
border-top: 2px solid $sticker-border-color;
|
||||||
|
border-bottom: 2px solid $sticker-border-color;
|
||||||
|
-webkit-transform: rotate(-45deg);
|
||||||
|
-moz-transform: rotate(-45deg);
|
||||||
|
-ms-transform: rotate(-45deg);
|
||||||
|
-o-transform: rotate(-45deg);
|
||||||
|
transform: rotate(-45deg);
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user