git ssb

1
CalendarPage {
2
  width: 100%
3
4
  display: grid
5
  justify-content: center
6
}
7
8
9
Calendar {
10
  font-family: 'input_mono_regular', monospace
11
  text-transform: uppercase
12
13
  display: block
14
  height: 100%
15
  min-height: 400px
16
  width: 100%
17
18
  padding: 0
19
  margin: 0
20
21
  section {
22
    position: relative
23
    top: 50%
24
    margin: 0 auto
25
    user-select: none
26
    -webkit-user-select: none
27
    -ms-user-select: none
28
    -webkit-transform: translateY(-50%)
29
    -ms-transform: translateY(-50%)
30
    transform: translateY(-50%)
31
    text-align: center
32
  }
33
34
  div.header { 
35
    margin: 0 10px 40px 10px
36
    text-align: left
37
    align-content: flex-start
38
39
    p.year { 
40
      font-size: 40px
41
      font-weight: bold
42
43
      a {
44
        text-align: center
45
        color: #000
46
        width: 30px
47
        display: inline-block
48
        margin-left: 10px
49
50
        :hover {
51
          color: #ffffff
52
          background: #000
53
          cursor: pointer
54
        }
55
      }
56
    }
57
58
    p.percentage {
59
      font-size: 20px
60
      color: #8b8b8b
61
    }
62
  }
63
64
  div.month {
65
    margin: 10px
66
    display: inline-block
67
    /* width:100px */
68
    /* height: 130px */
69
70
    div.label {
71
      font-size: 20px
72
      font-weight: bold
73
      text-align: left
74
      margin-bottom: 5px
75
    }
76
77
    div.graph {
78
79
      div {
80
        div.day {
81
          background: #000
82
          height: .8rem
83
          width: .8rem
84
85
          border-radius: .1rem
86
        }
87
      }
88
    }
89
  }
90
91
92
  /* p { margin: 0px; } */
93
94
  /* svg.graph { color:white; width: 100%; height: 100px; } */
95
  /* svg.graph text {font-family: 'input_mono_regular'; stroke:none; fill:#8b8b8b; font-size:14px; text-anchor: middle; } */
96
  /* svg.graph text.dayLabel { font-size: 10px; } */
97
  /* svg.graph rect { stroke:none; outline: none; } */
98
  /* svg.graph rect:hover, rect:focus { fill: #ff1e00 !important; cursor:pointer; } */
99
100
  /* svg.graph rect.null { fill: none; stroke: none;} */
101
  /* svg.graph rect.today { fill:#ff1e00; } */
102
  /* svg.graph rect.day { fill:#8b8b8b; } */
103
  /* svg.graph rect.weekend { fill:#747474 } */
104
  /* svg.graph rect.gone { fill:#000000 } */
105
  /* svg.graph path { stroke-linecap: butt; stroke-dasharray: 1,1; fill:none; stroke:#333; stroke-width:13px } */
106
107
  /* @media only screen and (min-width: 1440px) */
108
  /* { section { width: 1440px; }} */
109
110
  /* @media only screen and (max-width: 1440px) */
111
  /* { section { width: 720px; }} */
112
113
  /* @media only screen and (max-width: 720px) */
114
  /* { section { width: 360px; }} */
115
}
116