Seperated out the sticker scss so that it's not dependent on the frame being present.

This commit is contained in:
Colin Dawson 2026-03-18 13:41:36 +00:00
parent ae04ff7613
commit 1de4ccb467
3 changed files with 30 additions and 23 deletions

View File

@ -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%);

View File

@ -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
View 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;
}