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