git ssb

1
Message -default {
2
  padding: 1rem .5rem
3
4
  display: grid
5
  grid-template-columns: 5rem auto
6
7
  section.avatar {
8
    grid-column: 1 / 2
9
    grid-row: 1 / span 4
10
    a img {
11
    }
12
  }
13
14
  section.top {
15
    grid-column: 2 / 3
16
    grid-row: 1 / span 1
17
18
    display: flex
19
    align-items: baseline
20
    
21
    div.author {
22
      font-weight: 600
23
      margin-right: .5rem
24
      (a) { color: #222 }
25
    }
26
27
    div.title {
28
      flex-grow: 1
29
      font-size: .9rem
30
      $textSubtle
31
      (a) { $textSubtle }
32
    }
33
34
    div.meta {
35
      display: flex
36
      justify-content: flex-end
37
      align-items: baseline
38
39
      i, div, a {
40
        margin-left: .5rem
41
      }
42
    }
43
  }
44
45
  section.content {
46
    grid-column: 2 / 3
47
    grid-row: 2 / span 1
48
49
    margin-bottom: .5rem
50
51
    (img) {
52
      max-width: 100%
53
    }
54
    (video) {
55
      max-width: 100%
56
    }
57
  }
58
59
  section.bottom {
60
    grid-column: 2 / 3
61
    grid-row: 4 / span 1
62
63
    display: flex
64
    align-items: center
65
66
    div.timestamp {
67
      flex-grow: 1
68
69
      a {
70
        font-size: .9rem
71
        $textSubtle
72
      }
73
    }
74
75
    div.actions {
76
      display: flex
77
      justify-content: flex-end
78
79
      font-size: .9rem
80
      a {
81
        margin-left: .5em
82
      }
83
84
      a.unlike {
85
        $textSubtle
86
      }
87
    }
88
  }
89
90
  section.raw-content {
91
    grid-column: 2 / 3
92
    grid-row: 3 / span 1
93
94
    pre {
95
      border: 1px gainsboro solid
96
      padding: .8rem
97
      background-color: #f5f5f5
98
      color: #c121dc
99
      padding: .3rem
100
      white-space: pre-wrap
101
      word-wrap: break-word
102
103
      span {
104
        font-weight: 600
105
      }
106
      a {
107
        word-break: break-all
108
      }
109
    }
110
  }
111
112
  footer.backlinks {
113
    grid-row: 5 / span 1
114
115
    grid-column: 2 / 3
116
    flex-basis: 100%
117
  }
118
119
  /* UnreadFeature (search codebase for this if extracting) */
120
121
  /* initially read */
122
  -read { }
123
124
  /* initially unread */
125
  -unread {
126
    section.top {
127
      div.meta {
128
        i.unread {
129
          display: initial
130
          transition: color 1s ease-in
131
          color: hotpink
132
        }
133
      }
134
    }
135
  }
136
137
  /* initially unread, but subsequently marked read */
138
  -unread {
139
    -read {
140
      section.top {
141
        div.meta {
142
          i.unread {
143
            color: #bbb
144
          }
145
        }
146
      }
147
    }
148
  }
149
}
150