Closed Dr4gon closed 1 year ago
@echo75 You could transform the usage of #dddddd into a global variable to have a color theme to your whole app. Then when u're in the mood for a change, you simply flip the switch to another color #ffffff with one code line.
Using global css variables
WatchList.vue
.table > tfoot > tr > td { padding: 8px; line-height: 1.42857143; vertical-align: top; border-top: 1px solid #dddddd; /* That's one */ } .table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #dddddd; /* That's two */ } .table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > th, .table > caption + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > td, .table > thead:first-child > tr:first-child > td { border-top: 0; } .table > tbody + tbody { border-top: 2px solid #dddddd; /* That's three */ } .table .table { background-color: #ffffff; } .table-condensed > thead > tr > th, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > td { padding: 5px; } .table-bordered { border: 1px solid #dddddd; /* That's four */ } .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td { border: 1px solid #dddddd; /* That's five */ }
Used a variable :-)
@echo75 You could transform the usage of #dddddd into a global variable to have a color theme to your whole app. Then when u're in the mood for a change, you simply flip the switch to another color #ffffff with one code line.
Using global css variables
WatchList.vue