git ssb

1
MainWindow {
2
  height: 100%
3
  display: flex
4
  flex-direction: column
5
6
  -darwin {
7
    div.top {
8
      padding-left: 70px
9
    }
10
    div.top {
11
      span.appTitle {
12
        margin-right: 40px;
13
      }
14
    }
15
  }
16
17
  -win32 {
18
    div.top {
19
      padding-right: 70px
20
    }
21
  }
22
23
  div.top {
24
    -webkit-app-region: drag;
25
    display: flex;
26
    background: #fff;
27
    padding: 10px;
28
    border-bottom: 2px solid #e4edff;
29
    box-shadow: 0 0 3px #7f7f7f;
30
    position: relative;
31
32
    span {
33
      a {
34
        padding: 2px 8px;
35
        border: 2px solid #c7c6c6;
36
        border-radius: 4px;
37
        background: #dedede;
38
        color: #656565;
39
        font-size: 120%;
40
        cursor: pointer;
41
        margin-left: 5px;
42
        text-decoration: none !important
43
44
        :hover {
45
          color: black
46
          border-color: #888
47
        }
48
49
        -selected {
50
          border-color: #444
51
          background: #CCC
52
          color: black
53
        }
54
55
        -add {
56
          border-color: #498849
57
          background-color: #255D24
58
          text-shadow: 1px 1px 1px #000
59
          color: white
60
61
          :active {
62
            background-color: #1F331F !important
63
          }
64
65
          :hover {
66
            background-color: #356D34
67
            border-color: #4CB54C
68
          }
69
        }
70
      }
71
    }
72
73
    span.history {
74
      a {
75
        opacity: 0.3
76
77
        -active {
78
          opacity: 1
79
        }
80
      }
81
82
      a + a {
83
        margin-left: 0
84
      }
85
    }
86
87
    span.appTitle {
88
      flex: 1;
89
      text-align: center;
90
      font-size: 130%;
91
      color: #757575;
92
      letter-spacing: 0.1em;
93
      font-weight: bold;
94
      font-weight: normal;
95
    }
96
  }
97
98
  div.info {
99
    a.message {
100
      display: block
101
      padding: 10px
102
      background: #314427
103
      transition: color 0.2s, background-color 0.2s
104
105
      :hover {
106
        text-decoration: none
107
        color: white
108
        background: #315427
109
      }
110
    }
111
    box-shadow: 0 0 3px black
112
    overflow: hidden
113
    animation: 0.5s slide-in
114
    position: relative
115
  }
116
117
  div.main {
118
    flex: 1
119
    overflow: auto
120
    display: flex
121
122
    div {
123
      flex: 1
124
    }
125
  }
126
127
  div.bottom {
128
    position: relative
129
    box-shadow: 0 0 3px #222
130
    background: #222
131
    align-items: center
132
    display: flex
133
    padding: 5px
134
135
    audio {
136
      color: #EEE
137
138
      ::-webkit-media-controls-panel {
139
        background: transparent
140
      }
141
142
      ::-webkit-media-controls-current-time-display {
143
        color: inherit
144
      }
145
146
      width: 100%
147
    }
148
  }
149
}
150
151
@keyframes slide-in {
152
  0% {
153
    max-height: 0
154
  }
155
  100% {
156
    max-height: 100px
157
  }
158
}
159