Test custom.css
This commit is contained in:
+135
-64
@@ -209,8 +209,33 @@ div[data-name="Daten und Backends"] {
|
||||
div[data-name="KalliLab"],
|
||||
div[data-name="Admin & Remote"]
|
||||
) {
|
||||
--section-line: rgba(255,255,255,0.10);
|
||||
background: rgba(10, 14, 24, 0.48) !important;
|
||||
--section-line: rgba(255,255,255,0.08);
|
||||
background: rgba(8, 12, 22, 0.35) !important;
|
||||
border-color: rgba(255,255,255,0.05) !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
|
||||
padding: 12px 14px 14px !important;
|
||||
}
|
||||
|
||||
:is(
|
||||
div[data-name="Dokumentation"],
|
||||
div[data-name="KalliLab"],
|
||||
div[data-name="Admin & Remote"]
|
||||
) h2 {
|
||||
font-size: 0.65rem !important;
|
||||
letter-spacing: 2px !important;
|
||||
color: rgba(255,255,255,0.28) !important;
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
/* Gap zwischen Bookmark-Zeilen */
|
||||
:is(
|
||||
div[data-name="Dokumentation"],
|
||||
div[data-name="KalliLab"],
|
||||
div[data-name="Admin & Remote"]
|
||||
) ul {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
gap: 5px !important;
|
||||
}
|
||||
|
||||
|
||||
@@ -437,86 +462,132 @@ div[data-name="Daten und Backends"] :is(.service-card, [class*="service_"]) :is(
|
||||
|
||||
|
||||
/* ─────────────────────────────────────────────
|
||||
14. BOOKMARKS — deutlich lesbarer
|
||||
14. BOOKMARKS — schlank, kompakt, wie Farpoint
|
||||
Slim single-line rows, kein aufgeblähter Card-Look
|
||||
───────────────────────────────────────────── */
|
||||
:is(.bookmark, li.bookmark, [class*="bookmark_"]) {
|
||||
min-height: 58px !important;
|
||||
border-radius: 14px !important;
|
||||
background: rgba(18, 24, 42, 0.72) !important;
|
||||
border: 1px solid rgba(255,255,255,0.08) !important;
|
||||
box-shadow: 0 3px 12px rgba(0,0,0,0.30) !important;
|
||||
will-change: transform;
|
||||
transition: var(--transition) !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
/* Bookmark Link-Wrapper */
|
||||
:is(.bookmark, li.bookmark, [class*="bookmark_"]) > a,
|
||||
li.bookmark a {
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
gap: 12px !important;
|
||||
padding: 12px 16px !important;
|
||||
background: transparent !important;
|
||||
text-decoration: none !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
box-sizing: border-box !important;
|
||||
border-radius: inherit !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
li.bookmark {
|
||||
list-style: none !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* Icon-Bereich */
|
||||
:is(.bookmark, li.bookmark) .bookmark-icon,
|
||||
li.bookmark .bookmark-icon {
|
||||
background: rgba(255,255,255,0.06) !important;
|
||||
border-right: 1px solid rgba(255,255,255,0.06) !important;
|
||||
border-radius: 0 !important;
|
||||
padding: 0 12px 0 0 !important;
|
||||
margin-right: 4px !important;
|
||||
li.bookmark a {
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
gap: 10px !important;
|
||||
height: 42px !important;
|
||||
padding: 0 14px !important;
|
||||
border-radius: 10px !important;
|
||||
background: rgba(255,255,255,0.04) !important;
|
||||
border: 1px solid rgba(255,255,255,0.07) !important;
|
||||
text-decoration: none !important;
|
||||
overflow: hidden !important;
|
||||
transition: var(--transition) !important;
|
||||
box-shadow: none !important;
|
||||
margin-bottom: 0 !important;
|
||||
/* Linker Akzent-Balken */
|
||||
border-left: 3px solid rgba(var(--sig-control), 0.30) !important;
|
||||
}
|
||||
|
||||
/* Bookmark-Name — jetzt hell und lesbar */
|
||||
.bookmark-name,
|
||||
:is(.bookmark, li.bookmark) h3,
|
||||
[class*="bookmark_"] h3 {
|
||||
font-size: 0.90rem !important;
|
||||
li.bookmark a .bookmark-icon {
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
width: 20px !important;
|
||||
min-width: 20px !important;
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
li.bookmark a .bookmark-icon img,
|
||||
li.bookmark a .bookmark-icon svg {
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
opacity: 0.75 !important;
|
||||
flex-shrink: 0 !important;
|
||||
}
|
||||
|
||||
li.bookmark a .bookmark-text {
|
||||
display: flex !important;
|
||||
flex-direction: row !important;
|
||||
align-items: center !important;
|
||||
gap: 8px !important;
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
min-width: 0 !important;
|
||||
flex: 1 !important;
|
||||
}
|
||||
|
||||
/* Name */
|
||||
li.bookmark a .bookmark-name {
|
||||
font-size: 0.84rem !important;
|
||||
font-weight: 600 !important;
|
||||
color: rgba(255,255,255,0.82) !important;
|
||||
margin-bottom: 2px !important;
|
||||
letter-spacing: 0.05px !important;
|
||||
color: rgba(220, 235, 255, 0.78) !important;
|
||||
white-space: nowrap !important;
|
||||
letter-spacing: 0px !important;
|
||||
flex-shrink: 0 !important;
|
||||
}
|
||||
|
||||
/* Trennpunkt zwischen Name und Beschreibung */
|
||||
li.bookmark a .bookmark-text::after {
|
||||
content: "·" !important;
|
||||
color: rgba(255,255,255,0.18) !important;
|
||||
font-size: 0.80rem !important;
|
||||
flex-shrink: 0 !important;
|
||||
}
|
||||
|
||||
/* Beschreibung */
|
||||
.bookmark-description,
|
||||
:is(.bookmark, li.bookmark) p,
|
||||
[class*="bookmark_"] p {
|
||||
li.bookmark a .bookmark-description {
|
||||
font-size: 0.76rem !important;
|
||||
color: rgba(180,200,220,0.55) !important;
|
||||
margin: 0 !important;
|
||||
color: rgba(160, 185, 210, 0.45) !important;
|
||||
white-space: nowrap !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
min-width: 0 !important;
|
||||
}
|
||||
|
||||
/* Icons */
|
||||
:is(.bookmark, li.bookmark, [class*="bookmark_"]) :is(img, svg) {
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
flex-shrink: 0 !important;
|
||||
opacity: 0.88 !important;
|
||||
}
|
||||
|
||||
:is(.bookmark, li.bookmark, [class*="bookmark_"]):hover,
|
||||
/* Hover */
|
||||
li.bookmark a:hover {
|
||||
transform: translateY(-2px) !important;
|
||||
background: rgba(24, 32, 56, 0.85) !important;
|
||||
border-color: rgba(255,255,255,0.12) !important;
|
||||
box-shadow: 0 6px 20px rgba(0,0,0,0.40) !important;
|
||||
background: rgba(var(--sig-control), 0.07) !important;
|
||||
border-color: rgba(255,255,255,0.10) !important;
|
||||
border-left-color: rgba(var(--sig-control), 0.55) !important;
|
||||
}
|
||||
|
||||
/* Beim Hover Name nicht verdunkeln (war ein Bug vorher) */
|
||||
li.bookmark a:hover .bookmark-name {
|
||||
color: rgba(255,255,255,0.92) !important;
|
||||
color: rgba(255,255,255,0.95) !important;
|
||||
}
|
||||
|
||||
li.bookmark a:hover .bookmark-icon :is(img, svg) {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
/* Sektion-spezifische Akzentfarben für Bookmark-Gruppen */
|
||||
div[data-name="Dokumentation"] li.bookmark a {
|
||||
border-left-color: rgba(var(--sig-infra), 0.35) !important;
|
||||
}
|
||||
div[data-name="Dokumentation"] li.bookmark a:hover {
|
||||
background: rgba(var(--sig-infra), 0.06) !important;
|
||||
border-left-color: rgba(var(--sig-infra), 0.60) !important;
|
||||
}
|
||||
|
||||
div[data-name="KalliLab"] li.bookmark a {
|
||||
border-left-color: rgba(var(--sig-monitor), 0.35) !important;
|
||||
}
|
||||
div[data-name="KalliLab"] li.bookmark a:hover {
|
||||
background: rgba(var(--sig-monitor), 0.06) !important;
|
||||
border-left-color: rgba(var(--sig-monitor), 0.60) !important;
|
||||
}
|
||||
|
||||
div[data-name="Admin & Remote"] li.bookmark a {
|
||||
border-left-color: rgba(var(--sig-security), 0.35) !important;
|
||||
}
|
||||
div[data-name="Admin & Remote"] li.bookmark a:hover {
|
||||
background: rgba(var(--sig-security), 0.06) !important;
|
||||
border-left-color: rgba(var(--sig-security), 0.60) !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user