git ssb

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