git ssb

1
Compose {
2
  display: flex
3
  flex-direction: column
4
5
  padding: .5rem .5rem 1rem 6rem
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
      curor: pointer
68
      color: transparent
69
      border: 1px rgba(0,0,0,0) solid
70
71
      ::-webkit-file-upload-button {
72
        visibility: hidden
73
      }
74
75
      ::before {
76
        padding-top: .3rem
77
78
        content: '📎'
79
        font-size: 1rem
80
        color: #666;
81
        background-color: #fff
82
83
        outline: none
84
        white-space: nowrap
85
        -webkit-user-select: none
86
87
        display: flex
88
        justify-content: center
89
      }
90
91
      :hover, :focus {
92
        border: 1px gainsboro solid
93
        outline: none
94
        box-shadow: none
95
      }
96
    }
97
98
  }
99
100
  -expanded {
101
    textarea {
102
      height: 200px
103
      transition: height .15s ease-out
104
    }
105
106
    input.channel {
107
      display: flex
108
    }
109
110
    section.actions {
111
      display: flex
112
    }
113
  }
114
115
  -contracted {
116
    textarea {
117
      height: 50px
118
      transition: height .15s ease-in
119
    }
120
121
    input.channel {
122
      display: none
123
    }
124
125
    section.actions {
126
      display: none
127
    }
128
  }
129
130
}
131