CatNote/styles.css at main · shatadip/CatNote · 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
@import url('https://fonts.googleapis.com/css2?family=Tsukimi+Rounded:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@400;700&display=swap');
body {
    transition: background-color 0.3s ease;
    font-family: 'Comic Neue', cursive;
    max-width: 450px; /* Set a max width for better presentation */
    min-width: 450px; /* Set a min width for better presentation */
    width:450px;
    max-height:600px;
    margin: 0 auto; /* Center the content */
    padding:2%;
    /* padding-bottom: 10px; */
}
#headText {
    font-family: 'Tsukimi Rounded', sans-serif;
    font-weight: 500;
    letter-spacing: 0.08rem;
}
/* Dark mode styles */
body.dark-mode {
    background-color: #1a1a1a;
    #headText, .mt-custom-tags {
color: #fff;
}
}
.custom-width-99-percent {
    width: 99%;
}
.custom-style-filters-01 {
    padding: 0.2rem 0;
    margin-bottom: -1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
}
/* starred strikethrough clear */
.btn-pressed {
    background-color: #4a5568; /* Change to the color you want for the pressed state */
    color: #ffffff; /* Change to the text color you want for the pressed state */
    padding: 1px 4px;
    border-radius: 3px;

}

/* Note styles */
.note {
    background-color: #333;
    color: #fff;
    border: 1px solid #555;
}

.handle {
    cursor: grab;
}

.handle-container {
    cursor: grab;
}

.dragging .handle {
    cursor: grabbing;
}


.btn:hover {
    transform: scale(1.1); /* Adjust the scale factor as needed */
    transition: transform 0.3s ease; /* Adjust the duration and timing function as needed */
}

.btn:active {
    transform: scale(0.9); /* Adjust the scale factor as needed */
    transition: transform 0.1s ease; /* Adjust the duration and timing function as needed */
}
.completed {
    text-decoration: line-through;
}
.btn-favorite {
    color: #d4af37; /* Golden color FFD700 */
}