Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-01-02 18:39:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use IFM colors for custom components (#1249)

Browse Source
This commit is contained in:
Evan Simkowitz 2024-11-08 12:54:00 -08:00 committed by GitHub
parent 8685ca9069
commit bac9649140
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 9 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/src/components/kbd.css
View File

@ -19,9 +19,10 @@
}
kbd {
background-color: #f4f4f4;
background-color: var(--ifm-color-primary-contrast-background);
border-radius: 4px;
border: 1px solid #ccc;
border: 1px solid var(--ifm-color-secondary-darker);
color: var(--ifm-color-primary-contrast-foreground);
padding: 2px 6px;
font-size: 0.8em;
font-family: "JetBrains Mono", monospace;
@ -40,10 +41,3 @@ kbd {
font-size: 0.8em;
line-height: 24px;
}
/* Docusaurus Dark Mode */
html[data-theme="dark"] kbd {
background-color: #333; /* Dark background */
color: #fff; /* Light text */
border: 1px solid #666;
}

31
docs/src/components/platformcontext.css
View File

@ -1,16 +1,16 @@
.pill-toggle {
display: inline-flex;
border: 1px solid #ddd;
border: 1px solid var(--ifm-scrollbar-thumb-background-color);
border-radius: 20px;
overflow: hidden;
background-color: #f1f1f5;
background-color: var(--ifm-scrollbar-track-background-color);
}
.pill-option {
padding: 8px 16px;
font-size: 0.9em;
font-weight: 500;
color: #555;
color: var(--ifm-color-secondary-contrast-foreground);
background-color: transparent;
border: none;
cursor: pointer;
@ -21,30 +21,11 @@
}
.pill-option.active {
background-color: rgb(88, 193, 66);
color: #fff;
background-color: var(--ifm-color-primary);
color: var(--ifm-color-secondary-lightest);
font-weight: bold;
}
.pill-option:not(.active):hover {
background-color: #e0e0e0;
}
/* Docusaurus Dark Mode */
html[data-theme="dark"] .pill-toggle {
border: 1px solid #555;
background-color: #333;
}
html[data-theme="dark"] .pill-option {
color: #ccc;
}
html[data-theme="dark"] .pill-option.active {
background-color: rgb(88, 193, 66); /* Darker blue for active state */
color: #fff;
}
html[data-theme="dark"] .pill-option:not(.active):hover {
background-color: #444; /* Darker hover effect */
background-color: var(--ifm-scrollbar-thumb-background-color);
}