git ssb

1
Network {
2
  div {
3
    margin: .8rem
4
    border-bottom: 1px solid gainsboro
5
  }
6
7
}
8
9
NetworkConnection {
10
  padding-left: 6rem
11
  padding-bottom: .8rem
12
  position: relative
13
14
  display: flex
15
  flex-direction: row
16
  flex-wrap: wrap
17
  align-items: center
18
19
  section.avatar {
20
    position: absolute
21
    left: 0
22
    top: 0
23
24
    a img {
25
      height: 3rem
26
      width: 3rem
27
    }
28
  }
29
30
  section.time-ago {
31
    position: absolute
32
    left: 0
33
    top: 3.5rem
34
35
    font-size: .8rem
36
    $textSubtle
37
  }
38
39
  section.name {
40
    flex-basis: 100%
41
42
    margin-right: 1rem
43
  }
44
45
  section.type {
46
    flex-basis: 100%
47
48
    font-size: .8rem
49
    $textSubtle
50
  }
51
52
  section.source {
53
    flex-basis: 100%
54
    label { margin-right: .5rem }
55
  }
56
57
  section.state {
58
    display: flex
59
    flex-direction: row
60
    align-items: center
61
62
    margin-right: 2rem
63
64
    label { margin-right: .5rem }
65
    i {
66
      width: 1rem
67
      height: 1rem
68
      border-radius: .5rem
69
70
      margin: 0 .2rem 0 .5rem
71
72
      background: #ccc
73
74
      -connecting, -disconnecting {
75
        background: #95cc95
76
       }
77
78
      -connected {
79
        background: #06e206
80
      }
81
    }
82
  }
83
84
  section.actions {
85
    button {
86
      padding: .2rem
87
      font-size: .7rem
88
    }
89
  }
90
91
92
  section.ping {
93
    flex-basis: 100%
94
    display: flex
95
96
    font-size: .8rem
97
    $textSubtle
98
99
    div.rtt {
100
      flex-basis: 8rem
101
      label { margin-right: .5rem }
102
    }
103
104
    div.skew {
105
      flex-basis: 8rem
106
      label { margin-right: .5rem }
107
    }
108
  }
109
110
  section.address{
111
    flex-basis: 100%
112
113
    font-size: .8rem
114
    $textSubtle
115
  }
116
}
117
118