mirror of
https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git
synced 2024-11-16 11:00:08 +00:00
96013bb126
--background-color-dp-XX is now fully deprecated in favor of a simpler 4 color surface system. It can be accessed through the --color-surface-X CSS var.
86 lines
1.6 KiB
Plaintext
86 lines
1.6 KiB
Plaintext
/*
|
|
* Citizen - Graph
|
|
* https://starcitizen.tools
|
|
*/
|
|
|
|
@import '../../../resources/variables.less';
|
|
|
|
.skin-citizen {
|
|
.vega {
|
|
background: var( --color-surface-0 );
|
|
}
|
|
|
|
/* responsive layout */
|
|
.mw-graph {
|
|
overflow: auto;
|
|
min-width: auto !important;
|
|
max-width: 100%;
|
|
}
|
|
|
|
/* dark mode */
|
|
&-dark {
|
|
.mw-graph canvas {
|
|
filter: invert( 1 ) hue-rotate( 180deg );
|
|
}
|
|
}
|
|
}
|
|
|
|
.client-js {
|
|
.mw-graph-interactable {
|
|
&:hover {
|
|
.mw-graph-layover {
|
|
background-color: var( --background-color-overlay--lighter );
|
|
}
|
|
|
|
.mw-graph-switch {
|
|
&.mw-graph-loading {
|
|
background-color: var( --color-surface-0 );
|
|
}
|
|
|
|
&:hover {
|
|
background-color: var( --color-surface-0 );
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.mw-graph-hover-title {
|
|
background-color: var( --color-surface-0 );
|
|
}
|
|
|
|
/* common button style */
|
|
.mw-graph-switch {
|
|
border-color: var( --border-color-base );
|
|
background-color: var( --background-color-overlay--lighter );
|
|
color: var( --color-base );
|
|
|
|
&:hover {
|
|
border-color: var( --color-primary );
|
|
background-color: var( --color-surface-0 );
|
|
color: var( --color-primary );
|
|
}
|
|
|
|
&:active {
|
|
border-color: var( --color-primary--active );
|
|
background-color: var( --color-surface-0 );
|
|
color: var( --color-primary );
|
|
}
|
|
|
|
&:focus {
|
|
border-color: var( --color-primary );
|
|
box-shadow: inset 0 0 0 1px var( --color-surface-0 );
|
|
}
|
|
|
|
/* Loading button style */
|
|
&.mw-graph-loading {
|
|
border-color: var( --color-primary--active );
|
|
background-color: var( --color-surface-0 );
|
|
color: var( --color-base--subtle );
|
|
|
|
&:hover {
|
|
border-color: var( --color-primary );
|
|
}
|
|
}
|
|
}
|
|
}
|