Skip to content

Commit 6ba80cd

Browse files
OStefan2001OStefan2001
committed
new style
1 parent 3e4d7d0 commit 6ba80cd

9 files changed

Lines changed: 209 additions & 214 deletions

File tree

‎config/autoload/app.global.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<?php
22

33
declare(strict_types=1);
4-
$baseUrl = 'https://light-blog.localhost/';
4+
$baseUrl = 'https://new.dotkernel.com/';
55
$app = [
6-
'baseUrl' => 'https://light-blog.localhost/',
6+
'baseUrl' => $baseUrl,
77
'name' => 'Dotkernel Light | PSR-15 compliant application',
88
'meta' => [
99
'title' => 'Dotkernel Light',

‎public/css/app.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App/assets/scss/components/_general.scss‎

Lines changed: 95 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -1,97 +1,89 @@
1+
:root {
2+
--color-text: #1F2937;
3+
--color-text-muted: #6B7280;
4+
--color-primary: #4F46E5;
5+
--color-primary-hover: #4338CA;
6+
--color-accent: #E11D48;
7+
--color-border: #E5E7EB;
8+
--color-bg: #F8F9FB;
9+
--color-surface: #FFFFFF;
10+
--font-heading: 'Montserrat', sans-serif;
11+
--font-body: 'Source Sans Pro', sans-serif;
12+
--radius: 10px;
13+
--transition: all 0.2s ease;
14+
}
15+
116
html,
217
body {
318
height: 100%;
419
}
520

621
body {
7-
font-family: 'Source Sans Pro', sans-serif;
22+
font-family: var(--font-body);
823
font-size: 16px;
9-
line-height: 1.3em;
10-
font-weight: 300;
11-
}
12-
13-
h1,
14-
.h1 {
15-
font-size: 40px;
16-
font-family: 'Montserrat', sans-serif;
17-
font-weight: 200;
18-
color: #2C2C2C;
19-
}
20-
21-
h2,
22-
.h2 {
23-
font-size: 32px;
24-
font-family: 'Montserrat', sans-serif;
25-
font-weight: 200;
26-
color: #2C2C2C;
27-
}
28-
29-
h3,
30-
.h3 {
31-
font-size: 24px;
32-
font-family: 'Montserrat', sans-serif;
33-
font-weight: 200;
34-
color: #2C2C2C;
35-
}
36-
37-
h4,
38-
.h4 {
39-
font-size: 20px;
40-
font-family: 'Montserrat', sans-serif;
41-
font-weight: 200;
42-
color: #2C2C2C;
43-
}
44-
45-
h5,
46-
.h5 {
47-
font-size: 18px;
48-
font-family: 'Montserrat', sans-serif;
49-
font-weight: 200;
50-
color: #2C2C2C;
51-
}
52-
53-
h6,
54-
.h6 {
55-
font-size: 16px;
56-
font-family: 'Montserrat', sans-serif;
57-
font-weight: 200;
58-
color: #2C2C2C;
59-
}
24+
line-height: 1.6;
25+
font-weight: 400;
26+
color: var(--color-text);
27+
background: var(--color-bg);
28+
-webkit-font-smoothing: antialiased;
29+
}
30+
31+
h1, .h1,
32+
h2, .h2,
33+
h3, .h3,
34+
h4, .h4,
35+
h5, .h5,
36+
h6, .h6 {
37+
font-family: var(--font-heading);
38+
font-weight: 600;
39+
color: var(--color-text);
40+
letter-spacing: -0.02em;
41+
line-height: 1.25;
42+
}
43+
44+
h1, .h1 { font-size: 2.5rem; font-weight: 700; }
45+
h2, .h2 { font-size: 2rem; }
46+
h3, .h3 { font-size: 1.5rem; }
47+
h4, .h4 { font-size: 1.25rem; }
48+
h5, .h5 { font-size: 1.125rem; }
49+
h6, .h6 { font-size: 1rem; }
6050

6151
a {
62-
color: #555ec4;
63-
font-family: 'Source Sans Pro', sans-serif;
64-
font-weight: 300;
52+
color: var(--color-primary);
53+
font-family: var(--font-body);
54+
font-weight: 500;
55+
text-decoration: none;
56+
transition: var(--transition);
6557
}
6658

6759
a:hover {
68-
color: #C60B31;
60+
color: var(--color-accent);
6961
}
7062

7163
p {
72-
color: #B1B1B1;
73-
font-family: 'Source Sans Pro', sans-serif;
74-
font-weight: 300;
64+
color: var(--color-text-muted);
65+
font-family: var(--font-body);
66+
font-weight: 400;
7567
}
7668

7769
label {
78-
color: #B1B1B1;
70+
color: var(--color-text-muted);
71+
font-weight: 500;
7972
}
8073

8174
#wrapper {
8275
min-height: 100%;
8376
height: auto !important;
84-
height: 100%;
8577
margin: 0 auto -115px;
86-
background: #F5F5F5;
78+
background: var(--color-bg);
8779
}
8880

