git ssb

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