|
|
| (6 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /* All CSS here will be loaded for users of the Citizen skin */ | | /* All CSS here will be loaded for users of the Citizen skin */ |
| :root { | | :root { |
| /* Pink is the new black */
| |
| --color-primary-oklch__h: 45; | | --color-primary-oklch__h: 45; |
| } | | } |
| Line 7: |
Line 6: |
| :root.citizen-v4 { | | :root.citizen-v4 { |
| --color-surface-0: light-dark( #f8f0ec, #0d0806 ); | | --color-surface-0: light-dark( #f8f0ec, #0d0806 ); |
| }
| |
|
| |
| /* Base container for custom sidebar icons */
| |
| #n-All-rules a::before,
| |
| #n-Attributes a::before,
| |
| #n-Charts a::before {
| |
| content: "";
| |
| display: inline-block;
| |
| width: 1.25rem;
| |
| height: 1.25rem;
| |
| margin-right: 0.75rem;
| |
| background-color: currentColor;
| |
| -webkit-mask-repeat: no-repeat;
| |
| mask-repeat: no-repeat;
| |
| -webkit-mask-position: center;
| |
| mask-position: center;
| |
| -webkit-mask-size: contain;
| |
| mask-size: contain;
| |
| flex-shrink: 0;
| |
| }
| |
|
| |
| /* All rules icon */
| |
| #n-All-rules a::before {
| |
| -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z'/%3E%3C/svg%3E");
| |
| mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z'/%3E%3C/svg%3E");
| |
| }
| |
|
| |
| /* Attributes icon */
| |
| #n-Attributes a::before {
| |
| -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='21' x2='4' y2='14'/%3E%3Cline x1='4' y1='10' x2='4' y2='3'/%3E%3Cline x1='12' y1='21' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12' y2='3'/%3E%3Cline x1='20' y1='21' x2='20' y2='16'/%3E%3Cline x1='20' y1='12' x2='20' y2='3'/%3E%3Cline x1='1' y1='14' x2='7' y2='14'/%3E%3Cline x1='9' y1='8' x2='15' y2='8'/%3E%3Cline x1='17' y1='16' x2='23' y2='16'/%3E%3C/svg%3E");
| |
| mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='21' x2='4' y2='14'/%3E%3Cline x1='4' y1='10' x2='4' y2='3'/%3E%3Cline x1='12' y1='21' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12' y2='3'/%3E%3Cline x1='20' y1='21' x2='20' y2='16'/%3E%3Cline x1='20' y1='12' x2='20' y2='3'/%3E%3Cline x1='1' y1='14' x2='7' y2='14'/%3E%3Cline x1='9' y1='8' x2='15' y2='8'/%3E%3Cline x1='17' y1='16' x2='23' y2='16'/%3E%3C/svg%3E");
| |
| }
| |
|
| |
| /* Charts icon */
| |
| #n-Charts a::before {
| |
| -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E");
| |
| mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E");
| |
| } | | } |
/* All CSS here will be loaded for users of the Citizen skin */
:root {
--color-primary-oklch__h: 45;
}
:root.citizen-v4 {
--color-surface-0: light-dark( #f8f0ec, #0d0806 );
}