0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-10 20:03:03 +00:00

Change toolbar spacing

replace column-/row-gap with a single gap at 5px.  Padding on each child element will provide the space.  Set a height on toolbar, so child elements can be set to 100% height to improve bg color change on hover.
This commit is contained in:
Gazook89
2024-08-17 15:32:30 -05:00
parent fc96f6bf95
commit adab8449e0

View File

@@ -3,12 +3,13 @@
z-index : 1; z-index : 1;
display : flex; display : flex;
flex-wrap : wrap; flex-wrap : wrap;
row-gap : 5px; gap : 5px;
column-gap : 15px;
align-items : center; align-items : center;
justify-content : center; justify-content : center;
box-sizing : border-box;
width : 100%; width : 100%;
padding: 2px 0; height : 29px;
padding : 2px 0;
font-family : 'Open Sans', sans-serif; font-family : 'Open Sans', sans-serif;
color : white; color : white;
background-color : #555555; background-color : #555555;
@@ -57,21 +58,23 @@
.tool { .tool {
display : flex; display : flex;
align-items : center; align-items : center;
height : 100%;
padding : 0 8px;
color : #CCCCCC; color : #CCCCCC;
padding : 0;
height: 100%;
box-sizing: content-box;
&:hover,&:focus-within { background-color : #444444; } &:hover,&:focus-within { background-color : #444444; }
button { button {
width : 70px; width : 70px;
padding : 0;
font-family : 'Open Sans', sans-serif; font-family : 'Open Sans', sans-serif;
font-size : 11px; font-size : 11px;
font-weight : normal; font-weight : normal;
color : #CCCCCC; color : #CCCCCC;
text-transform : uppercase; text-transform : uppercase;
background-color : transparent; background-color : transparent;
height : 100%;
padding : 0 8px;
&:focus-within { &:focus-within {
height : 100%; height : 100%;