Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Refactor UI Layout #120

Open
wants to merge 34 commits into
base: main
Choose a base branch
from
Open

Refactor UI Layout #120

wants to merge 34 commits into from

Conversation

imprisonedmind
Copy link

@imprisonedmind imprisonedmind commented Aug 12, 2024 •
edited
Loading

General Overhaul of main UI Layout pattern:

  • Move away from using absolute positioning.
  • Start to move away from .css files.
  • Follow component based structure && rely only on tailwindcss.

Overhaul of Side Menu:

  • Side Menu open/closes on mouse enter state.
  • Simplification.
  • Mobile Responsive.
  • No use of ToolTip.

Update to Preferences:

  • Wrapper components to control sub list elements.
  • Chevron animates clockwise instead of anti clockwise.
    • Closed state is 0deg rightwards facing.
    • Open state is 90deg downwards facing.
  • Custom component for password inputs.
  • Custom component for color information.

Other:

  • Custom loading + spinner component.

// notes

  • SideMenu needs some extra TLC in terms of centering of icons when associated text is hidden. not 100% correct yet!

imprisonedmind and others added 13 commits August 12, 2024 18:18
@imprisonedmind
Add automatic tailwind class Sorting
0c35574
@imprisonedmind
Add package-lock.json with tailwind class sorting plugin
4a985ac
@imprisonedmind
Overhaul side-menu: Enabled mobile top navigation. Automatic expansio…
e070141 
…n with mouse enter. Use component pattern. Remove .css files
@imprisonedmind
css changes for side menu && provider.
5643c83
@imprisonedmind
add TOS side menu item
43d1294
@imprisonedmind
Overhaul preferences: Stop using absolute as main layout pattern, Use…
b192f55 
… component based patterns, Remove css reffs, Correct chevron expand animation to animate over the right not left. Add default styling wrappers for sub elements.
@imprisonedmind
add custom loading spinner.
e4caac9
@imprisonedmind
Custom text input for password entry fields.
242c830
@imprisonedmind
Adjusts for new main layout pattern.
ee26717
@imprisonedmind
Starting tooltip css removal
97fe38f
@imprisonedmind
Adjust side menu for better feeling.
354a132
@imprisonedmind
fit with of content on larger screens for information container in co…
9f26e3b 
…lours section.
@imprisonedmind
update TODO
fbb6c2a
@imprisonedmind imprisonedmind changed the title Refactor UI layout Refactor UI Layout Aug 12, 2024
@megascatterbomb
Copy link
Contributor

Tooltips are supposed to appear when hovering over these icons, but they don't appear to work.

image

There's also still a scrollbar for the entire player history page, which partially occludes either the search bar or the bottommost result in the archive.

image

Other than that, it's looking good!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@imprisonedmind @megascatterbomb