git ssb

1
Message {
2
  display: flex
3
  flex-direction: column
4
  box-shadow: #dadada 1px 2px 8px
5
  border: 1px solid #f5f5f5
6
  background: white
7
  position: relative
8
9
  :focus {
10
    z-index: 1
11
  }
12
13
  -reply {
14
    header {
15
      div.main {
16
        a.avatar {
17
          img {
18
            width: 30px
19
          }
20
        }
21
      }
22
    }
23
  }
24
25
  header {
26
    margin: 15px 15px
27
    display: flex
28
29
    div.main {
30
      display: flex
31
      flex: 1
32
33
      a.avatar {
34
        img {
35
          width: 50px
36
        }
37
      }
38
39
      div.main {
40
        div.name {
41
          font-size: 120%
42
          a {
43
            color: #444
44
            font-weight: bold
45
          }
46
        }
47
        div.meta {
48
          font-size: 90%
49
        }
50
        margin-left: 10px
51
      }
52
53
      div.meta {
54
55
      }
56
    }
57
58
    div.meta {
59
60
      em {
61
        display: inline-block
62
        padding: 4px
63
      }
64
65
      a.channel {
66
        display: inline-block
67
        padding: 4px
68
      }
69
70
      span.likes {
71
        color: #ffffff;
72
        background: linear-gradient(45deg, #859c88, #87d47d);
73
        padding: 5px 8px;
74
        border-radius: 10px;
75
        display: inline-block;
76
        vertical-align: top;
77
      }
78
79
      span.private {
80
        display: inline-block;
81
        margin: -3px -3px -3px 4px;
82
        border: 4px solid #525050;
83
        position: relative;
84
85
        a {
86
          display: inline-block
87
88
          img {
89
            margin: 0
90
            vertical-align: bottom
91
            border: none
92
          }
93
        }
94
95
        :after {
96
          content: 'private';
97
          position: absolute;
98
          background: #525050;
99
          bottom: 0;
100
          left: -1px;
101
          font-size: 10px;
102
          padding: 2px 4px 0 2px;
103
          border-top-right-radius: 5px;
104
          color: white;
105
          font-weight: bold;
106
          pointer-events: none;
107
          white-space: nowrap
108
        }
109
      }
110
    }
111
  }
112
113
  section {
114
    margin: 0 15px
115
    (img) {
116
      max-width: 100%
117
    }
118
  }
119
120
  footer {
121
    background: #fdfdfd
122
    padding: 15px 15px
123
    text-align: right
124
125
    div.actions {
126
      a {
127
        margin-left: 5px;
128
        color: #5f5f5f;
129
        padding: 3px 6px;
130
        background: white;
131
        border: 2px solid #DDD;
132
        border-radius: 4px;
133
134
        :hover {
135
          background: #cbeeff;
136
          color: #3b7ba2;
137
          text-decoration: none;
138
          border-color: #8eafc1;
139
        }
140
      }
141
    }
142
  }
143
}
144