git ssb

1
Compose {
2
  display: flex
3
  flex-direction: column
4
5
  padding: 1rem .5rem 1rem 7.3rem
6
7
  textarea {
8
    border: 1px solid gainsboro
9
  }
10
11
  input.channel {
12
    border: 1px solid gainsboro
13
    padding: .5rem
14
  }
15
16
  section.actions {
17
    display: flex
18
    flex-direction: row
19
    align-items: baseline
20
21
    margin-top: .4rem
22
23
    input[type="file"] {
24
      flex-grow: 1
25
26
      padding: .5rem 0
27
28
      width: 5.5rem
29
      color: transparent
30
31
      ::-webkit-file-upload-button {
32
        visibility: hidden
33
      }
34
35
      ::before {
36
        $composeButton
37
        padding-top: .3rem
38
39
        content: '📎'
40
        font-size: 1rem
41
42
        outline: none
43
        white-space: nowrap
44
        -webkit-user-select: none
45
      }
46
47
      :active, :focus {
48
        outline: none
49
        box-shadow: none
50
      }
51
    }
52
53
    button {
54
      $composeButton
55
56
      text-transform: uppercase
57
      font-weight: bold
58
      font-size: .7rem
59
    }
60
  }
61
62
  -expanded {
63
    textarea {
64
      height: 200px
65
      transition: height .15s ease-out
66
    }
67
68
    input.channel {
69
      display: flex
70
    }
71
72
    section.actions {
73
      display: flex
74
    }
75
  }
76
77
  -contracted {
78
    textarea {
79
      height: 50px
80
      transition: height .15s ease-in
81
    }
82
83
    input.channel {
84
      display: none
85
    }
86
87
    section.actions {
88
      display: none
89
    }
90
  }
91
92
}
93
94
$composeButton {
95
  background: #fff
96
  color: #666
97
  border: 1px solid #bbb
98
  border-radius: .5rem
99
  padding: .5rem
100
  margin: 0
101
  cursor: pointer
102
}
103