Skip to content

Commit 84f9d09

Browse files
Create style.css
Aaand a new stylesheet for KittyTasker! I think it looks pretty good! More coming soon! Right now though, I have books to binge.
1 parent ac3abc2 commit 84f9d09

1 file changed

Lines changed: 79 additions & 0 deletions

File tree

style.css

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/*
2+
* KittyTasker Stylesheet
3+
* Basic styling for the KittyTasker to-do list app!
4+
*/
5+
6+
/* Reset and Base Styles */
7+
* {
8+
margin: 0;
9+
padding: 0;
10+
box-sizing: border-box;
11+
}
12+
13+
body {
14+
font-family: Poiret One;
15+
line-height: 2;
16+
color: #2c2c2c;
17+
background-color: #fbe4e4;
18+
min-height: 100vh;
19+
padding: 20px 15px;
20+
}
21+
22+
/* Typography */
23+
h1, h2, h3 {
24+
font-family: Lobster;
25+
color: #533B4D;
26+
}
27+
28+
/* App Container */
29+
.app-container {
30+
max-width: 600px;
31+
margin: 0 auto;
32+
}
33+
34+
/* Header */
35+
.app-header {
36+
text-align: center;
37+
margin-bottom: 25px;
38+
}
39+
40+
.app-title {
41+
font-size: 32px;
42+
font-weight: 700;
43+
color: #A53860;
44+
margin-bottom: 5px;
45+
}
46+
47+
.app-subtitle {
48+
color: #F564A9;
49+
font-weight: 600;
50+
font-size: 16px;
51+
}
52+
53+
/* Main Card*/
54+
.main-card {
55+
background-color: white;
56+
border-radius: 10%;
57+
box-shadow: 0 25px 25px rgba(0, 0, 0, 0.07);
58+
overflow: hidden;
59+
}
60+
61+
/* Form Section Basic Styling */
62+
.task-form-container {
63+
padding: 25px;
64+
background: linear-gradient(to right, #FFD6BA, #FFE8CD);
65+
}
66+
67+
/* Task Section Basic Styling */
68+
.tasks-container {
69+
padding: 25px;
70+
background: linear-gradient(to right, #FFE8CD, #FFDCDC);
71+
}
72+
73+
/* Footer */
74+
.app-footer {
75+
margin-top: 25px;
76+
color: #EF88AD;
77+
font-size: 14px;
78+
font-weight: 600;
79+
}

0 commit comments

Comments
 (0)