patrick/OpenDTU-old
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

webapp: device manager: optimize cards for tab nav

Browse Source 
the top border of the card was breaking the design of the tabs, where
the active tab would be "visually connected" to the content. also, the
rounded border at the top did not blend in with the navbar's bottom
border.
This commit is contained in:
Bernhard Kirchen 2024-10-27 20:30:51 +01:00
parent 24330b723c
commit 70ae0015fa
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
webapp/src/scss/styles.scss
View File

@ -57,3 +57,10 @@ div.card.card-table table .value {
text-align: right;
padding-right: 0;
}
// blend cards into tabbed navigation (device admin view)
div.card-tabbed {
border-top: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
}

6
webapp/src/views/DeviceAdminView.vue
View File

@ -51,7 +51,7 @@
aria-labelledby="nav-pin-tab"
tabindex="0"
>
<div class="card">
<div class="card card-tabbed">
<div class="card-body">
<div class="row mb-3">
<label for="inputPinProfile" class="col-sm-2 col-form-label">{{
@ -112,7 +112,7 @@
aria-labelledby="nav-display-tab"
tabindex="0"
>
<div class="card">
<div class="card card-tabbed">
<div class="card-body">
<InputElement
:label="$t('deviceadmin.PowerSafe')"
@ -213,7 +213,7 @@
aria-labelledby="nav-leds-tab"
tabindex="0"
>
<div class="card">
<div class="card card-tabbed">
<div class="card-body">
<InputElement
:label="$t('deviceadmin.EqualBrightness')"