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

eslint and stylelint

Browse Source 
stylelint has a problem with the `:horizontal` pseudo selector in brewRenderer.jsx, which is being used to apply some styling to the custom scrollbars.  As far as i can tell, the selector is not standards-track, so that is probably why.  Not sure if we want to adjsut our stylelint config to allow it?
This commit is contained in:
Gazook89
2024-08-23 19:16:59 -05:00
parent 977d0ea73a
commit f3ed174b0e
2 changed files with 40 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
client/homebrew/brewRenderer/brewRenderer.less
View File

@@ -1,9 +1,9 @@
@import (multiple, less) 'shared/naturalcrit/styles/reset.less';
.brewRenderer {
will-change : transform;
overflow-y : scroll;
padding-top : 30px;
overflow-y : scroll;
will-change : transform;
:where(.pages) {
margin : 30px 0px;
@@ -19,23 +19,19 @@
}
&::-webkit-scrollbar {
width: 20px;
width : 20px;
&:horizontal{
height: 20px;
width:auto;
&:horizontal {
width : auto;
height : 20px;
}
&-thumb {
background: linear-gradient(90deg, #d3c1af 15px, #00000000 15px);
&:horizontal{
background: linear-gradient(0deg, #d3c1af 15px, #00000000 15px);
}
background : linear-gradient(90deg, #D3C1AF 15px, #00000000 15px);
&:horizontal { background : linear-gradient(0deg, #D3C1AF 15px, #00000000 15px); }
}
&-corner {
visibility: hidden;
}
&-corner { visibility : hidden; }
}
}
@@ -70,18 +66,14 @@
}
@media print {
.toolBar {
display: none;
}
.toolBar { display : none; }
.brewRenderer {
height: 100%;
overflow-y: unset;
padding-top: unset;
height : 100%;
padding-top : unset;
overflow-y : unset;
.pages {
margin: 0px;
&>.page {
box-shadow: unset;
}
margin : 0px;
& > .page { box-shadow : unset; }
}
}
}

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

@@ -1,12 +1,12 @@
.toolBar {
position : absolute;
z-index : 1;
box-sizing : border-box;
display : flex;
flex-wrap : wrap;
gap : 8px 30px;
align-items : center;
justify-content : center;
box-sizing : border-box;
width : 100%;
height : auto;
padding : 2px 0;
@@ -15,17 +15,17 @@
background-color : #555555;
.group {
box-sizing : border-box;
display : flex;
gap: 0 3px;
gap : 0 3px;
align-items : center;
justify-content : center;
box-sizing : border-box;
height: 28px;
height : 28px;
}
.tool {
display: flex;
align-items: center;
display : flex;
align-items : center;
}
input {
@@ -35,20 +35,20 @@
font-family : 'Open Sans', sans-serif;
color : #000000;
background : #EEEEEE;
border : 1px solid gray;
&:focus { outline : 1px solid #d3d3d3; }
border : 1px solid gray;
&:focus { outline : 1px solid #D3D3D3; }
// `.range-input` if generic to all range inputs, or `#zoom-input` if only for zoom slider
&.range-input {
color: #D3D3D3;
accent-color: #d3d3d3;
padding: 2px 0;
padding : 2px 0;
color : #D3D3D3;
accent-color : #D3D3D3;
&::-webkit-slider-thumb, &::-moz-slider-thumb {
cursor : pointer;
width: 5px;
height: 5px;
outline: none;
&::-webkit-slider-thumb, &::-moz-slider-thumb {
width : 5px;
height : 5px;
cursor : pointer;
outline : none;
}
&:hover::after {
@@ -70,9 +70,9 @@
// `.text-input` if generic to all range inputs, or `#page-input` if only for current page input
&#page-input {
width: 4ch;
text-align: center;
margin-right: 1ch;
width : 4ch;
margin-right : 1ch;
text-align : center;
}
@@ -80,21 +80,21 @@
button {
display : flex;
align-items : center;
justify-content: center;
height : 100%;
box-sizing : content-box;
display : flex;
align-items : center;
justify-content : center;
width : auto;
min-width : 46px;
height : 100%;
padding : 0 0px;
font-weight : unset;
color : inherit;
background-color : unset;
box-sizing: content-box;
&:hover { background-color : #444444; }
&:focus { outline : 1px solid #d3d3d3; }
&:focus { outline : 1px solid #D3D3D3; }
&:disabled {
color : #777777;