Skip to content

Commit 30b0753

Browse files
committed
chore: Publish 1.0.0
1 parent de73299 commit 30b0753

7 files changed

Lines changed: 129 additions & 389 deletions

File tree

src/assets/img/ds-header-2.png

733 KB
Loading

src/assets/img/ds-header.png

572 KB
Loading

src/img/gpth-logo.svg

Lines changed: 0 additions & 265 deletions
This file was deleted.

src/popup/popup.html

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -29,31 +29,27 @@
2929
<div class="changelog">
3030
<header class="changelog__header">
3131
<h1>
32-
<a
32+
<!-- <a
3333
class="changelog__logo"
3434
href="https://github.com/itsmartashub/DeepStyled"
3535
target="_blank"
3636
rel="noopener noreferrer"
3737
>
3838
<img
39-
src="../img/deepstyled-logo.svg"
39+
src="../assets/img/deepstyled-logo.svg"
4040
alt="DeepStyled logo"
4141
/>
4242
<span><strong>Deep</strong>Styled</span>
43-
</a>
44-
<a
45-
class="changelog__version"
46-
href="https://github.com/itsmartashub/DeepStyled/releases/tag/v1.0.0"
47-
target="_blank"
48-
rel="noopener noreferrer"
49-
>
50-
v1.0.0
51-
</a>
43+
</a> -->
44+
<span class="changelog__version"> v1.0.0 </span>
5245
</h1>
5346
</header>
5447

5548
<!-- <main class="changelog__changes">
56-
<h2>LATEST RELEASE</h2>
49+
<h2 style="text-align: center">
50+
WELCOME 👋 <br />
51+
Hope you have a great day!
52+
</h2>
5753
</main> -->
5854

5955
<footer class="changelog__footer">
@@ -62,14 +58,14 @@ <h2>LATEST RELEASE</h2>
6258
target="_blank"
6359
rel="noopener noreferrer"
6460
>
65-
<code>GitHub</code>
61+
<code>🐈‍⬛ GitHub</code>
6662
</a>
6763
</footer>
6864
</div>
6965

66+
<!-- <div class="bg-circle"></div>
7067
<div class="bg-circle"></div>
71-
<div class="bg-circle"></div>
72-
<div class="bg-circle"></div>
68+
<div class="bg-circle"></div> -->
7369

7470
<script
7571
type="module"

src/popup/scss/global/_base.scss

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,16 @@ body {
55
font-optical-sizing: auto;
66
font-style: normal;
77
font-size: 0.92rem;
8-
width: 25rem;
8+
width: 35rem;
99
line-height: 1.45;
10+
background-image: url(../../assets/img/ds-header.png);
11+
background-repeat: no-repeat;
12+
background-position: center;
13+
background-size: cover;
14+
background-attachment: fixed;
15+
overflow-x: hidden;
16+
height: 20rem;
17+
// width: 100%;
1018
}
1119

