aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/trails
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/trails')
-rw-r--r--src/client/views/nodes/trails/PresBox.scss142
1 files changed, 71 insertions, 71 deletions
diff --git a/src/client/views/nodes/trails/PresBox.scss b/src/client/views/nodes/trails/PresBox.scss
index e34e1b380..e24b47bd1 100644
--- a/src/client/views/nodes/trails/PresBox.scss
+++ b/src/client/views/nodes/trails/PresBox.scss
@@ -1,4 +1,4 @@
-@import '../../global/globalCssVariables.module.scss';
+@use '../../global/globalCssVariables.module.scss' as global;
.presBox-gpt-chat {
padding: 16px;
@@ -203,8 +203,8 @@
align-items: center;
height: 30px;
width: 100%;
- color: $white;
- background-color: $dark-gray;
+ color: global.$white;
+ background-color: global.$dark-gray;
.toolbar-button {
cursor: pointer;
@@ -218,7 +218,7 @@
}
.toolbar-button.active {
- color: $light-blue;
+ color: global.$light-blue;
background-color: white;
border-radius: 100%;
}
@@ -266,7 +266,7 @@
}
.toolbar-divider {
- border-left: solid $medium-gray 0.5px;
+ border-left: solid global.$medium-gray 0.5px;
height: 20px;
}
}
@@ -274,13 +274,13 @@
.dropdown {
font-size: 10;
margin-left: 5px;
- color: $medium-gray;
+ color: global.$medium-gray;
transition: 0.5s ease;
}
.dropdown.active {
transform: rotate(180deg);
- color: $light-blue;
+ color: global.$light-blue;
opacity: 0.7;
}
@@ -340,7 +340,7 @@
.ribbon-colorBox {
cursor: pointer;
- border: solid 1px $black;
+ border: solid 1px global.$black;
display: flex;
margin-left: 5px;
margin-top: 5px;
@@ -387,7 +387,7 @@
}
.ribbon-propertyUpDownItem:hover {
- background: $medium-gray;
+ background: global.$medium-gray;
transform: scale(1.05);
}
}
@@ -413,7 +413,7 @@
@media screen and (-webkit-min-device-pixel-ratio: 0) {
.multiThumb-slider {
display: grid;
- background-color: $white;
+ background-color: global.$white;
height: 10px;
border-radius: 10px;
overflow: hidden;
@@ -431,8 +431,8 @@
-webkit-appearance: none;
height: 10px;
cursor: ew-resize;
- background: $medium-blue;
- box-shadow: -100vw 0 0 100vw $white;
+ background: global.$medium-blue;
+ box-shadow: -100vw 0 0 100vw global.$white;
}
.toolbar-slider.end::-webkit-slider-thumb {
@@ -441,8 +441,8 @@
-webkit-appearance: none;
height: 10px;
cursor: ew-resize;
- background: $medium-blue;
- box-shadow: -100vw 0 0 100vw $light-blue;
+ background: global.$medium-blue;
+ box-shadow: -100vw 0 0 100vw global.$light-blue;
}
}
@@ -456,7 +456,7 @@
height: 10px;
border-radius: 10px;
-webkit-appearance: none;
- background-color: $white;
+ background-color: global.$white;
}
.toolbar-slider:focus {
@@ -476,8 +476,8 @@
-webkit-appearance: none;
height: 10px;
cursor: ew-resize;
- background: $medium-blue;
- box-shadow: -100vw 0 0 100vw $light-blue;
+ background: global.$medium-blue;
+ box-shadow: -100vw 0 0 100vw global.$light-blue;
}
.presBox-checkbox {
@@ -493,7 +493,7 @@
width: 15px;
min-width: 15px;
cursor: pointer;
- background: $white;
+ background: global.$white;
}
.presBox-checkbox:focus {
@@ -501,11 +501,11 @@
}
.presBox-checkbox:hover {
- background: $light-gray;
+ background: global.$light-gray;
}
.presBox-checkbox:checked {
- background: $light-blue;
+ background: global.$light-blue;
}
}
@@ -554,9 +554,9 @@
text-align: center;
font-size: 16;
width: 90%;
- color: $black;
+ color: global.$black;
transform: translate(5%, 0px);
- border-bottom: solid 2px $medium-gray;
+ border-bottom: solid 2px global.$medium-gray;
}
.ribbon-textInput {
@@ -568,8 +568,8 @@
justify-self: left;
margin-top: 5px;
padding-left: 10px;
- background-color: $white;
- border: solid 1px $black;
+ background-color: global.$white;
+ border: solid 1px global.$black;
min-width: 80px;
max-width: 200px;
width: 100%;
@@ -590,7 +590,7 @@
}
.ribbon-frameSelector {
- border: $black solid 1px;
+ border: global.$black solid 1px;
width: 60px;
height: 20px;
margin-top: 5px;
@@ -607,12 +607,12 @@
cursor: pointer;
position: relative;
height: 100%;
- background: $white;
+ background: global.$white;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
- color: $black;
+ color: global.$black;
}
.numKeyframe {
@@ -620,7 +620,7 @@
font-size: 10;
font-weight: 600;
position: relative;
- color: $black;
+ color: global.$black;
display: flex;
width: 100%;
height: 100%;
@@ -662,7 +662,7 @@
padding-left: 10;
padding-right: 10;
border-radius: 10px;
- background-color: $medium-gray;
+ background-color: global.$medium-gray;
}
.ribbon-final-button:hover {
@@ -681,13 +681,13 @@
align-items: center;
margin-bottom: 5px;
height: 25px;
- color: $light-gray;
+ color: global.$light-gray;
width: 100%;
max-width: 120;
padding-left: 10;
padding-right: 10;
border-radius: 10px;
- background-color: $black;
+ background-color: global.$black;
}
.ribbon-final-button-hidden:hover {
@@ -698,15 +698,15 @@
.ribbon-frameList {
width: calc(100% - 5px);
height: 50px;
- background-color: $white;
- border: 1px solid $medium-gray;
+ background-color: global.$white;
+ border: 1px solid global.$medium-gray;
grid-template-rows: max-content;
.frameList-header {
display: grid;
width: 100%;
height: 20px;
- background-color: $medium-gray;
+ background-color: global.$medium-gray;
.frameList-headerButtons {
display: flex;
@@ -761,7 +761,7 @@
font-size: 10.5;
font-weight: 300;
height: 20;
- background-color: $medium-gray;
+ background-color: global.$medium-gray;
color: white;
display: flex;
margin-top: 5px;
@@ -780,8 +780,8 @@
transition: all 0.4s;
font-weight: 400;
opacity: 1;
- color: $white;
- background-color: $black;
+ color: global.$white;
+ background-color: global.$black;
}
.ribbon-toggle {
@@ -789,9 +789,9 @@
font-size: 10.5;
font-weight: 200;
height: 20;
- background-color: $white;
+ background-color: global.$white;
display: inline-flex;
- color: $black;
+ color: global.$black;
border-radius: 5px;
width: max-content;
justify-content: center;
@@ -831,13 +831,13 @@
position: relative;
font-size: 13;
padding-bottom: 10px;
- border-bottom: solid 1px $dark-gray;
+ border-bottom: solid 1px global.$dark-gray;
.presBox-dropdown:hover {
- border: solid 1px $medium-blue;
+ border: solid 1px global.$medium-blue;
.presBox-dropdownIcon {
- color: $medium-blue;
+ color: global.$medium-blue;
}
}
@@ -846,12 +846,12 @@
display: grid;
grid-template-columns: auto 20%;
position: relative;
- border: solid 1px $black;
- background-color: $light-gray;
+ border: solid 1px global.$black;
+ background-color: global.$light-gray;
border-radius: 5px;
font-size: 10;
height: 25;
- color: $black;
+ color: global.$black;
padding-left: 5px;
align-items: center;
margin-top: 5px;
@@ -917,7 +917,7 @@
height: 100px;
padding-top: 5px;
padding-bottom: 5px;
- border: solid 1px $black;
+ border: solid 1px global.$black;
// overflow: auto;
::-webkit-scrollbar {
@@ -967,7 +967,7 @@
cursor: pointer;
position: relative;
text-align: center;
- border-left: solid 1px $medium-gray;
+ border-left: solid 1px global.$medium-gray;
width: 20%;
height: 100%;
display: flex;
@@ -998,7 +998,7 @@
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8);
z-index: 200;
background-color: white;
- color: $black;
+ color: global.$black;
position: absolute;
overflow: hidden;
}
@@ -1014,12 +1014,12 @@
align-items: center;
justify-content: center;
transform: translate(0px, -1px);
- background-color: $white;
+ background-color: global.$white;
width: 40px;
height: 15px;
align-self: center;
justify-self: center;
- border: solid 1px $black;
+ border: solid 1px global.$black;
border-top: 0px;
border-bottom-right-radius: 7px;
border-bottom-left-radius: 7px;
@@ -1028,15 +1028,15 @@
.layout-container {
padding: 5px;
display: grid;
- background-color: $white;
+ background-color: global.$white;
grid-template-columns: repeat(auto-fit, minmax(90px, 100px));
width: 100%;
- border: solid 1px $black;
+ border: solid 1px global.$black;
min-width: 100px;
overflow: hidden;
.layout:hover {
- border: solid 2px $medium-blue;
+ border: solid 2px global.$medium-blue;
}
.layout {
@@ -1051,7 +1051,7 @@
width: 90px;
overflow: hidden;
background-color: white;
- border: solid $medium-gray 1px;
+ border: solid global.$medium-gray 1px;
display: grid;
grid-template-rows: auto;
align-items: center;
@@ -1066,7 +1066,7 @@
height: 13;
font-size: 12;
display: flex;
- background-color: $white;
+ background-color: global.$white;
}
.subtitle {
@@ -1079,7 +1079,7 @@
height: 13;
font-size: 9;
display: flex;
- background-color: $white;
+ background-color: global.$white;
}
.content {
@@ -1092,7 +1092,7 @@
height: 13;
font-size: 10;
display: flex;
- background-color: $white;
+ background-color: global.$white;
height: 33;
text-align: left;
font-size: 8px;
@@ -1103,7 +1103,7 @@
.presBox-buttons {
position: relative;
width: 100%;
- background: $medium-gray;
+ background: global.$medium-gray;
min-height: 35px;
padding-top: 5px;
padding-bottom: 5px;
@@ -1137,8 +1137,8 @@
}
select {
- background: $dark-gray;
- color: $white;
+ background: global.$dark-gray;
+ color: global.$white;
}
.presBox-button {
@@ -1152,8 +1152,8 @@
text-align: center;
letter-spacing: normal;
width: inherit;
- background: $dark-gray;
- color: $white;
+ background: global.$dark-gray;
+ color: global.$white;
}
.presBox-button.active {
@@ -1161,7 +1161,7 @@
}
.presBox-button.active:hover {
- background-color: $medium-blue;
+ background-color: global.$medium-blue;
}
.presBox-button.edit {
@@ -1238,8 +1238,8 @@
font-size: 100;
display: flex;
align-items: center;
- background: $dark-gray;
- color: $white;
+ background: global.$dark-gray;
+ color: global.$white;
}
.presBox-viewPicker {
@@ -1273,7 +1273,7 @@
left: 0;
opacity: 0.5;
transition: all 0.4s;
- color: $white;
+ color: global.$white;
width: 100%;
height: 100%;
}
@@ -1283,8 +1283,8 @@
}
.presPanelOverlay {
- background-color: $dark-gray;
- color: $white;
+ background-color: global.$dark-gray;
+ color: global.$white;
border-radius: 5px;
grid-template-rows: 100%;
height: 100%;
@@ -1316,7 +1316,7 @@
.presPanel-divider {
width: 0.5px;
height: 80%;
- border-right: solid 1px $medium-gray;
+ border-right: solid 1px global.$medium-gray;
}
.presPanel-button-frame {
@@ -1348,12 +1348,12 @@
}
.presPanel-button:hover {
- background-color: $medium-gray;
+ background-color: global.$medium-gray;
transform: scale(1.2);
}
.presPanel-button-text:hover {
- background-color: $medium-gray;
+ background-color: global.$medium-gray;
}
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2026-01-23 07:47:24 +0000