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.

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

feat(cloud-ui): add initial flowbite dashboard layout #5

Merged
merged 6 commits into from
Nov 20, 2024

Conversation

pmig
Copy link
Member

@pmig pmig commented Nov 19, 2024

No description provided.

Signed-off-by: Philip Miglinci <pmig@glasskube.com>
@pmig pmig requested review from christophenne and kosmoz and removed request for christophenne November 19, 2024 16:01
Copy link
Member

@kosmoz kosmoz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we should set up eslint or prettier as well

frontend/cloud-ui/src/app/app.component.ts Outdated Show resolved Hide resolved
<div id="alert-new-feature" class="p-4 bg-gray-50 rounded-lg dark:bg-gray-700" role="alert">
<div class="flex justify-between items-center mb-3">
<span class="bg-primary-100 text-primary-600 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-primary-600 dark:text-primary-200">New plugin</span>
<button type="button" class="inline-flex p-1 w-6 h-6 text-gray-500 bg-gray-50 rounded-lg focus:ring-2 focus:ring-gray-400 hover:bg-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white" data-dismiss-target="#alert-new-feature" aria-label="Close">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should avoid using dom manipulating libraries as much as possible and use angular instead.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I will create a follow-pr introducing angular flowbite

<span class="bg-primary-100 text-primary-600 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-primary-600 dark:text-primary-200">New plugin</span>
<button type="button" class="inline-flex p-1 w-6 h-6 text-gray-500 bg-gray-50 rounded-lg focus:ring-2 focus:ring-gray-400 hover:bg-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white" data-dismiss-target="#alert-new-feature" aria-label="Close">
<span class="sr-only">Dismiss</span>
<svg aria-hidden="true" class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should we maybe at least use an icon library or something? it's really frustrating to review code with all of these embedded svgs

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The flowbite Icons don't support angular / web components - I would also ditch these icon, if we migrate away after initial PoC - for now copy pasting icons from here "works" https://flowbite.com/icons/

pmig and others added 5 commits November 20, 2024 10:43
Co-authored-by: Jakob Steiner <kosmoz@users.noreply.github.com>
Signed-off-by: Philip Miglinci <pmig@glasskube.com>
Signed-off-by: Philip Miglinci <pmig@glasskube.com>
Signed-off-by: Philip Miglinci <pmig@glasskube.com>
Signed-off-by: Philip Miglinci <pmig@glasskube.com>
@pmig pmig requested a review from kosmoz November 20, 2024 11:13
@pmig pmig changed the title feat(cloud-ui): add initial flowbite layout feat(cloud-ui): add initial flowbite dashboard layout Nov 20, 2024
@kosmoz kosmoz merged commit e6916fc into main Nov 20, 2024
@kosmoz kosmoz deleted the pmig/initial-layout branch November 27, 2024 15:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants