f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 18:32:41 +00:00
Code Wiki Activity

move some toolbar specific styling to toolbar.less

Browse Source
This commit is contained in:
Gazook89
2024-10-13 20:45:05 -05:00
parent c4fbc8d827
commit 810c2140c9
2 changed files with 52 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
client/components/Anchored.less
View File

@@ -1,12 +1,7 @@
.anchored-trigger {
&.active {
background-color: #444444;
}
}
.anchored-box {
position:absolute;
top: 30px;
@supports (inset-block-start: anchor(bottom)){
inset-block-start: anchor(bottom);
}
@@ -15,44 +10,4 @@
&.active {
visibility: visible;
}
padding : 15px;
color : white;
background-color : #555555;
border-radius : 5px;
font-size : .8em;
margin-top : 10px;
h1 {
border-bottom: 1px solid currentColor;
margin-bottom: 0.5em;
padding-bottom: 0.3em;
}
h2 {
color: lightgray;
border-bottom: 1px solid currentColor;
margin: 1em 0 0.5em 0;
padding-bottom: 0.3em;
}
label {
display: flex;
align-items: center;
justify-content: space-between;
gap: 6px;
}
&:before {
content: "";
width: 0px;
height: 0px;
position: absolute;
border: 10px solid transparent;
border-bottom: 10px solid #555555;
left: 50%;
transform: translateX(-50%);
top: -20px;
pointer-events: none;
}
}

55
client/homebrew/brewRenderer/toolBar/toolBar.less
View File

@@ -38,17 +38,64 @@
background-color: #444;
}
.anchored-trigger {
&.active {
background-color: #444444;
}
}
.anchored-box {
color: #CCCCCC;
display: flex;
flex-direction: column;
gap: 5px;
--box-color : #555555;
top : 30px;
display : flex;
flex-direction : column;
gap : 5px;
padding : 15px;
margin-top : 10px;
font-size : .8em;
color : #CCCCCC;
background-color : var(--box-color);
border-radius : 5px;
h1 {
border-bottom: 1px solid currentColor;
margin-bottom: 0.5em;
padding-bottom: 0.3em;
}
h2 {
color: lightgray;
border-bottom: 1px solid currentColor;
margin: 1em 0 0.5em 0;
padding-bottom: 0.3em;
}
label {
display: flex;
align-items: center;
justify-content: space-between;
gap: 6px;
}
input{
height: unset;
&[type='range'] {
padding: 0;
}
}
&:before {
content: "";
width: 0px;
height: 0px;
position: absolute;
border: 10px solid transparent;
border-bottom: 10px solid var(--box-color);
left: 50%;
transform: translateX(-50%);
top: -20px;
pointer-events: none;
}
}
.radio-group:has(button[role='radio']){