git ssb

1
Page -statsShow {
2
  div.Scroller {
3
    display: flex
4
    flex-direction: column
5
    align-items: center
6
7
    div.content {
8
      flex-grow: 0
9
      $backgroundPrimaryText
10
      padding: 1rem
11
      max-width: 1000px
12
13
      h1 {
14
        font-size: .8rem
15
        letter-spacing: 4px
16
      }
17
18
      section.totals {
19
        display: flex
20
21
        div {
22
          flex-basis: 33%
23
          flex-grow: 1
24
25
          cursor: pointer
26
          $colorFontSubtle
27
          padding: 0 0 .5rem .8rem
28
          border-bottom: 1px solid gainsboro
29
          border-right: 1px solid gainsboro
30
31
          transition: all ease-out .5s
32
          :hover {
33
            $colorFontBasic
34
            transition: all ease-out .5s
35
          }
36
37
          -selected {
38
            $colorFontBasic
39
            border-bottom: 1px solid #fff
40
          }
41
          
42
          div.count {
43
            font-size: 3rem
44
            font-weight: 600
45
            margin-right: .5rem
46
          }
47
          strong {
48
            margin-right: .5rem
49
          }
50
        }
51
52
        
53
        div.shares {
54
          border-right: none
55
        }
56
      }
57
58
      section.graph {
59
        display: flex
60
        flex-wrap: wrap
61
        justify-content: center
62
63
        margin: 2rem 0
64
65
        canvas {
66
          margin-bottom: 1rem
67
        }
68
        div.changeRange {
69
          a {
70
            cursor: pointer
71
            :hover { text-decoration: underline }
72
          }
73
          span {
74
            $colorFontSubtle
75
          }
76
        }
77
      }
78
79
      table.blogs {
80
        width: 100%
81
        margin: 1rem 0 4rem
82
83
        thead {
84
          tr {
85
            margin-bottom: 1rem
86
            color: hsl(0, 0%, 25%)
87
            th.details {
88
              width: 70%
89
              padding: 0 2rem 0 0
90
            }
91
            th.comments, th.likes, th.shares {
92
              $colorFontSubtle
93
              width: 10%
94
            }
95
          }
96
        }
97
        tbody {
98
          tr.blog {
99
            margin-bottom: 1rem
100
            td {
101
              border-bottom: 1px solid rgba(0, 0, 0, .05)
102
            }
103
104
            td.details {
105
              width: 70%
106
              padding: .8rem 2rem .8rem 0
107
              
108
              div.title {
109
                font-size: 1.3rem
110
                font-weight: 600
111
                cursor: pointer
112
              }
113
114
              a { 
115
                $colorFontSubtle
116
                letter-spacing: .8px
117
                font-size: .7rem
118
                text-decoration: none
119
120
                :hover {
121
                  text-decoration: underline
122
                }
123
              }
124
            }
125
            td.comments, td.likes, td.shares {
126
              width: 10%
127
              /* padding: 0 2.5rem */
128
              font-size: 1.3rem
129
              font-weight: 600
130
              text-align: center
131
            }
132
133
            -background {
134
              filter: opacity(40%)
135
            }
136
          }
137
        }
138
      }
139
    }
140
  }
141
}
142