git ssb

1
CalendarPage {
2
  width: 100%
3
4
  display: grid
5
  justify-content: center
6
  align-content: start
7
  justify-items: center
8
9
  overflow-y: scroll
10
}
11
12
13
Calendar {
14
  font-family: 'input_mono_regular', monospace
15
  text-transform: capitalize
16
17
  padding: 0
18
  margin: 0
19
  margin-bottom: 4rem
20
21
  section {
22
    top: 50%
23
    margin: 0 auto
24
    user-select: none
25
    -webkit-user-select: none
26
    -ms-user-select: none
27
    -webkit-transform: translateY(-50%)
28
    -ms-transform: translateY(-50%)
29
    transform: translateY(-50%)
30
    text-align: center
31
  }
32
33
  div.header { 
34
    margin: 40px 0
35
    text-align: left
36
    align-content: flex-start
37
38
    display: grid
39
    justify-content: space-between
40
    grid-auto-flow: column
41
42
    div.year { 
43
      font-size: 40px
44
      font-weight: bold
45
46
      a {
47
        text-align: center
48
        color: #000
49
        width: 30px
50
        display: inline-block
51
        margin-left: 10px
52
53
        :hover {
54
          color: #ffffff
55
          background: #000
56
          cursor: pointer
57
          text-decoration: none
58
        }
59
      }
60
61
    }
62
63
    div.actions {
64
      display: grid
65
      justify-content: space-between
66
      grid-auto-flow: column
67
      grid-gap: 1rem
68
    }
69
  }
70
71
  div.months {
72
    display: flex
73
    flex-wrap: wrap
74
75
    div.month {
76
      margin-right: 20px
77
78
      div.month-name {
79
        font-size: 20px
80
        font-weight: bold
81
        text-align: left
82
        cursor: pointer
83
        margin-bottom: 5px
84
      }
85
86
      div.Marama {
87
      }
88
    }
89
  }
90
91
  /* @media only screen and (min-width: 1440px) */
92
  /* { section { width: 1440px; }} */
93
94
  /* @media only screen and (max-width: 1440px) */
95
  /* { section { width: 720px; }} */
96
97
  /* @media only screen and (max-width: 720px) */
98
  /* { section { width: 360px; }} */
99
}
100
101
102
103
CalendarEvents {
104
  width: 50rem
105
  margin-right: 6rem
106
107
  div {
108
    width: 50rem
109
110
    div.Message {
111
      width: 50rem
112
      section.bottom { display: none }
113
    }
114
  }
115
}
116