ric/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-11-24 07:14:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

naming convention and wrap all styles inside .table-shadow-box to avoid unexpected style in the future

Browse source
This commit is contained in:
LouisLam 2021-08-24 02:02:38 +08:00
parent 3f12afce28
commit 36ace3e56c
3 changed files with 32 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
src/assets/app.scss
View file

@ -81,33 +81,34 @@ h2 {
} }
@media (max-width: 550px) { @media (max-width: 550px) {
tbody .shadow-box {
background-color: white;
}
div.tableShadowbox { .table-shadow-box {
padding: 10px !important; padding: 10px !important;
thead {
display: none;
}
tbody {
.shadow-box {
background-color: white;
}
}
tr {
margin-top: 0 !important;
padding: 10px !important;
display: block;
margin-bottom: 10px;
td {
border-bottom: 1px solid $dark-font-color;
display: block;
padding: 6px;
}
}
} }
.tableShadowbox tr {
margin-top: 0 !important;
padding: 10px !important;
}
.tableShadowbox thead {
display: none;
}
.tableShadowbox tr {
display: block;
margin-bottom: 10px;
}
.tableShadowbox td {
border-bottom: 1px solid $dark-font-color;
display: block;
padding: 6px;
}
} }
// Dark Theme override here // Dark Theme override here
@ -224,8 +225,12 @@ h2 {
} }
@media (max-width: 550px) { @media (max-width: 550px) {
tbody .shadow-box { .table-shadow-box {
background-color: $dark-bg2; tbody {
.shadow-box {
background-color: $dark-bg2;
}
}
} }
} }
} }

2
src/pages/DashboardHome.vue
View file

@ -38,7 +38,7 @@
</div> </div>
</div> </div>
<div class="shadow-box tableShadowbox" style="overflow-x: scroll"> <div class="shadow-box table-shadow-box" style="overflow-x: scroll">
<table class="table table-borderless table-hover"> <table class="table table-borderless table-hover">
<thead> <thead>
<tr> <tr>

2
src/pages/Details.vue
View file

@ -128,7 +128,7 @@
</div> </div>
</div> </div>
<div class="shadow-box tableShadowbox"> <div class="shadow-box table-shadow-box">
<table class="table table-borderless table-hover"> <table class="table table-borderless table-hover">
<thead> <thead>
<tr> <tr>