forked from ivan-lednev/obsidian-day-planner
-
Notifications
You must be signed in to change notification settings - Fork 8
/
styles.css
51 lines (43 loc) · 16.6 KB
/
styles.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
/** Status Bar **/
.day-planner-progress-bar {
background-color: var(--text-muted);
border-radius: var(--size-4-1);
min-width: 80px;
height: var(--size-4-4);
float: left;
}
.day-planner-progress-value {
background-color: var(--interactive-accent);
transition: 0.3s all linear;
border-radius: var(--size-4-1);
height: var(--size-4-4);
display: inline-block;
}
.day-planner-progress-value.green,
.day-planner .progress-pie.green::before {
background-color: #4CAF50;
}
.progress-pie.green {
background-image: linear-gradient(to right, transparent 50%, #4CAF50 0)
}
.progress-pie.day-planner-progress-pie {
background-color: var(--text-muted);
float: left;
margin: 0px var(--size-4-2) 0px 0px;
height: var(--size-4-4);
width: var(--size-4-4);
}
.progress-pie.day-planner-progress-pie:after {
width: 80%;
height: 80%;
color: transparent;
background-color: transparent;
font-size: var(--size-4-2);
font-weight: 900;
line-height: var(--size-4-3);
}
[data-type="timeline"] .view-content {
padding-bottom: 0;
}
/* CSS Progress Pie by Olivia Ng | MIT License | github.com/oliviale/css-progress-pie*/
.progress-pie{width:60px;height:60px;border-radius:50%;background:#eee;background-image:-webkit-linear-gradient(left,transparent 50%,var(--interactive-accent) 0);background-image:linear-gradient(to right,transparent 50%,var(--interactive-accent) 0);position:relative;display:inline-block;margin:10px}.progress-pie::before{content:'';display:block;margin-left:50%;height:100%;border-radius:0 100% 100% 0/50%;background-color:inherit;-webkit-transform-origin:left;-ms-transform-origin:left;transform-origin:left}.progress-pie::after{content:attr(data-value);position:absolute;width:70%;height:70%;margin:auto;border-radius:50%;background-color:#fff;left:0;right:0;top:0;bottom:0;text-align:center;font:900 var(--size-4-5)/41px Tahoma}.progress-pie[data-value="0"]:before{-webkit-transform:rotate(0turn);-ms-transform:rotate(0turn);transform:rotate(0turn)}.progress-pie[data-value="1"]:before{-webkit-transform:rotate(.01turn);-ms-transform:rotate(.01turn);transform:rotate(.01turn)}.progress-pie[data-value="2"]:before{-webkit-transform:rotate(.02turn);-ms-transform:rotate(.02turn);transform:rotate(.02turn)}.progress-pie[data-value="3"]:before{-webkit-transform:rotate(.03turn);-ms-transform:rotate(.03turn);transform:rotate(.03turn)}.progress-pie[data-value="4"]:before{-webkit-transform:rotate(.04turn);-ms-transform:rotate(.04turn);transform:rotate(.04turn)}.progress-pie[data-value="5"]:before{-webkit-transform:rotate(.05turn);-ms-transform:rotate(.05turn);transform:rotate(.05turn)}.progress-pie[data-value="6"]:before{-webkit-transform:rotate(.06turn);-ms-transform:rotate(.06turn);transform:rotate(.06turn)}.progress-pie[data-value="7"]:before{-webkit-transform:rotate(.07turn);-ms-transform:rotate(.07turn);transform:rotate(.07turn)}.progress-pie[data-value="8"]:before{-webkit-transform:rotate(.08turn);-ms-transform:rotate(.08turn);transform:rotate(.08turn)}.progress-pie[data-value="9"]:before{-webkit-transform:rotate(.09turn);-ms-transform:rotate(.09turn);transform:rotate(.09turn)}.progress-pie[data-value="10"]:before{-webkit-transform:rotate(.1turn);-ms-transform:rotate(.1turn);transform:rotate(.1turn)}.progress-pie[data-value="11"]:before{-webkit-transform:rotate(.11turn);-ms-transform:rotate(.11turn);transform:rotate(.11turn)}.progress-pie[data-value="12"]:before{-webkit-transform:rotate(.12turn);-ms-transform:rotate(.12turn);transform:rotate(.12turn)}.progress-pie[data-value="13"]:before{-webkit-transform:rotate(.13turn);-ms-transform:rotate(.13turn);transform:rotate(.13turn)}.progress-pie[data-value="14"]:before{-webkit-transform:rotate(.14turn);-ms-transform:rotate(.14turn);transform:rotate(.14turn)}.progress-pie[data-value="15"]:before{-webkit-transform:rotate(.15turn);-ms-transform:rotate(.15turn);transform:rotate(.15turn)}.progress-pie[data-value="16"]:before{-webkit-transform:rotate(.16turn);-ms-transform:rotate(.16turn);transform:rotate(.16turn)}.progress-pie[data-value="17"]:before{-webkit-transform:rotate(.17turn);-ms-transform:rotate(.17turn);transform:rotate(.17turn)}.progress-pie[data-value="18"]:before{-webkit-transform:rotate(.18turn);-ms-transform:rotate(.18turn);transform:rotate(.18turn)}.progress-pie[data-value="19"]:before{-webkit-transform:rotate(.19turn);-ms-transform:rotate(.19turn);transform:rotate(.19turn)}.progress-pie[data-value="20"]:before{-webkit-transform:rotate(.2turn);-ms-transform:rotate(.2turn);transform:rotate(.2turn)}.progress-pie[data-value="21"]:before{-webkit-transform:rotate(.21turn);-ms-transform:rotate(.21turn);transform:rotate(.21turn)}.progress-pie[data-value="22"]:before{-webkit-transform:rotate(.22turn);-ms-transform:rotate(.22turn);transform:rotate(.22turn)}.progress-pie[data-value="23"]:before{-webkit-transform:rotate(.23turn);-ms-transform:rotate(.23turn);transform:rotate(.23turn)}.progress-pie[data-value="24"]:before{-webkit-transform:rotate(.24turn);-ms-transform:rotate(.24turn);transform:rotate(.24turn)}.progress-pie[data-value="25"]:before{-webkit-transform:rotate(.25turn);-ms-transform:rotate(.25turn);transform:rotate(.25turn)}.progress-pie[data-value="26"]:before{-webkit-transform:rotate(.26turn);-ms-transform:rotate(.26turn);transform:rotate(.26turn)}.progress-pie[data-value="27"]:before{-webkit-transform:rotate(.27turn);-ms-transform:rotate(.27turn);transform:rotate(.27turn)}.progress-pie[data-value="28"]:before{-webkit-transform:rotate(.28turn);-ms-transform:rotate(.28turn);transform:rotate(.28turn)}.progress-pie[data-value="29"]:before{-webkit-transform:rotate(.29turn);-ms-transform:rotate(.29turn);transform:rotate(.29turn)}.progress-pie[data-value="30"]:before{-webkit-transform:rotate(.3turn);-ms-transform:rotate(.3turn);transform:rotate(.3turn)}.progress-pie[data-value="31"]:before{-webkit-transform:rotate(.31turn);-ms-transform:rotate(.31turn);transform:rotate(.31turn)}.progress-pie[data-value="32"]:before{-webkit-transform:rotate(.32turn);-ms-transform:rotate(.32turn);transform:rotate(.32turn)}.progress-pie[data-value="33"]:before{-webkit-transform:rotate(.33turn);-ms-transform:rotate(.33turn);transform:rotate(.33turn)}.progress-pie[data-value="34"]:before{-webkit-transform:rotate(.34turn);-ms-transform:rotate(.34turn);transform:rotate(.34turn)}.progress-pie[data-value="35"]:before{-webkit-transform:rotate(.35turn);-ms-transform:rotate(.35turn);transform:rotate(.35turn)}.progress-pie[data-value="36"]:before{-webkit-transform:rotate(.36turn);-ms-transform:rotate(.36turn);transform:rotate(.36turn)}.progress-pie[data-value="37"]:before{-webkit-transform:rotate(.37turn);-ms-transform:rotate(.37turn);transform:rotate(.37turn)}.progress-pie[data-value="38"]:before{-webkit-transform:rotate(.38turn);-ms-transform:rotate(.38turn);transform:rotate(.38turn)}.progress-pie[data-value="39"]:before{-webkit-transform:rotate(.39turn);-ms-transform:rotate(.39turn);transform:rotate(.39turn)}.progress-pie[data-value="40"]:before{-webkit-transform:rotate(.4turn);-ms-transform:rotate(.4turn);transform:rotate(.4turn)}.progress-pie[data-value="41"]:before{-webkit-transform:rotate(.41turn);-ms-transform:rotate(.41turn);transform:rotate(.41turn)}.progress-pie[data-value="42"]:before{-webkit-transform:rotate(.42turn);-ms-transform:rotate(.42turn);transform:rotate(.42turn)}.progress-pie[data-value="43"]:before{-webkit-transform:rotate(.43turn);-ms-transform:rotate(.43turn);transform:rotate(.43turn)}.progress-pie[data-value="44"]:before{-webkit-transform:rotate(.44turn);-ms-transform:rotate(.44turn);transform:rotate(.44turn)}.progress-pie[data-value="45"]:before{-webkit-transform:rotate(.45turn);-ms-transform:rotate(.45turn);transform:rotate(.45turn)}.progress-pie[data-value="46"]:before{-webkit-transform:rotate(.46turn);-ms-transform:rotate(.46turn);transform:rotate(.46turn)}.progress-pie[data-value="47"]:before{-webkit-transform:rotate(.47turn);-ms-transform:rotate(.47turn);transform:rotate(.47turn)}.progress-pie[data-value="48"]:before{-webkit-transform:rotate(.48turn);-ms-transform:rotate(.48turn);transform:rotate(.48turn)}.progress-pie[data-value="49"]:before{-webkit-transform:rotate(.49turn);-ms-transform:rotate(.49turn);transform:rotate(.49turn)}.progress-pie[data-value="50"]:before{-webkit-transform:rotate(.5turn);-ms-transform:rotate(.5turn);transform:rotate(.5turn)}.progress-pie[data-value="51"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.01turn);-ms-transform:rotate(.01turn);transform:rotate(.01turn)}.progress-pie[data-value="52"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.02turn);-ms-transform:rotate(.02turn);transform:rotate(.02turn)}.progress-pie[data-value="53"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.03turn);-ms-transform:rotate(.03turn);transform:rotate(.03turn)}.progress-pie[data-value="54"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.04turn);-ms-transform:rotate(.04turn);transform:rotate(.04turn)}.progress-pie[data-value="55"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.05turn);-ms-transform:rotate(.05turn);transform:rotate(.05turn)}.progress-pie[data-value="56"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.06turn);-ms-transform:rotate(.06turn);transform:rotate(.06turn)}.progress-pie[data-value="57"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.07turn);-ms-transform:rotate(.07turn);transform:rotate(.07turn)}.progress-pie[data-value="58"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.08turn);-ms-transform:rotate(.08turn);transform:rotate(.08turn)}.progress-pie[data-value="59"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.09turn);-ms-transform:rotate(.09turn);transform:rotate(.09turn)}.progress-pie[data-value="60"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.1turn);-ms-transform:rotate(.1turn);transform:rotate(.1turn)}.progress-pie[data-value="61"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.11turn);-ms-transform:rotate(.11turn);transform:rotate(.11turn)}.progress-pie[data-value="62"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.12turn);-ms-transform:rotate(.12turn);transform:rotate(.12turn)}.progress-pie[data-value="63"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.13turn);-ms-transform:rotate(.13turn);transform:rotate(.13turn)}.progress-pie[data-value="64"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.14turn);-ms-transform:rotate(.14turn);transform:rotate(.14turn)}.progress-pie[data-value="65"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.15turn);-ms-transform:rotate(.15turn);transform:rotate(.15turn)}.progress-pie[data-value="66"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.16turn);-ms-transform:rotate(.16turn);transform:rotate(.16turn)}.progress-pie[data-value="67"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.17turn);-ms-transform:rotate(.17turn);transform:rotate(.17turn)}.progress-pie[data-value="68"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.18turn);-ms-transform:rotate(.18turn);transform:rotate(.18turn)}.progress-pie[data-value="69"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.19turn);-ms-transform:rotate(.19turn);transform:rotate(.19turn)}.progress-pie[data-value="70"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.2turn);-ms-transform:rotate(.2turn);transform:rotate(.2turn)}.progress-pie[data-value="71"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.21turn);-ms-transform:rotate(.21turn);transform:rotate(.21turn)}.progress-pie[data-value="72"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.22turn);-ms-transform:rotate(.22turn);transform:rotate(.22turn)}.progress-pie[data-value="73"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.23turn);-ms-transform:rotate(.23turn);transform:rotate(.23turn)}.progress-pie[data-value="74"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.24turn);-ms-transform:rotate(.24turn);transform:rotate(.24turn)}.progress-pie[data-value="75"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.25turn);-ms-transform:rotate(.25turn);transform:rotate(.25turn)}.progress-pie[data-value="76"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.26turn);-ms-transform:rotate(.26turn);transform:rotate(.26turn)}.progress-pie[data-value="77"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.27turn);-ms-transform:rotate(.27turn);transform:rotate(.27turn)}.progress-pie[data-value="78"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.28turn);-ms-transform:rotate(.28turn);transform:rotate(.28turn)}.progress-pie[data-value="79"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.29turn);-ms-transform:rotate(.29turn);transform:rotate(.29turn)}.progress-pie[data-value="80"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.3turn);-ms-transform:rotate(.3turn);transform:rotate(.3turn)}.progress-pie[data-value="81"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.31turn);-ms-transform:rotate(.31turn);transform:rotate(.31turn)}.progress-pie[data-value="82"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.32turn);-ms-transform:rotate(.32turn);transform:rotate(.32turn)}.progress-pie[data-value="83"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.33turn);-ms-transform:rotate(.33turn);transform:rotate(.33turn)}.progress-pie[data-value="84"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.34turn);-ms-transform:rotate(.34turn);transform:rotate(.34turn)}.progress-pie[data-value="85"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.35turn);-ms-transform:rotate(.35turn);transform:rotate(.35turn)}.progress-pie[data-value="86"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.36turn);-ms-transform:rotate(.36turn);transform:rotate(.36turn)}.progress-pie[data-value="87"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.37turn);-ms-transform:rotate(.37turn);transform:rotate(.37turn)}.progress-pie[data-value="88"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.38turn);-ms-transform:rotate(.38turn);transform:rotate(.38turn)}.progress-pie[data-value="89"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.39turn);-ms-transform:rotate(.39turn);transform:rotate(.39turn)}.progress-pie[data-value="90"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.4turn);-ms-transform:rotate(.4turn);transform:rotate(.4turn)}.progress-pie[data-value="91"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.41turn);-ms-transform:rotate(.41turn);transform:rotate(.41turn)}.progress-pie[data-value="92"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.42turn);-ms-transform:rotate(.42turn);transform:rotate(.42turn)}.progress-pie[data-value="93"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.43turn);-ms-transform:rotate(.43turn);transform:rotate(.43turn)}.progress-pie[data-value="94"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.44turn);-ms-transform:rotate(.44turn);transform:rotate(.44turn)}.progress-pie[data-value="95"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.45turn);-ms-transform:rotate(.45turn);transform:rotate(.45turn)}.progress-pie[data-value="96"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.46turn);-ms-transform:rotate(.46turn);transform:rotate(.46turn)}.progress-pie[data-value="97"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.47turn);-ms-transform:rotate(.47turn);transform:rotate(.47turn)}.progress-pie[data-value="98"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.48turn);-ms-transform:rotate(.48turn);transform:rotate(.48turn)}.progress-pie[data-value="99"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.49turn);-ms-transform:rotate(.49turn);transform:rotate(.49turn)}.progress-pie[data-value="100"]:before{background-color:var(--interactive-accent);-webkit-transform:rotate(.5turn);-ms-transform:rotate(.5turn);transform:rotate(.5turn)}