0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-09 02:52:38 +00:00

Merge pull request #3242 from naturalcrit/stylelint-Snippetbar.less

Lint snippetbar.less
This commit is contained in:
Trevor Buckner
2024-01-12 11:58:39 -05:00
committed by GitHub

View File

@@ -1,29 +1,27 @@
@import (less) './client/icons/customIcons.less'; @import (less) './client/icons/customIcons.less';
@import (less) '././././themes/fonts/5e/fonts.less'; @import (less) '././././themes/fonts/5e/fonts.less';
.snippetBar{ .snippetBar {
@menuHeight : 25px; @menuHeight : 25px;
position : relative; position : relative;
height : @menuHeight; height : @menuHeight;
background-color : #ddd; color : black;
color : black; background-color : #DDDDDD;
.editors{ .editors {
position : absolute; position : absolute;
display : flex;
top : 0px; top : 0px;
right : 0px; right : 0px;
height : @menuHeight; display : flex;
justify-content : space-between; justify-content : space-between;
&>div{ height : @menuHeight;
height : @menuHeight; & > div {
width : @menuHeight; width : @menuHeight;
cursor : pointer; height : @menuHeight;
line-height : @menuHeight; line-height : @menuHeight;
text-align : center; text-align : center;
&:hover,&.selected{ cursor : pointer;
background-color : #999; &:hover,&.selected { background-color : #999999; }
}
&.text { &.text {
.tooltipLeft('Brew Editor'); .tooltipLeft('Brew Editor');
} }
@@ -37,17 +35,13 @@
.tooltipLeft('Undo'); .tooltipLeft('Undo');
font-size : 0.75em; font-size : 0.75em;
color : grey; color : grey;
&.active{ &.active { color : inherit; }
color : inherit;
}
} }
&.redo { &.redo {
.tooltipLeft('Redo'); .tooltipLeft('Redo');
font-size : 0.75em; font-size : 0.75em;
color : grey; color : grey;
&.active{ &.active { color : inherit; }
color : inherit;
}
} }
&.foldAll { &.foldAll {
.tooltipLeft('Fold All'); .tooltipLeft('Fold All');
@@ -65,136 +59,128 @@
color : black; color : black;
&.active { &.active {
position : relative; position : relative;
background-color : #999; background-color : #999999;
} }
} }
&.divider { &.divider {
background: linear-gradient(currentColor, currentColor) no-repeat center/1px 100%; width : 5px;
width: 5px; background : linear-gradient(currentColor, currentColor) no-repeat center/1px 100%;
&:hover { &:hover { background-color : inherit; }
background-color: inherit;
}
} }
} }
.themeSelector { .themeSelector {
position : absolute; position : absolute;
top : 25px; top : 25px;
right : 0; right : 0;
z-index : 1; z-index : 1;
display : flex; display : flex;
align-items : center; align-items : center;
justify-content : center; justify-content : center;
width : 170px; width : 170px;
height : inherit; height : inherit;
background-color : inherit; background-color : inherit;
} }
} }
.snippetBarButton { .snippetBarButton {
height: @menuHeight; display : inline-block;
line-height: @menuHeight; height : @menuHeight;
display: inline-block; padding : 0px 5px;
padding: 0px 5px; font-size : 0.625em;
font-weight: 800; font-weight : 800;
font-size: 0.625em; line-height : @menuHeight;
text-transform: uppercase; text-transform : uppercase;
cursor: pointer; cursor : pointer;
&:hover, &.selected { &:hover, &.selected { background-color : #999999; }
background-color: #999;
}
i { i {
vertical-align: middle; margin-right : 3px;
margin-right: 3px; font-size : 1.4em;
font-size: 1.4em; vertical-align : middle;
} }
} }
.toggleMeta { .toggleMeta {
position: absolute; position : absolute;
top: 0px; top : 0px;
right: 0px; right : 0px;
border-left: 1px solid black; border-left : 1px solid black;
.tooltipLeft("Edit Brew Properties"); .tooltipLeft('Edit Brew Properties');
} }
.snippetGroup{ .snippetGroup {
border-right : 1px solid currentColor; border-right : 1px solid currentColor;
&:hover{ &:hover {
&>.dropdown{ & > .dropdown { visibility : visible; }
visibility : visible;
}
} }
.dropdown { .dropdown {
position: absolute; position : absolute;
top: 100%; top : 100%;
visibility: hidden; z-index : 1000;
z-index: 1000; padding : 0px;
margin-left: -5px; margin-left : -5px;
padding: 0px; visibility : hidden;
background-color: #ddd; background-color : #DDDDDD;
.snippet { .snippet {
position: relative; position : relative;
display : flex;
align-items : center;
min-width : max-content;
padding : 5px;
font-size : 10px;
cursor : pointer;
.animate(background-color); .animate(background-color);
display: flex;
align-items: center;
min-width: max-content;
padding: 5px;
cursor: pointer;
font-size: 10px;
i { i {
margin-right: 8px; height : 1.2em;
font-size: 1.2em; margin-right : 8px;
height: 1.2em; font-size : 1.2em;
&~i { & ~ i {
margin-right: 0; margin-right : 0;
margin-left: 5px; margin-left : 5px;
} }
/* Fonts */ /* Fonts */
&.font { &.font {
height:auto; height : auto;
&::before { &::before {
content:'F'; font-size : 1.4em;
font-size:1.4em; content : 'F';
} }
&.OpenSans {font-family: 'OpenSans';} &.OpenSans {font-family : 'OpenSans';}
&.CodeBold {font-family: 'CodeBold';} &.CodeBold {font-family : 'CodeBold';}
&.CodeLight {font-family: 'CodeLight';} &.CodeLight {font-family : 'CodeLight';}
&.ScalySansRemake {font-family: 'ScalySansRemake';} &.ScalySansRemake {font-family : 'ScalySansRemake';}
&.BookInsanityRemake {font-family: 'BookInsanityRemake';} &.BookInsanityRemake {font-family : 'BookInsanityRemake';}
&.MrEavesRemake {font-family: 'MrEavesRemake';} &.MrEavesRemake {font-family : 'MrEavesRemake';}
&.SolberaImitationRemake {font-family: 'SolberaImitationRemake';} &.SolberaImitationRemake {font-family : 'SolberaImitationRemake';}
&.ScalySansSmallCapsRemake {font-family: 'ScalySansSmallCapsRemake';} &.ScalySansSmallCapsRemake {font-family : 'ScalySansSmallCapsRemake';}
&.WalterTurncoat {font-family: 'WalterTurncoat';} &.WalterTurncoat {font-family : 'WalterTurncoat';}
&.Lato {font-family: 'Lato';} &.Lato {font-family : 'Lato';}
&.Courier {font-family: 'Courier';} &.Courier {font-family : 'Courier';}
&.NodestoCapsCondensed {font-family: 'NodestoCapsCondensed';} &.NodestoCapsCondensed {font-family : 'NodestoCapsCondensed';}
&.Overpass {font-family: 'Overpass';} &.Overpass {font-family : 'Overpass';}
&.Davek {font-family: 'Davek';} &.Davek {font-family : 'Davek';}
&.Iokharic {font-family: 'Iokharic';} &.Iokharic {font-family : 'Iokharic';}
&.Rellanic {font-family: 'Rellanic';} &.Rellanic {font-family : 'Rellanic';}
&.TimesNewRoman {font-family: 'Times New Roman';} &.TimesNewRoman {font-family : 'Times New Roman';}
} }
} }
.name { .name { margin-right : auto; }
margin-right: auto;
}
.beta { .beta {
color: white; align-self : center;
padding: 4px 6px; padding : 4px 6px;
line-height: 1em; margin-left : 5px;
margin-left: 5px; font-family : monospace;
align-self: center; line-height : 1em;
background: grey; color : white;
border-radius: 12px; background : grey;
font-family: monospace; border-radius : 12px;
} }
&:hover { &:hover {
background-color: #999; background-color : #999999;
&>.dropdown { & > .dropdown {
visibility: visible; visibility : visible;
&.side { &.side {
left: 100%; top : 0%;
top: 0%; left : 100%;
margin-left: 0; margin-left : 0;
box-shadow: -1px 1px 2px 0px #999; box-shadow : -1px 1px 2px 0px #999999;
} }
} }
} }