Mercurial > nebulaweb3

comparison default/assets/scss/components/_clndr.scss @ 0:1d038bc9b3d2 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Up:default
author Liny <dev@neowd.com>
date Sat, 31 May 2025 09:21:51 +0800
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1d038bc9b3d2
1 // main: ../style.scss
2
3 /* CLNDR
4 ========================*/
5 .clndr {
6 padding: em(25) em(30);
7 position: relative;
8
9 .day-number {
10 position: relative;
11 z-index: 2;
12 }
13
14 .clndr-grid {
15 @include clearfix;
16 .days {
17 display: block;
18 > .day {
19 display: inline-block;
20 width: 14.28571%;
21 float: left;
22 padding: 0 em(10);
23 line-height: 3em;
24 cursor: pointer;
25 position: relative;
26 z-index: 0;
27
28 &.event::before,
29 &.today::before {
30 content: "";
31 @include position(absolute, 50% 50% null null);
32 transform: translateY(-50%) translateX(50%);
33 background: rgba($body-color, 0.1);
34 z-index: 1;
35 @include size(2.5em);
36 border-radius: 100px;
37 display: block;
38 opacity: 0;
39 transition: all $transition-duration $transition-function;
40 }
41
42 &.event::before {
43 background: none;
44 border:1px solid rgba($body-color,0.3);
45 }
46
47 &.event::before { opacity: 1 }
48 &.last-month,
49 &.next-month {
50 color: rgba($body-color, 0.2);
51 }
52 }
53 }
54 }
55
56 .event-listing {
57 @include clearfix();
58 @include margin( null em(-32) em(-26));
59 margin-top: em(35);
60 padding: em(20) 0 em(20);
61 color: $body-color;
62 background: #fff;
63 // border: 1px solid rgba($body-color, 0.2);
64 // border-top: 0;
65
66 .selected-date {
67 position: relative;
68 text-align: center;
69 display: block;
70 .date {
71 vertical-align: top;
72 font-size: em(30);
73 line-height: 1em;
74 }
75 }
76
77 .event-item {
78 border-bottom: 1px solid #ddd;
79 padding-bottom: em(10);
80 margin-bottom: em(10);
81 &:last-child { border-bottom: 0; margin-bottom: 0 }
82 }
83
84 .event-item-time {
85 opacity: 0.5;
86 }
87
88 .event-item-title {
89 margin-left: em(10);
90 }
91
92 .event-item-icon {
93 vertical-align: sub;
94 float: right;
95 }
96 }
97
98 .clndr-previous-button,
99 .clndr-today-button,
100 .clndr-next-button {
101 cursor: pointer;
102 position: relative;
103 top: em(-2);
104 }
105 }
106
107 .color-white .clndr{
108
109 &,
110 .clndr-title,
111 .curront-month,
112 .days .day {
113 color: #fff;
114 }
115
116 .days .day {
117 &.last-month,
118 &.next-month {
119 color: rgba(255,255,255,0.3);
120 }
121
122 &.event::before {
123 background: none;
124 border: 1px solid rgba(255,255,255,0.3);
125 }
126 }
127
128 .days .day.today {
129 color: $color-scheme;
130 &::before {
131 background: white;
132 opacity: 1;
133 border-color: transparent;
134 }
135 }
136 }