eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

UI/UX improvements (#146)

Browse Source 
* Some initial changes

* New project cards

* Version

* Finalize improvements

* Fixed styling issues on versions page

* Removed light mode

* Run linter

* Added mixpanel stuff in context menus

* Fix styling issues

* Fix windows

* homepage fixes

* Finishing touches on mac styling

* Fixed windows related styling

* Update global.scss

---------

Co-authored-by: Jai A <jaiagr+gpg@pm.me>
This commit is contained in:
Adrian O.V
2023-06-20 00:09:03 -04:00
committed by GitHub
parent 1e78a7b6a8
commit bd697a02f5
25 changed files with 985 additions and 491 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
theseus_gui/src/assets/icons/arrow-left-right.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-left-right"><path d="M8 3 4 7l4 4"/><path d="M4 7h16"/><path d="m16 21 4-4-4-4"/><path d="M20 17H4"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 315 B

4
theseus_gui/src/assets/icons/index.js Normal file
View File

@@ -0,0 +1,4 @@
export { default as ServerIcon } from './server.svg'
export { default as MinimizeIcon } from './minimize.svg'
export { default as MaximizeIcon } from './maximize.svg'
export { default as SwapIcon } from './arrow-left-right.svg'

1
theseus_gui/src/assets/icons/maximize.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-scaling"><path d="M21 3 9 15"/><path d="M12 3H3v18h18v-9"/><path d="M16 3h5v5"/><path d="M14 15H9v-5"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 311 B

1
theseus_gui/src/assets/icons/minimize.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-minus"><line x1="5" x2="19" y1="12" y2="12"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 253 B

1
theseus_gui/src/assets/icons/server.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-server"><rect width="20" height="8" x="2" y="2" rx="2" ry="2"/><rect width="20" height="8" x="2" y="14" rx="2" ry="2"/><line x1="6" x2="6.01" y1="6" y2="6"/><line x1="6" x2="6.01" y1="18" y2="18"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 405 B

68
theseus_gui/src/assets/stylesheets/global.scss
View File

@@ -53,3 +53,71 @@ input {
gap: 1rem;
color: var(--color-contrast);
}
.badge {
display: flex;
border-radius: var(--radius-md);
white-space: nowrap;
align-items: center;
background-color: var(--color-bg);
padding-block: var(--gap-sm);
padding-inline: var(--gap-lg);
width: min-content;
svg {
width: 1.1rem;
height: 1.1rem;
margin-right: 0.5rem;
}
&.featured {
background-color: var(--color-brand-highlight);
color: var(--color-contrast);
}
}
.mac {
.nav-container {
padding-top: calc(var(--gap-md) + 1.75rem);
}
.account-card {
top: calc(var(--gap-md) + 1.75rem);
}
}
.windows {
.window-controls {
display: flex !important;
}
.info-card {
right: 8rem;
}
.profile-card {
right: 8rem;
}
}
* {
scrollbar-width: auto;
scrollbar-color: var(--color-button-bg) var(--color-bg);
}
/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: var(--gap-md);
border: 3px solid var(--color-bg);
}
*::-webkit-scrollbar-track {
background: var(--color-bg);
border: 3px solid var(--color-bg);
}
*::-webkit-scrollbar-thumb {
background-color: var(--color-button-bg);
border-radius: var(--radius-lg);
border: 3px solid var(--color-bg);
}