mirror of
https://github.com/mwalbeck/nextcloud-breeze-dark.git
synced 2024-09-19 19:17:53 +00:00
201 lines
3.6 KiB
SCSS
201 lines
3.6 KiB
SCSS
/***
|
|
* @copyright Copyright (c) 2017, Magnus Walbeck <mw@mwalbeck.org>
|
|
*
|
|
* @license GNU AGPL version 3
|
|
***/
|
|
|
|
/* App menu ----------------------------------------------------------------- */
|
|
|
|
#appmenu li {
|
|
|
|
&:hover a + span,
|
|
&:hover span,
|
|
&:focus span,
|
|
a:focus + span,
|
|
a:focus span {
|
|
background-color: var(--color-background-darker);
|
|
}
|
|
|
|
a.active::before {
|
|
border-bottom-color: var(--color-main-background);
|
|
}
|
|
|
|
&:hover a::before {
|
|
border-bottom-color: var(--color-border);
|
|
}
|
|
}
|
|
|
|
/* App Navigation ----------------------------------------------------------- */
|
|
|
|
#app-navigation:not(.vue) {
|
|
|
|
> ul > li > a,
|
|
> li > a,
|
|
> ul > li > ul > li > a {
|
|
opacity: 1;
|
|
|
|
&:hover,
|
|
&:hover + div.app-navigation-entry-utils,
|
|
&:hover + div.app-navigation-entry-edit + div.app-navigation-entry-utils {
|
|
background-color: var(--color-background-hover);
|
|
}
|
|
|
|
&.active:hover {
|
|
background-color: var(--color-primary-element);
|
|
}
|
|
}
|
|
|
|
.collapsible:hover {
|
|
|
|
&::before {
|
|
background-color: unset;
|
|
}
|
|
|
|
> a {
|
|
background-image: none;
|
|
}
|
|
}
|
|
|
|
.active {
|
|
background-color: var(--color-primary-element);
|
|
color: var(--color-text-active);
|
|
font-weight: 600;
|
|
|
|
> a {
|
|
color: var(--color-text-active);
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
input {
|
|
background-color: var(--color-background-darker);
|
|
}
|
|
|
|
select {
|
|
background-color: var(--color-main-background) !important;
|
|
}
|
|
|
|
> ul > li > .app-navigation-entry-bullet + a:hover,
|
|
> ul > li > ul > li > .app-navigation-entry-bullet + a:hover {
|
|
background: var(--color-background-hover) !important;
|
|
}
|
|
}
|
|
|
|
.app-navigation-entry-menu {
|
|
|
|
li > button {
|
|
color: var(--color-main-text);
|
|
border-radius: unset;
|
|
|
|
&:hover {
|
|
background-color: var(--color-background-hover);
|
|
}
|
|
}
|
|
}
|
|
|
|
/* App Sidebar -------------------------------------------------------------- */
|
|
|
|
#app-sidebar {
|
|
|
|
#app-details-view .close,
|
|
.close {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.thumbnail {
|
|
color: var(--color-main-text);
|
|
}
|
|
|
|
#collection-list input:not([type="range"]) {
|
|
background-color: var(--color-main-background);
|
|
}
|
|
}
|
|
|
|
.tabHeaders .tabHeader {
|
|
|
|
&.selected, &:hover, &:focus {
|
|
border-bottom: 1px solid var(--color-border-active);
|
|
|
|
a {
|
|
color: var(--color-text-active);
|
|
}
|
|
}
|
|
}
|
|
|
|
.shareTabView {
|
|
|
|
.error {
|
|
color: var(--color-error);
|
|
border-color: var(--color-error);
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
.versionsTabView {
|
|
|
|
li {
|
|
border-color: var(--color-border);
|
|
|
|
&:hover {
|
|
background: var(--color-background-hover);
|
|
}
|
|
}
|
|
|
|
a {
|
|
opacity: 1 !important;
|
|
color: var(--color-text-inactive);
|
|
}
|
|
}
|
|
|
|
.ui-widget-content {
|
|
a {
|
|
color: var(--color-main-text);
|
|
}
|
|
|
|
.ui-state-focus {
|
|
border-color: var(--color-border-active);
|
|
background: var(--color-background-hover);
|
|
color: var(--color-main-text);
|
|
}
|
|
}
|
|
|
|
/* App Settings ------------------------------------------------------------- */
|
|
|
|
#app-settings-header .settings-button {
|
|
opacity: 1;
|
|
|
|
&:hover {
|
|
background-color: var(--color-background-hover);
|
|
}
|
|
}
|
|
|
|
// Date picker styling fix
|
|
|
|
.mx-datepicker .mx-input-wrapper .mx-input-append {
|
|
background-color: inherit;
|
|
}
|
|
|
|
/* Misc --------------------------------------------------------------------- */
|
|
|
|
.delete,
|
|
input[type="submit"].delete,
|
|
input[type="button"].delete,
|
|
button.delete,
|
|
.button.delete {
|
|
border-color: var(--color-border);
|
|
background-color: var(--color-error);
|
|
color: var(--color-main-text);
|
|
|
|
&:hover,
|
|
&:focus {
|
|
border-color: var(--color-error) !important;
|
|
background-color: var(--color-error);
|
|
color: var(--color-text-active);
|
|
}
|
|
}
|
|
|
|
// Fix share icon in nav not being hidden on hover, because of maunal icon override to prevent black icons
|
|
#app-navigation:not(.vue) .collapsible:hover > a {
|
|
background-image: none !important;
|
|
}
|