git ssb

1
Page -home {
2
3
  div.container {
4
    $primaryBackground
5
6
7
    section.updates {
8
9
      -directMessage {
10
        $homePageSection
11
12
        div.threads {
13
          div.thread {
14
            div.content {
15
              div.subject {
16
                display: flex
17
18
                div.recps {
19
                  display: flex
20
                  font-weight: 600
21
                  margin-right: .4rem
22
23
                  div.recp {
24
                    margin-right: .4rem
25
                  }
26
                }
27
              }
28
            }
29
          }
30
        }
31
      }
32
33
      -channel {
34
        $homePageSection
35
36
        div.threads {
37
          div.thread {
38
            div.context {
39
              background: #fff
40
              min-width: 8rem
41
              padding: .1rem .3rem
42
              border: 1px solid #ddd
43
              border-radius: 2px
44
            }
45
          }
46
        }
47
      }
48
49
      -group {
50
        $homePageSection
51
      }
52
    }
53
  }
54
}
55
56
$homePageSection {
57
  $maxWidth
58
  margin-left: auto
59
  margin-right: auto
60
61
  display: flex
62
  flex-direction: column
63
  align-items: center
64
  margin-bottom: 1.5rem
65
66
  h2 {
67
    color: #888
68
    font-size: 1rem
69
    text-align: center
70
    padding-bottom: .3rem
71
    width: 420px
72
    margin-top: 0
73
    margin-bottom: .4rem
74
  }
75
76
  div.threads {
77
    div.thread {
78
      display: flex
79
      align-items: center
80
81
      margin-bottom: .5rem
82
83
      div.context {
84
        display: flex
85
        margin-right: 1rem
86
87
        img {
88
          $smallAvatar
89
          margin-right: .5rem
90
        }
91
      }
92
93
      div.content {
94
        flex-grow: 1
95
        background: #fff
96
        padding: 1rem
97
        border: 1px solid #ddd
98
        border-radius: 2px
99
100
        div.subject {
101
          font-size: 1.2rem
102
          margin-bottom: .3rem
103
104
          $largeMarkdown
105
        }
106
        div.reply {
107
          display: flex
108
          color: #444
109
110
          div.replySymbol {
111
            margin-left: .7rem
112
            margin-right: .3rem
113
          }
114
115
          $smallMarkdown
116
        }
117
      }
118
    }
119
  }
120
}
121