Astrobabes/style.css at main · 1b4tis/Astrobabes · GitHub

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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
body{
    font-family: "Jaro", serif;
    background-color: #FAFAFA;
    border-collapse: collapse;
    margin:0; /*-- removes the  extra space in the border colour */
}
/* ---------Navigation bar styles  ---------  */
header{
    display: flex; /* Use flexbox for alignment , make the list stay horizantal */
    justify-content: space-between;
    align-items: center;
    padding: 1% ;
    background-color: #212D61;
    color: #EAF1F2;
}
img:hover {
    transform: rotate(25deg); /*Rotate*/
    transition: transform 0.3s ease; /*tansition in the rotation*/
}
 .navbar li{
    display: inline-block; /*Makes the list horizantal */
    list-style-type: none; /* Removes dots in the list */
    padding: 0px 20px; /*0 at the top and 20 left and right*/
    font-family: "Century Gothic", "Geneva", "AppleGothic", sans-serif;
}
.navbar ul{
    margin:0;
}
.navbar li:hover {
    transform: rotate(45deg); /*Rotate*/
    transition: transform 0.3s ease; /*tansition in the rotation*/
}
.header_title {
    font-family: 'Space Theme', sans-serif;
}
.container{
    padding: 30px; /* so that there is space  */
    padding: 90px;
}
.message {
    font-family: 'New X Digital tfb', sans-serif;
    font-size: 24px;
    color: #212D61;
    text-align: center;
}
 /*.todo_Title{
    text-align: center;
    font-family: "Century Gothic", "Geneva", "AppleGothic", sans-serif;
}
  */
.tasklist-body{
    align-items: center;
    display: flex; /** center the stuff*/
}
.task-category { /**Selection option*/
    font-size: 24px;
    background-color: #FAFAFA;
    appearance: none;
    border: 0px solid #CACED1;
    padding-left: 20px;
    color: #868688;
}
.tasklist-body input{ /**input text**/
    font-size: 35px ;
    text-align: center;
    padding:15px 0;
    border: none;
    flex: 1;
    background-color: #FAFAFA;
}
.tasklist-body img{ /*make the image be surronded by a circle */
    cursor: pointer ;
    border-radius:30px ;
    height: 20px ; /** rounds the corners */
    width: 20px;
    padding: 10px;
    background: #EAF1F2;;
}
p{
    padding: 15px;
    font-family: 'New X Digital tfb', sans-serif;
    font-size: 24px;
    color: #212D61;
    text-align: center;
}
ul li{
    list-style-type: none; /**remove the dot  */
    font-size: 24px;
    border-radius: 20px;
    padding: 20px;
    font-family: Arial;
    colour: #EAF1F2;
}
.task-items li{
    align-items: center;
    display: flex;
    list-style: none;
    background-color: #212D61;
    margin-bottom: 10px;
    border-radius: 5px;
    colour: #EAF1F2;
}
input[type ="checkbox"]{ /** chancge the style for checkbox*/
    transform: scale(2.5);
    margin-right:15px ; /** ads space between the values */
}
.task-items span {/* adds space btwen the text */
    flex-grow: 0.5; /*  */
}
.delete-button{
    transform: scale(2.5);
    background : #EAF1F2;
    margin-left:15px ; /** ads space between the values */
    border: none;
}
.delete-button:hover{
    color: #C32F27;
    font-weight: bold ;
}
.notes{
    font-family: 'New X Digital tfb', sans-serif;
    color: #212D61;
   /* font-family: "Century Gothic", "Geneva", "AppleGothic", sans-serif;
    */
}
h2{
    font-size: 24px;
    font-family: Arial;
    color: #212D61;
}