f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-04 12:32:39 +00:00
Code Wiki Activity

flow changed, flex added, elipsis added

Browse Source
This commit is contained in:
Víctor Losada Hernández
2024-08-14 16:33:02 +02:00
parent 031ed751d1
commit bf3c083e8c
1 changed files with 31 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
client/homebrew/navbar/navbar.less
View File

@@ -24,6 +24,8 @@
.homebrew nav { .homebrew nav {
background-color : #333333; background-color : #333333;
container : nav / inline-size;
.navContent { .navContent {
position : relative; position : relative;
z-index : 2; z-index : 2;
@@ -34,6 +36,8 @@
display : flex; display : flex;
align-items : center; align-items : center;
&:last-child .navItem { border-left : 1px solid #666666; } &:last-child .navItem { border-left : 1px solid #666666; }
&:has(.brewTitle) {flex-grow : 1; min-width : 300px;container : brewTitle / inline-size; }
} }
// "NaturalCrit" logo // "NaturalCrit" logo
.navLogo { .navLogo {
@@ -68,6 +72,10 @@
.navItem { .navItem {
#backgroundColorsHover; #backgroundColorsHover;
.animate(background-color); .animate(background-color);
display : flex;
align-items : center;
justify-content : center;
height : 100%;
padding : 8px 12px; padding : 8px 12px;
font-size : 10px; font-size : 10px;
font-weight : 800; font-weight : 800;
@@ -77,6 +85,7 @@
text-transform : uppercase; text-transform : uppercase;
cursor : pointer; cursor : pointer;
background-color : #333333; background-color : #333333;
i { i {
float : right; float : right;
margin-left : 5px; margin-left : 5px;
@@ -93,39 +102,20 @@
animation-duration : 2s; animation-duration : 2s;
} }
} }
&.editTitle { // this is not needed at all currently - you used to be able to edit the title via the navbar.
padding : 2px 12px;
input {
width : 250px;
padding : 2px;
margin : 0;
font-family : 'Open Sans', sans-serif;
font-size : 12px;
font-weight : 800;
color : white;
text-align : center;
background-color : transparent;
border : 1px solid @blue;
outline : none;
}
.charCount {
display : inline-block;
margin-left : 8px;
color : #666666;
text-align : right;
vertical-align : bottom;
&.max { color : @red; }
}
}
&.brewTitle { &.brewTitle {
flex-grow : 1; display : block;
width : 100%;
overflow : hidden;
font-size : 12px; font-size : 12px;
font-weight : 800; font-weight : 800;
color : white; color : white;
text-align : center; text-align : center;
text-transform : initial; text-overflow : ellipsis;
background-color : transparent; text-transform : initial;
white-space : nowrap;
background-color : transparent;
} }
// "The Homebrewery" logo // "The Homebrewery" logo
&.homebrewLogo { &.homebrewLogo {
.animate(color); .animate(color);
@@ -239,23 +229,25 @@
} }
.navDropdownContainer { .navDropdownContainer {
position : relative; position : relative;
height : 100%;
.navDropdown { .navDropdown {
position: absolute; position : absolute;
top: 28px; //top: 28px;
right: 0px; right : 0px;
z-index: 10000; z-index : 10000;
width: max-content; display : flex;
min-width:100%; flex-direction : column;
max-height: calc(100vh - 28px); align-items : flex-end;
overflow: hidden auto; width : max-content;
display: flex; min-width : 100%;
flex-direction: column; max-height : calc(100vh - 28px);
align-items: flex-end; overflow : hidden auto;
.navItem { .navItem {
position : relative; position : relative;
display : flex; display : flex;
justify-content : space-between;
align-items : center; align-items : center;
justify-content : space-between;
width : 100%; width : 100%;
border : 1px solid #888888; border : 1px solid #888888;
border-bottom : 0; border-bottom : 0;