git ssb

1
Compose {
2
  display: flex
3
  flex-direction: column
4
5
  padding: .5rem .5rem 1rem 5.5rem
6
7
  textarea {
8
    border: 1px solid gainsboro
9
    border-top-left-radius: 0
10
    border-top-right-radius: 0
11
  }
12
13
  input.channel {
14
    border: 1px solid gainsboro
15
    border-bottom: none
16
    border-bottom-left-radius: 0
17
    border-bottom-right-radius: 0
18
    padding: .5rem
19
20
    :focus {
21
      outline: none
22
      box-shadow: none
23
    }
24
    :disabled {
25
      background-color: #f1f1f1
26
      cursor: not-allowed
27
    }
28
  }
29
30
  section.warning {
31
    color: #fff
32
    background-color: red
33
34
    height: 0
35
    padding: 0 .5rem
36
    transition: all ease-in .1s
37
38
    display: flex
39
    justify-content: space-between
40
41
42
    -open {
43
      padding: .5rem
44
      height: initial
45
    }
46
47
    i.fa { margin-right: .5rem }
48
    div.warning {
49
      strong { margin-right: .3rem }
50
    }
51
    div.close {
52
      cursor: pointer
53
    }
54
  }
55
56
  section.actions {
57
    display: flex
58
    flex-direction: row
59
    align-items: baseline
60
    justify-content: space-between
61
62
    margin-top: .4rem
63
64
    input[type="file"] {
65
      width: 1.8rem
66
      height: 1.8rem
67
      cursor: pointer
68
      color: transparent
69
      font-family: FontAwesome
70
      border: 1px rgba(0,0,0,0) solid
71
72
      ::-webkit-file-upload-button {
73
        visibility: hidden
74
      }
75
76
      ::before {
77
        padding-top: .3rem
78
79
        content: '\f0c6'
80
        font-size: 1rem
81
        color: #666;
82
        background-color: #fff
83
84
        outline: none
85
        white-space: nowrap
86
        -webkit-user-select: none
87
88
        display: flex
89
        justify-content: center
90
      }
91
92
      :hover, :focus {
93
        border: 1px gainsboro solid
94
        outline: none
95
        box-shadow: none
96
      }
97
    }
98
99
  }
100
101
  -expanded {
102
    textarea {
103
      height: 200px
104
      transition: height .15s ease-out
105
    }
106
107
    input.channel {
108
      display: flex
109
    }
110
111
    section.actions {
112
      display: flex
113
    }
114
  }
115
116
  -contracted {
117
    textarea {
118
      height: 50px
119
      transition: height .15s ease-in
120
    }
121
122
    input.channel {
123
      display: none
124
    }
125
126
    section.actions {
127
      display: none
128
    }
129
  }
130
131
}
132