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: .3rem
31
        border: none
32
33
        :hover {
34
          background-color: #f8f8f8
35
          a.close {
36
            visibility: visible
37
          }
38
        }
39
40
        -selected {
41
          color: #222
42
          background-color: #fff
43
44
          :hover {
45
            background-color: #fff
46
          }
47
48
          a.link {
49
            text-decoration: none
50
            max-width: calc(100% - 2rem)
51
          }
52
          a.close {
53
            visibility: visible
54
          }
55
        }
56
57
        -notify {
58
          background-color: orange;
59
        }
60
61
62
        a {
63
          color: #666
64
65
          :hover {
66
            text-decoration: none
67
          }
68
        }
69
70
        a.link {
71
          flex-grow: 1
72
          flex-shrink: 0
73
          overflow-x: hidden
74
          min-width: 0
75
          max-width: calc(100% - 1.4rem)
76
          white-space: nowrap
77
          text-overflow: ellipsis
78
79
          padding: .5rem 0 .5rem .6rem
80
        }
81
82
        a.close {
83
          visibility: hidden
84
          font-family: monospace
85
          line-height: 1rem
86
          width: .9rem
87
          height: .9rem
88
          /* border-radius: 1rem */
89
90
          margin-right: .3rem
91
92
          display: flex
93
          justify-content: center
94
95
          :hover {
96
            background: #aaaaaa
97
            color: #fff
98
            font-weight: 600
99
          }
100
        }
101
102
      }
103
104
    }
105
106
    div.navExtra {
107
      display: flex
108
      align-items: center
109
    }
110
  }
111
112
  section.content {
113
    display: flex
114
115
    height: 100% /* needed to stop making nav weird */
116
117
    div.page {
118
      flex-grow: 1
119
120
      display: flex /*hack to get give Scroller context it needs */
121
122
      padding-top: .2rem
123
    }
124
  }
125
}
126
127