Files: 2b05be8ee023fdd9580d6a845ba074a425756685 / app / html / tabs.mcss
1531 bytesRaw
1 | /* TODO depricate this carefully (see styles/mcss/hypertabs.mcss) */ |
2 | /* NOTE there are some active styles in here still */ |
3 | |
4 | Hypertabs { |
5 | nav { |
6 | display: flex |
7 | |
8 | background: linear-gradient(to bottom, #efefef, #e5e5e5) |
9 | |
10 | section.tabs { |
11 | flex-grow: 1 |
12 | display: flex |
13 | min-width: 0 |
14 | |
15 | div.tab { |
16 | flex-grow: 1 |
17 | |
18 | display: flex |
19 | align-items: center |
20 | justify-content: space-between |
21 | |
22 | min-width: 3.5rem |
23 | font-size: .9rem |
24 | background-color: #efefef |
25 | overflow: hidden |
26 | |
27 | padding: 0 |
28 | margin-left: .6rem |
29 | border: 1px gainsboro solid |
30 | border-bottom: none |
31 | |
32 | -selected { |
33 | color: #222 |
34 | $backgroundPrimary |
35 | |
36 | a.link { |
37 | max-width: calc(100% - 2rem) |
38 | } |
39 | } |
40 | |
41 | -notify { |
42 | background-color: orange; |
43 | } |
44 | |
45 | |
46 | a { |
47 | color: #666 |
48 | |
49 | :hover { |
50 | color: #0088cc |
51 | text-decoration: none |
52 | } |
53 | } |
54 | |
55 | a.link { |
56 | flex-grow: 1 |
57 | flex-shrink: 0 |
58 | overflow-x: hidden |
59 | min-width: 0 |
60 | max-width: calc(100% - 1.4rem) |
61 | white-space: nowrap |
62 | text-overflow: ellipsis |
63 | |
64 | padding: .5rem 0 .5rem .6rem |
65 | } |
66 | |
67 | } |
68 | |
69 | } |
70 | |
71 | div.navExtra { |
72 | z-index: 1000 |
73 | padding-bottom: calc(var(--app-border-width)/2) |
74 | |
75 | display: grid |
76 | grid-auto-flow: column |
77 | grid-gap: .5rem |
78 | align-items: center |
79 | |
80 | margin: 0 .5rem |
81 | } |
82 | } |
83 | } |
84 |
Built with git-ssb-web