style(next): refactor

This commit is contained in:
Adorian Doran 2025-01-09 00:01:02 +02:00
parent 55048e36e7
commit 4ce2fb701f

View File

@ -1563,9 +1563,22 @@ body .calendar-dropdown-widget .calendar-body a:hover {
/* Help */
.help-dialog {
--help-background-color: #fffc;
--help-backdrop-blur: 10px;
--help-card-background: var(--card-background-color);
--help-card-shadow: 2px 2px 2px rgba(0, 0, 0, .10);
--help-card-heading-color: #797979;
--help-kbd-shortcut-color: #3f3f3f;
--help-kbd-shortcut-background: white;
--help-kbd-shortcut-shadow: 1px 1px 2px rgba(0, 0, 0, .3);
--help-code-color: black;
--help-code-background: #d7d5d5;
}
.help-dialog .modal-content {
--modal-background-color: #fffc;
backdrop-filter: blur(10px);
--modal-background-color: var(--help-background-color);
backdrop-filter: blur(var(--help-backdrop-blur));
}
.help-dialog .help-cards {
@ -1578,20 +1591,20 @@ body .calendar-dropdown-widget .calendar-body a:hover {
margin: 0;
width: auto;
border: none;
padding: 16px 8px;
background: unset;
padding: 16px 8px;
break-inside: avoid-column;
}
.help-dialog .card-body {
box-shadow: 2px 2px 2px rgba(0, 0, 0, .10);
box-shadow: var(--help-card-shadow);
border-radius: 6px;
background: var(--card-background-color);
background: var(--help-card-background);
}
.help-dialog .card-body h5,
.help-dialog .card-body h6 {
color: #797979;
color: var(--help-card-heading-color);
font-weight: 600;
}
@ -1604,7 +1617,7 @@ body .calendar-dropdown-widget .calendar-body a:hover {
padding-bottom: .5em;
}
/* Help card item */
.help-dialog .help-cards ul {
list-style-type: none;
padding: 0;
@ -1614,24 +1627,27 @@ body .calendar-dropdown-widget .calendar-body a:hover {
margin-top: .4em;
}
/* Keyboard shortcut */
.help-dialog .help-cards kbd {
box-shadow: 1px 1px 2px rgba(0, 0, 0, .3);
box-shadow: var(--help-kbd-shortcut-shadow);
margin: 0 4px;
border: none;
border-radius: 4px;
padding: 2px 10px;
background: white;
color: #3f3f3f;
background: var(--help-kbd-shortcut-background);
color: var(--help-kbd-shortcut-color);
font-weight: 500;
letter-spacing: .5pt;
}
.help-dialog .help-cards code {
border-radius: 4px;
background: #d7d5d5;
padding: 0 8px;
}
.help-dialog .help-cards kbd:first-child {
margin-left: 0;
}
/* Inline code - used for Markdown samples */
.help-dialog .help-cards code {
border-radius: 4px;
background: var(--help-code-background);
padding: 0 8px;
color: var(--help-code-color);
}