1
0
Fork 0
dokuwiki-templates-extra/templates/55/MindTheDark/css/_plugin_note.less
Daniel Baumann 19df4a7159
Adding MindTheDark version 2025-03-17 (c5e286f).
Signed-off-by: Daniel Baumann <daniel@debian.org>
2025-04-13 13:21:54 +02:00

98 lines
2.7 KiB
Text

/**
* This file provides styles for the note plugin if the option pluginNote is enabled
*/
&:root[pluginnote="1"] {
/* Base colors */
@classic_light: __note_plugin_classic_color__;
@important_light: __note_plugin_important_color__;
@warning_light: __note_plugin_warning_color__;
@tip_light: __note_plugin_tip_color__;
@opacity_dark: 0.8;
/* general styles */
.noteclassic, .noteimportant, .notewarning, .notetip {
margin: 1em auto;
width: auto;
max-width: 100%;
min-height: 20px;
clear: none;
text-align: justify;
vertical-align: middle;
border-collapse: collapse;
padding: 15px 20px 15px 50px;
background-position: 15px 50%;
background-repeat: no-repeat;
border-radius: 2px;
color: black;
font-size: 100%;
overflow: auto;
font-family: Consolas,"Andale Mono WT","Andale Mono","Bitstream Vera Sans Mono","Nimbus Mono L",Monaco,"Courier New",monospace;
border-left: 13px solid;
border-right: 1px solid;
border-top: 1px solid;
border-bottom: 1px solid;
}
.noteclassic {
border-color: darken(@classic_light, 20%);
background-color: @classic_light;
background-image: url(images/plugin_note/note.svg);
}
.noteimportant {
border-color: darken(@important_light, 40%);
background-color: @important_light;
background-image: url(images/plugin_note/important.svg);
}
.notewarning {
border-color: darken(@warning_light, 20%);
background-color: @warning_light;
background-image: url(images/plugin_note/warning.svg);
}
.notetip {
border-color: darken(@tip_light, 20%);
background-color: @tip_light;
background-image: url(images/plugin_note/tip.svg);
}
/**************************************************/
/* DARK MODE */
/* for dark mode just reduce the opacity a little */
/**************************************************/
.darkModeNotePlugin{
.noteclassic {
opacity: @opacity_dark;
}
.noteimportant {
opacity: @opacity_dark;
}
.notewarning {
opacity: @opacity_dark;
}
.notetip {
opacity: @opacity_dark;
}
}
/* dark theme and automatic is switched off*/
&:root[theme="dark"] {
.darkModeNotePlugin();
}
/* User prefers dark theme and automatic is switched on*/
@media (prefers-color-scheme: dark){
&:root[theme="auto"] {
.darkModeNotePlugin();
}
}
}