8981
.navbar {
9082
margin-bottom: 0;
91-
border-radius: 0;
92-
background-color: #FFFFFF;
83+
background-color: var(--color-surface);
9384
border: 0;
94-
border-bottom: 1px solid #F6F6F6;
85+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
86+
padding: 14px 0;
9587

9688
.navbar-brand {
9789
img {
@@ -102,7 +94,7 @@ label {
10294
}
10395
}
10496

105-
@media (max-width: 767px){
97+
@media (max-width: 767px) {
10698
.navbar {
10799
.navbar-collapse {
108100
margin-top: 10px;
@@ -115,40 +107,35 @@ label {
115107
}
116108
}
117109

118-
.content-header {
119-
}
120-
121-
.user-form {
122-
.content {
123-
padding-top: 80px;
124-
padding-bottom: 50px;
125-
}
126-
}
127-
128-
#push,
129-
.app-footer {
110+
.app-footer,
111+
#push {
130112
height: 115px;
131113
}
132114

133115
.app-footer {
134116
padding: 30px 50px;
135-
background: #F9F9F9;
117+
background: var(--color-surface);
118+
border-top: 1px solid var(--color-border);
136119

137120
p {
138121
margin-bottom: 0;
139122
font-size: 14px;
123+
color: var(--color-text-muted);
140124
}
141125

142126
.enjoy {
143127
margin-bottom: 5px;
144-
font-size: 20px;
145-
color: #3B3B3B;
146-
font-family: 'Montserrat', sans-serif;
147-
font-weight: 200;
128+
font-size: 1.25rem;
129+
color: var(--color-text);
130+
font-family: var(--font-heading);
131+
font-weight: 600;
148132
}
149133
}
150134

151135
.alert {
136+
border: none;
137+
border-radius: var(--radius);
138+
152139
ul {
153140
display: block;
154141
margin: 0;
@@ -157,22 +144,37 @@ label {
157144
}
158145

159146
input {
160-
padding: 15px 15px;
161-
background: #FFFFFF;
162-
border-radius: 2px;
163-
border: 1px solid #E7E7E7;
147+
padding: 12px 16px;
148+
background: var(--color-surface);
149+
border-radius: var(--radius);
150+
border: 1px solid var(--color-border);
164151
font-size: 16px;
165-
line-height: 50px;
152+
line-height: 1.4;
166153
height: 50px;
167154
width: 100%;
155+
transition: var(--transition);
156+
}
157+
158+
input:focus {
159+
outline: none;
160+
border-color: var(--color-primary);
161+
box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
168162
}
169163

170164
input[type="submit"] {
171-
padding-top: 0;
172-
padding-bottom: 0;
173165
height: 50px;
174-
border-radius: 2px;
175-
background: #C60B31;
176-
border-color: #C60B31;
166+
border-radius: var(--radius);
167+
background: var(--color-primary);
168+
border-color: var(--color-primary);
177169
color: #FFFFFF;
170+
font-weight: 600;
171+
cursor: pointer;
172+
transition: var(--transition);
178173
}
174+
175+
input[type="submit"]:hover {
176+
background: var(--color-primary-hover);
177+
border-color: var(--color-primary-hover);
178+
transform: translateY(-1px);
179+
box-shadow: 0 4px 12px rgba(79, 70, 229, 0.25);
180+
}

0 commit comments

Comments
 (0)