forked from
me.webbeef.org/browser.html
Rewild Your Web
1/* SPDX-License-Identifier: AGPL-3.0-or-later */
2
3/* Shared menu styles used by webview-menu, context-menu, system-menu and select-control */
4
5menu {
6 background: var(--bg-menu);
7 border: 1px solid var(--color-border);
8 border-radius: var(--radius-sm);
9 box-shadow: 0 4px 16px var(--color-shadow-menu);
10 min-width: var(--size-menu-width);
11 overflow: hidden;
12 font-family: var(--font-family-base);
13 font-size: var(--font-size-menu);
14 padding-left: 0;
15 animation: menu-in 0.15s cubic-bezier(0.16, 1, 0.3, 1);
16 transform-origin: top left;
17}
18
19menu li {
20 display: flex;
21 align-items: center;
22 gap: var(--spacing-md);
23 padding: var(--spacing-sm) var(--spacing-md);
24 cursor: pointer;
25 color: var(--color-text-menu);
26 white-space: nowrap;
27 transition: background var(--transition-fast);
28}
29
30menu li.menu-separator {
31 height: 1px;
32 background: var(--color-border);
33 margin: var(--spacing-xs);
34 padding: 0;
35 pointer-events: none;
36}
37
38menu li:hover {
39 background: var(--color-menu-item-hover);
40}
41
42.backdrop {
43 position: absolute;
44 top: 0;
45 left: 0;
46 width: 100%;
47 height: 100%;
48 background: transparent;
49}
50
51:host([open]) {
52 display: block;
53}
54
55@keyframes menu-in {
56 from {
57 opacity: 0;
58 transform: scale(0.95);
59 }
60 to {
61 opacity: 1;
62 transform: scale(1);
63 }
64}