git ssb

1
SideNav {
2
  flex-shrink: 0
3
  flex-grow: 0
4
  overflow: hidden
5
  $backgroundPrimaryText
6
7
  display: flex
8
9
  div.level {
10
    min-width: 13rem
11
    max-width: 13rem
12
    overflow-y: auto
13
    overflow-x: hidden
14
15
    border-right: 1px gainsboro solid
16
17
    section {
18
      header {
19
        $colorFontSubtle
20
        padding: .5rem 1rem
21
      }
22
23
      div.Option {}
24
25
      hr {
26
        border: 1px solid gainsboro
27
        border-bottom: none
28
        margin: 0
29
      }
30
    }
31
32
    -one {}
33
    -two {}
34
  }
35
}
36
37
Option {
38
  min-width: 8rem
39
  padding: .5rem 1rem
40
  display: flex
41
  align-items: center
42
43
  :hover {
44
    cursor: pointer
45
    $backgroundSelected
46
  }
47
48
  -selected {
49
    $backgroundSelected
50
  }
51
52
  div.spacer {
53
    display: flex
54
    align-self: center
55
    div.alert {
56
      position: relative
57
      width: 1.2rem
58
      height: 1.2rem
59
      border-radius: 1rem
60
      top: -.2rem
61
      left: -.2rem
62
63
      background-color: red
64
      color: #fff
65
      font-size: .8rem
66
67
      display: flex
68
      justify-content: center
69
      align-items: center
70
      align-self: flex-start
71
    }
72
  }
73
74
  div.circle {
75
    margin-right: .6rem
76
77
    div.alert {
78
      position: absolute
79
      width: 1.2rem
80
      height: 1.2rem
81
      border-radius: 1rem
82
      top: -.2rem
83
      left: -.2rem
84
85
      background-color: red
86
      color: #fff
87
      font-size: .8rem
88
89
      display: flex
90
      justify-content: center
91
      align-items: center
92
    }
93
94
    
95
    a img {
96
   
97
    }
98
99
    i {
100
      $circleSmall
101
      $colorPrimary
102
      font-size: 1.3rem
103
104
      display: flex
105
      justify-content: center
106
      align-items: center
107
    }
108
  }
109
110
  div.label {
111
    $markdownSmall 
112
    (a) {
113
      $colorFontBasic
114
      :hover { text-decoration: none }
115
    }
116
117
    flex-grow: 1
118
119
    display: flex
120
    align-items: center
121
    min-height: 3rem
122
123
    div.Button {
124
      flex-grow: 1
125
    }
126
  }
127
}
128