darker colours and glassmorph stuff
quantified-self-dark-glass by Hunter-171
Details
AuthorHunter-171
LicenseNo License
Categoryhttps://quantified-self.io/dashboard
Created
Updated
Size2.3 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name quantified-self-dark-glass
@version 20231031.22.13
@namespace userstyles.world/user/Hunter-171
@description darker colours and glassmorph stuff
@author Hunter-171
@license No License
==/UserStyle== */
/* ==UserStyle==
@name Quantified Self Dark Glass
@namespace quantified-self.io
@version 1.0.0
==/UserStyle== */
@-moz-document domain("quantified-self.io") {
:root {
--main-bg-color: #151515;
--main-interaction-color: #191919;
--main-button-color: rgb(70, 193, 255);
}
.dark-theme.mat-app-background,
.dark-theme .mat-app-background {
background-color: var(--main-bg-color);
}
.dark-theme section.component-container {
background-color: var(--main-bg-color);
}
.dark-theme .mat-card {
background-color: var(--main-bg-color);
}
.dark-theme .mat-table {
background-color: var(--main-bg-color);
}
.dark-theme .mat-paginator {
background-color: var(--main-bg-color);
}
.dark-theme .mat-expansion-panel {
margin-top: 10px;
background-color: var(--main-interaction-color);
}
.dark-theme .mat-stepper-horizontal, .dark-theme .mat-stepper-vertical {
background-color: var(--main-interaction-color);
}
/* button */
.dark-theme .mat-button-toggle-appearance-standard {
background-color: var(--main-interaction-color);
}
/* upload button */
.dark-theme .mat-fab.mat-accent, .dark-theme .mat-flat-button.mat-accent, .dark-theme .mat-mini-fab.mat-accent, .dark-theme .mat-raised-button.mat-accent {
background-color: var(--main-button-color);
visibility: hidden;
}
.mat-slide-toggle.mat-accent {
visibility: hidden;
}
/* activity */
tr.mat-row[_ngcontent-lts-c257]:hover td[_ngcontent-lts-c257]:not(.mat-table-sticky) {
background-color: var(--main-interaction-color);
}
/* side bar */
.dark-theme .mat-drawer-backdrop.mat-drawer-shown {
background-color: rgba(0, 0, 0, 0.4);
backdrop-filter: blur(5px);
}
.mat-drawer-inner-container {
overflow: auto;
scrollbar-width: none;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.4);
}
/* side bar background */
.dark-theme .mat-drawer,
.dark-theme .mat-drawer.mat-drawer-push {
background-color: rgba(30, 30, 30, 0.6);
backdrop-filter: blur(15px);
scrollbar-width: thin;
;
}
}