tronnet/ProxmoxAAS-Dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

reimplement instance card using display;contents to have better alignment and fitting to grid for instance card container,

Browse Source 
migrate away from using w3-hide to custom hide for breakpoint fixes
This commit is contained in:
Arthur Lu
2025-10-10 06:35:28 +00:00
parent 2f21b23535
commit 06afdcec37
5 changed files with 140 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
web/css/style.css
View File

@@ -100,7 +100,7 @@ img, svg {
color: var(--main-text-color)
}
hr, * {
hr {
border-color: var(--main-text-color);
}
@@ -156,18 +156,26 @@ hr, * {
}
/* add hide large class similar to w3-hide-medium and w3-hide-small */
@media (width >=993px) {
.w3-hide-large {
display: none !important;
}
@media screen and (width >=993px) {
.hide-large {display: none !important;}
}
/* fix edge case in w3-hide-medium where width between 992 and 993 */
@media (width <=993px) and (width >=601px){
.w3-hide-medium{display:none!important}
/* fixes edge case in w3-hide-medium where width between 992 and 993 */
@media screen and (width <=993px) and (width >=601px){
.hide-large {display: none !important;}
.hide-medium {display:none !important}
}
/* fix edge case in w3-hide-small when width between 600 and 601 */
@media (width <=601px) {
.w3-hide-small{display:none!important}
/* fixes edge case in w3-hide-small when width between 600 and 601 */
@media screen and (width <=601px) {
.hide-large {display: none !important;}
.hide-medium {display:none !important}
.hide-small {display:none !important}
}
@media screen and (width <= 440px) {
.hide-large {display: none !important;}
.hide-medium {display:none !important}
.hide-small {display:none !important}
.hide-tiny { display: none !important;}
}