nextcloud-breeze-dark/css/server/_apps.scss

/***
 * @copyright Copyright (c) 2017, Magnus Walbeck <mw@mwalbeck.org>
 *
 * @license GNU AGPL version 3 or any later version, see COPYING file for more.
 */

/* 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-sidebar-tabs__tab a {

		&:not(.active):hover,
		&:not(.active):focus {
			box-shadow: inset 0 -1px 0 var(--color-background-dark) !important;
			border-bottom-color: var(--color-background-dark) !important;
		}

		&.active,
		&.active:focus {
			border-bottom-color: var(--color-primary-element) !important;
			box-shadow: inset 0 -1px 0 var(--color-primary-element) !important;
		}
	}

	.versionsTabView {

		li {
			border-color: var(--color-border);

			&:hover {
				background: var(--color-background-hover);
			}
		}

		a {
			opacity: 1 !important;
			color: var(--color-text-inactive);
		}
	}

	.shareTabView .error {
		color: var(--color-error);
		border-color: var(--color-error);
		box-shadow: none;
	}

	#tab-comments input[type="submit"].icon-confirm {
		border: none !important;
		opacity: 0.7;
		background-color: transparent !important;

		&:hover {
			opacity: 1;
		}
	}
}

/* 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 !important;
}

/* 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;
}

// CodeMirror

.CodeMirror {
	background-color: var(--color-main-background) !important;
	color: var(--color-main-text) !important;

	.cm-formatting {
		opacity: 0.5;
	}

	.cm-link {
		color: var(--color-text-link) !important;
	}

	.cm-s-easymde .cm-url,
	.cm-s-easymde .cm-string {
		color: var(--color-text-inactive) !important;
	}

	.CodeMirror-selected {
		background-color: var(--color-main-background) !important;
	}

	.CodeMirror-selectedtext {
		background-color: var(--color-text-selection) !important;
		color: var(--color-main-text);
	}

	.CodeMirror-cursor {
		border-left-color: var(--color-main-text);
	}
}

// CodeMirror Markdown preview
// For Deck and Notes

#description-preview,
.note-preview {

	pre {
		background-color: var(--color-background-darker) !important;
		border: 1px solid var(--color-border);
		border-radius: 3px;
		padding: 16px !important;
	}

	code {
		background-color: var(--color-background-darker) !important;
	}

	blockquote {
		font-style: italic;
		border-left: 4px solid var(--color-border);
		padding-left: 2ex;
		color: var(--color-main-text);
	}

	
}