btclock/webui
3
0
Fork 2
Code Issues 1 Pull requests 11 Projects Releases 45 Packages Wiki Activity Actions

Improvements for xs screens
All checks were successful
/ check-changes (push) Successful in 5s
Details
/ build (push) Successful in 3m57s
Details

Browse source
This commit is contained in:
Djuri 2024-12-12 23:04:13 +01:00
parent 68c247f3cc
commit 653a39d0a3
9 changed files with 146 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/lib/style/app.scss
View file

@ -1,6 +1,4 @@
@import '../node_modules/bootstrap/scss/functions';
@import '../node_modules/bootstrap/scss/variables';
@import '../node_modules/bootstrap/scss/variables-dark';
//@import "@fontsource/antonio/latin-400.css";
@import '@fontsource/ubuntu/latin-400.css';
@ -14,6 +12,8 @@ $font-family-base: 'Ubuntu';
$font-size-base: 0.9rem;
$input-font-size-sm: $font-size-base * 0.875;
@import '../node_modules/bootstrap/scss/variables';
@import '../node_modules/bootstrap/scss/variables-dark';
// $border-radius: .675rem;
@import '../node_modules/bootstrap/scss/mixins';
@ -43,6 +43,40 @@ $input-font-size-sm: $font-size-base * 0.875;
@import '../node_modules/bootstrap/scss/helpers';
@import '../node_modules/bootstrap/scss/utilities/api';
/* Default state (xs) - sticky */
.sticky-xs-top {
position: sticky;
top: 0;
z-index: 1020;
}
@media (max-width: 576px) {
main {
margin-top: 25px;
}
}
/* Remove sticky behavior for larger screens */
@media (min-width: 576px) {
.sticky-xs-top {
position: relative;
}
}
@include color-mode(dark) {
.navbar {
--bs-navbar-color: $light;
background-color: $dark;
}
}
@include color-mode(light) {
.navbar {
--bs-navbar-color: $dark;
background-color: $light;
}
}
nav {
margin-bottom: 15px;
}