Improved tab contrast

This commit is contained in:
Joel Collins 2020-07-05 16:55:10 +01:00
parent 4cb3ae03ed
commit 646645cc1d
3 changed files with 24 additions and 8 deletions

View file

@ -59,6 +59,12 @@
text-rendering: optimizeLegibility;
}
//
// Decorations
//
@small-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
@big-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
//
// Container
//
@ -148,6 +154,7 @@
// Paper
//
@paper-border-radius: 4px;
@button-border-radius: 3px;
/* ========================================================================
@ -187,9 +194,8 @@
.uk-card {
border-radius: @paper-border-radius;
border: 1px solid rgba(180, 180, 180, 0.25);
box-shadow: none;
-webkit-box-shabox-shadow: none;
//border: 1px solid rgba(180, 180, 180, 0.25);
box-shadow: @small-shadow;
}
.uk-card-media-top img {
@ -228,7 +234,7 @@
*/
.uk-modal-dialog {
border-radius: @paper-border-radius;
box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
box-shadow: @big-shadow;
transition: 0.3s ease !important;
}
@ -245,7 +251,7 @@
*/
.uk-notification-message {
border-radius: @paper-border-radius;
box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
box-shadow: @big-shadow;
}
.uk-notification-message-danger {
@ -287,7 +293,7 @@ a:hover {
* Buttons
*/
.uk-button {
border-radius: 2px;
border-radius: @button-border-radius;
padding: 0 8px;
}

View file

@ -93,7 +93,9 @@ export default {
@import "../../assets/less/theme.less";
.tabicon-active {
color: @global-primary-background !important;
color: #fff !important;
background-color: @global-primary-background !important;
box-shadow: @small-shadow;
}
.hook-inverse() {

View file

@ -153,7 +153,10 @@ export default {
};
</script>
<style lang="less">
<style lang="less" scoped>
// Custom UIkit CSS modifications
@import "../../assets/less/theme.less";
.settings-pane {
border-width: 0 1px 0 0;
border-style: solid;
@ -170,4 +173,9 @@ export default {
border-style: solid;
border-color: rgba(180, 180, 180, 0.25);
}
.settings-nav li > a {
padding-left: 6px !important;
border-radius: @button-border-radius;
}
</style>