git ssb

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