Min-height 44px (touch target), 'Manage ▸' wrapped in a yellow-bordered chip with subtle yellow background, whole bar hovers to a brighter yellow tint. Reads as a tap target now, not just text. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -176,13 +176,17 @@
|
|||||||
background: var(--color-surface-2);
|
background: var(--color-surface-2);
|
||||||
}
|
}
|
||||||
.library__manage {
|
.library__manage {
|
||||||
background: rgba(0,0,0,0.35) !important;
|
background: rgba(0,0,0,0.45) !important;
|
||||||
border-top: 1px solid var(--color-border);
|
border-top: 1px solid var(--color-border);
|
||||||
border-radius: 0 !important;
|
border-radius: 0 !important;
|
||||||
padding: var(--space-3) var(--space-4) !important;
|
padding: var(--space-3) var(--space-4) !important;
|
||||||
transition: background var(--duration-fast) var(--ease-out);
|
transition: background var(--duration-fast) var(--ease-out);
|
||||||
|
min-height: 44px;
|
||||||
|
|
||||||
&:hover { background: rgba(0,0,0,0.5) !important; }
|
&:hover {
|
||||||
|
background: color-mix(in srgb, var(--brand-yellow) 18%, rgba(0,0,0,0.6)) !important;
|
||||||
|
}
|
||||||
|
&:hover .library__manage-action { color: var(--brand-yellow) !important; }
|
||||||
}
|
}
|
||||||
.library__manage-summary {
|
.library__manage-summary {
|
||||||
color: var(--color-text-muted);
|
color: var(--color-text-muted);
|
||||||
@@ -192,8 +196,14 @@
|
|||||||
}
|
}
|
||||||
.library__manage-action {
|
.library__manage-action {
|
||||||
color: var(--brand-yellow) !important;
|
color: var(--brand-yellow) !important;
|
||||||
font-weight: 700;
|
font-weight: 800;
|
||||||
font-size: var(--text-sm);
|
font-size: var(--text-sm);
|
||||||
|
letter-spacing: 0.04em;
|
||||||
|
padding: 4px 10px;
|
||||||
|
border: 1px solid color-mix(in srgb, var(--brand-yellow) 50%, transparent);
|
||||||
|
border-radius: var(--radius-sm);
|
||||||
|
background: color-mix(in srgb, var(--brand-yellow) 10%, transparent);
|
||||||
|
transition: background var(--duration-fast);
|
||||||
}
|
}
|
||||||
.library__manage-lock { color: var(--color-text-muted); }
|
.library__manage-lock { color: var(--color-text-muted); }
|
||||||
|
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -17,9 +17,9 @@
|
|||||||
<meta name="mobile-web-app-capable" content="yes" />
|
<meta name="mobile-web-app-capable" content="yes" />
|
||||||
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
||||||
<meta name="apple-mobile-web-app-title" content="WeVisto" />
|
<meta name="apple-mobile-web-app-title" content="WeVisto" />
|
||||||
<script type="module" crossorigin src="/build/assets/index-Cj9w1SIV.js"></script>
|
<script type="module" crossorigin src="/build/assets/index-CdLYHZeF.js"></script>
|
||||||
<link rel="modulepreload" crossorigin href="/build/assets/_plugin-vue_export-helper-BNDVmFr7.js">
|
<link rel="modulepreload" crossorigin href="/build/assets/_plugin-vue_export-helper-BNDVmFr7.js">
|
||||||
<link rel="stylesheet" crossorigin href="/build/assets/index-CdzA-i88.css">
|
<link rel="stylesheet" crossorigin href="/build/assets/index-CUd6onTU.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user