git ssb

1
Hypertabs {
2
  display: flex
3
  flex-direction: column
4
5
  height: 100% /* needed to stop scroller blowing out */
6
7
  nav {
8
    display: flex
9
    
10
    background: linear-gradient(to bottom, #efefef, #e5e5e5)
11
12
    section.tabs {
13
      flex-grow: 1
14
      display: flex
15
      min-width: 0
16
17
      div.tab {
18
        flex-grow: 1
19
20
        display: flex
21
        align-items: center
22
        justify-content: space-between
23
24
        min-width: 3.5rem
25
        font-size: .9rem
26
        background-color: #efefef
27
        overflow: hidden
28
29
        padding: 0
30
        margin-left: .6rem
31
        border: 1px gainsboro solid
32
        border-bottom: none
33
34
        -selected {
35
          color: #222
36
          background-color: #fff
37
38
          a.link {
39
            max-width: calc(100% - 2rem)
40
          }
41
          a.close {
42
            visibility: visible
43
          }
44
        }
45
46
        -notify {
47
          background-color: orange;
48
        }
49
50
51
        a {
52
          color: #666
53
54
          :hover {
55
            color: #0088cc
56
            text-decoration: none
57
          }
58
        }
59
60
        a.link {
61
          flex-grow: 1
62
          flex-shrink: 0
63
          overflow-x: hidden
64
          min-width: 0
65
          max-width: calc(100% - 1.4rem)
66
          white-space: nowrap
67
          text-overflow: ellipsis
68
69
          padding: .5rem 0 .5rem .6rem
70
        }
71
72
        a.close {
73
          visibility: hidden
74
          font-family: monospace
75
          line-height: 1rem
76
          width: .9rem
77
          height: .9rem
78
          /* border-radius: 1rem */
79
80
          margin-right: .3rem
81
82
          display: flex
83
          justify-content: center
84
85
          :hover {
86
            background: #aaaaaa
87
            color: #fff
88
            font-weight: 600
89
          }
90
        }
91
92
      }
93
94
    }
95
96
    div.navExtra {
97
      display: flex
98
      align-items: center
99
    }
100
  }
101
102
  section.content {
103
    display: flex
104
105
    height: 100% /* needed to stop making nav weird */
106
107
    div.page {
108
      flex-grow: 1
109
110
      display: flex /*hack to get give Scroller context it needs */
111
112
      padding-top: .2rem
113
    }
114
  }
115
}
116
117