PandaDEV/Qopy
1
0
Fork 0
mirror of https://github.com/0PandaDEV/Qopy.git synced 2025-04-22 05:34:04 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: serach function now async which is way faster

Browse source
This commit is contained in:
pandadev 2025-03-15 17:44:14 +01:00
parent ae878b7203
commit f435a7b20a
No known key found for this signature in database
GPG key ID: C39629DACB8E762F
14 changed files with 203 additions and 106 deletions
Download patch file Download diff file Expand all files Collapse all files

235
assets/css/settings.scss
View file

@ -1,235 +0,0 @@
$primary: #2e2d2b;
$accent: #feb453;
$divider: #ffffff0d;
$text: #e5dfd5;
$text2: #ada9a1;
$mutedtext: #78756f;
main {
width: 100vw;
height: 100vh;
background-color: $primary;
border: 1px solid $divider;
display: flex;
flex-direction: column;
border-radius: 12px;
justify-content: space-between;
}
.back {
position: absolute;
top: 16px;
left: 16px;
display: flex;
gap: 8px;
align-items: center;
img {
background-color: $divider;
border-radius: 6px;
padding: 8px 6px;
}
p {
color: $text2;
}
}
p {
font-family: SFRoundedMedium;
}
.settings-container {
width: 100%;
height: 100%;
margin-top: 26px;
position: relative;
font-size: 12px;
font-family: SFRoundedMedium;
.settings {
position: absolute;
left: 50%;
transform: translateX(-50%);
margin-left: -26px;
display: flex;
gap: 24px;
.names {
display: flex;
flex-direction: column;
gap: 16px;
p {
font-family: SFRoundedSemiBold;
color: $text2;
display: flex;
justify-content: right;
}
}
.actions {
display: flex;
flex-direction: column;
gap: 16px;
color: $mutedtext;
}
}
}
.launch {
display: flex;
align-items: center;
gap: 6px;
input[type="checkbox"] {
appearance: none;
width: 14px;
height: 14px;
background-color: transparent;
border-radius: 5px;
border: 1px solid $mutedtext;
position: relative;
cursor: pointer;
transition: background-color 0.2s;
&:checked {
~ .checkmark {
opacity: 1;
}
}
}
.checkmark {
height: 14px;
width: 14px;
position: absolute;
opacity: 0;
transition: opacity 0.2s;
}
p {
color: $text2;
}
}
.keybind-input {
width: min-content;
white-space: nowrap;
padding: 6px;
border: 1px solid $divider;
color: $text2;
display: flex;
border-radius: 10px;
outline: none;
gap: 4px;
.key {
color: $text2;
font-family: SFRoundedMedium;
background-color: $divider;
padding: 2px 6px;
border-radius: 6px;
font-size: 14px;
}
}
.keybind-input:focus {
border: 1px solid rgba(255, 255, 255, 0.2);
}
.empty-keybind {
border-color: rgba(255, 82, 82, 0.298);
}
.top-bar {
width: 100%;
min-height: 56px;
border-bottom: 1px solid $divider;
}
.bottom-bar {
height: 40px;
width: calc(100vw - 2px);
backdrop-filter: blur(18px);
background-color: hsla(40, 3%, 16%, 0.8);
position: fixed;
bottom: 1px;
left: 1px;
z-index: 100;
border-radius: 0 0 12px 12px;
display: flex;
flex-direction: row;
justify-content: space-between;
padding-inline: 12px;
padding-right: 6px;
padding-top: 1px;
align-items: center;
font-size: 14px;
border-top: 1px solid $divider;
p {
color: $text2;
}
.left {
display: flex;
align-items: center;
gap: 8px;
.logo {
width: 18px;
height: 18px;
}
}
.right {
display: flex;
align-items: center;
.actions div {
display: flex;
align-items: center;
gap: 2px;
}
.divider {
width: 2px;
height: 12px;
background-color: $divider;
margin-left: 8px;
margin-right: 4px;
transition: all 0.2s;
}
.actions {
padding: 4px;
padding-left: 8px;
display: flex;
align-items: center;
gap: 8px;
border-radius: 7px;
background-color: transparent;
transition: all 0.2s;
cursor: pointer;
p {
color: $text;
}
&.disabled {
pointer-events: none;
opacity: 0.5;
}
}
.actions:hover {
background-color: $divider;
}
&:hover .actions:hover ~ .divider {
opacity: 0;
}
}
}