git ssb

1
Compose {
2
  $maxWidth
3
4
  display: flex
5
  flex-direction: column
6
7
  textarea {
8
    $fontBasic
9
10
    padding: 1rem
11
    border-radius: 1rem
12
    $borderSubtle
13
    margin-bottom: .5rem
14
15
    outline: none
16
  }
17
18
  section.actions {
19
    display: flex
20
    flex-direction: row
21
    align-items: baseline
22
    justify-content: flex-end
23
24
    margin-top: .4rem
25
26
    input { flex-grow: 1 }
27
28
    input[type="file"] {
29
      padding: .5rem 0
30
31
      width: 2.5rem
32
      height: 1.5rem
33
      color: transparent
34
35
      ::-webkit-file-upload-button {
36
        visibility: hidden
37
      }
38
39
      ::before {
40
        $attachButton
41
        padding-top: .3rem
42
43
        content: '📎'
44
        font-size: 1rem
45
46
        outline: none
47
        white-space: nowrap
48
        -webkit-user-select: none
49
      }
50
51
      :active, :focus {
52
        outline: none
53
        box-shadow: none
54
      }
55
    }
56
57
    div.Button {
58
      margin-left: .5rem
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
$attachButton {
95
  background: #fff
96
  color: #666
97
  padding: .5rem
98
  border: 1px solid #b9b9b9
99
  border-radius: 4rem
100
  margin: 0
101
  cursor: pointer
102
}
103