1220
::-webkit-scrollbar {
Lines changed: 109 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -1,60 +1,26 @@
11
.changelog {
22
display: grid;
3+
align-content: space-between;
34
gap: 1rem;
45
position: relative;
5-
6-
ul {
7-
list-style-type: none;
8-
padding: 0.5rem;
9-
padding-left: 1.5rem;
10-
margin-bottom: 1rem;
11-
12-
li {
13-
padding: 0.2rem 0;
14-
position: relative;
15-
16-
// Add custom bullets using pseudo-elements
17-
&::before {
18-
content: ''; // Bullet character
19-
position: absolute;
20-
color: $accent; // Your custom color
21-
font-size: 1.2em; // Adjust size if needed
22-
line-height: 1;
23-
left: -0.8em; // Adjust position to align bullets
24-
}
25-
}
26-
27-
code {
28-
color: $accent;
29-
font-weight: 500;
30-
padding: .1rem .3rem;
31-
border-radius: .4rem;
32-
background-color: rgba($accent, 0.2);
33-
}
34-
}
6+
min-height: 100%;
357

368
h2,
379
strong {
3810
color: $accent;
3911
}
4012

41-
42-
4313
&__header,
4414
&__footer {
4515
position: sticky;
4616
z-index: 10;
4717
padding: 1rem 0 0.5rem 0;
48-
18+
height: fit-content;
4919
}
5020

5121
&__header {
5222
top: 0;
53-
// background-color: rgba($bg, 0.1);
54-
// backdrop-filter: blur(1rem);
55-
56-
background: linear-gradient(180deg, rgba($bg, 1) 70%, rgba($bg, 0.6));
57-
box-shadow: 0 10px 20px 20px rgba($bg, 0.6);
23+
background: linear-gradient(180deg, rgba($bg, 1) 0%, rgba($bg, 0) 100%) no-repeat;
5824

5925
h1 {
6026
display: flex;
@@ -64,26 +30,24 @@
6430
}
6531
}
6632

67-
&__logo {
68-
--img-size: 2.8rem;
69-
display: flex;
70-
align-items: center;
71-
gap: 1rem;
72-
font-weight: 500;
73-
background-image: linear-gradient(135deg, $accent 30%, rgba($accent, 0.5));
74-
-webkit-background-clip: text;
75-
-webkit-text-fill-color: transparent;
76-
background-clip: text;
77-
text-fill-color: transparent;
78-
transition: all 0.25s ease-in-out;
79-
80-
img {
81-
width: var(--img-size);
82-
aspect-ratio: 1/1;
83-
}
33+
&__footer {
34+
bottom: 0;
35+
text-align: center;
36+
background: linear-gradient(to bottom, rgba($bg, 0) 0%, rgba($bg, 1) 100%) no-repeat;
8437

85-
&:hover {
86-
gap: 0.8rem;
38+
a {
39+
// background-image: $bg-gradient;
40+
background-color: $accent;
41+
color: $on-accent;
42+
border-radius: 0.5rem;
43+
padding: 0.2rem 0.5rem;
44+
font-weight: bold;
45+
transition: .3s ease-in-out;
46+
47+
&:hover {
48+
background-color: rgba($accent, .2);
49+
color: $accent;
50+
}
8751
}
8852
}
8953

@@ -102,57 +66,94 @@
10266
}
10367
}
10468

105-
&__changes {
106-
padding: 1rem;
69+
// ul {
70+
// list-style-type: none;
71+
// padding: 0.5rem;
72+
// padding-left: 1.5rem;
73+
// margin-bottom: 1rem;
74+
75+
// li {
76+
// padding: 0.2rem 0;
77+
// position: relative;
78+
79+
// // Add custom bullets using pseudo-elements
80+
// &::before {
81+
// content: '•'; // Bullet character
82+
// position: absolute;
83+
// color: $accent; // Your custom color
84+
// font-size: 1.2em; // Adjust size if needed
85+
// line-height: 1;
86+
// left: -0.8em; // Adjust position to align bullets
87+
// }
88+
// }
89+
90+
// code {
91+
// color: $accent;
92+
// font-weight: 500;
93+
// padding: .1rem .3rem;
94+
// border-radius: .4rem;
95+
// background-color: rgba($accent, 0.2);
96+
// }
97+
// }
98+
99+
100+
// &__logo {
101+
// --img-size: 2.8rem;
102+
// display: flex;
103+
// align-items: center;
104+
// gap: 1rem;
105+
// font-weight: 500;
106+
// background-image: linear-gradient(135deg, $accent 30%, rgba($accent, 0.5));
107+
// -webkit-background-clip: text;
108+
// -webkit-text-fill-color: transparent;
109+
// background-clip: text;
110+
// text-fill-color: transparent;
111+
// transition: all 0.25s ease-in-out;
112+
113+
// img {
114+
// width: var(--img-size);
115+
// aspect-ratio: 1/1;
116+
// }
117+
118+
// &:hover {
119+
// gap: 0.8rem;
120+
// }
121+
// }
122+
123+
124+
125+
// &__changes {
126+
// padding: 1rem;
127+
128+
// h2 {
129+
// margin-bottom: 1.5rem;
130+
// }
131+
132+
// h3 {
133+
// font-size: 1.5em;
134+
// margin-bottom: 0.2rem;
135+
// }
136+
137+
// p {
138+
// text-align: center
139+
// }
140+
141+
// a {
142+
// @extend %link_hover_underlined;
143+
// color: $accent !important;
144+
// }
145+
// }
146+
147+
// &__seefullchangelog {
148+
// display: inline-block;
149+
// text-transform: uppercase;
150+
// }
151+
152+
// p:has(>.changelog__seefullchangelog) {
153+
// &:not(&:last-child) {
154+
// margin-bottom: 4rem;
155+
// }
156+
// }
107157

108-
h2 {
109-
margin-bottom: 1.5rem;
110-
}
111-
112-
h3 {
113-
font-size: 1.5em;
114-
margin-bottom: 0.2rem;
115-
}
116158

117-
p {
118-
text-align: center
119-
}
120-
121-
a {
122-
@extend %link_hover_underlined;
123-
color: $accent !important;
124-
}
125-
}
126-
127-
&__seefullchangelog {
128-
display: inline-block;
129-
text-transform: uppercase;
130-
}
131-
132-
p:has(>.changelog__seefullchangelog) {
133-
&:not(&:last-child) {
134-
margin-bottom: 4rem;
135-
}
136-
}
137-
138-
&__footer {
139-
bottom: 0;
140-
text-align: center;
141-
background: linear-gradient(to bottom, rgba($bg, 0.1), rgba($bg, 1) 75%);
142-
143-
a {
144-
// background-image: $bg-gradient;
145-
background-color: $accent;
146-
color: $on-accent;
147-
border-radius: 0.5rem;
148-
padding: 0.2rem 0.5rem;
149-
font-weight: bold;
150-
transition: .3s ease-in-out;
151-
152-
&:hover {
153-
background-color: rgba($accent, .2);
154-
color: $accent;
155-
}
156-
}
157-
}
158159
}

0 commit comments

Comments
 (0)