antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-13 07:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

tested theming

Browse Source
This commit is contained in:
Anton Tranelis 2025-03-20 22:50:46 +00:00
parent 50e88ee146
commit a4574baf45
4 changed files with 116 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
src/Components/AppShell/NavBar.tsx
View File

@ -100,6 +100,116 @@ export default function NavBar({ appName }: { appName: string }) {
</div>
</div>
<div className='tw:dropdown tw:mr-2'>
<div tabIndex={0} role='button' className='tw:btn tw:m-1'>
Theme
<svg
width='12px'
height='12px'
className='tw:inline-block tw:h-2 tw:w-2 tw:fill-current tw:opacity-60'
xmlns='http://www.w3.org/2000/svg'
viewBox='0 0 2048 2048'
>
<path d='M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z'></path>
</svg>
</div>
<ul
tabIndex={0}
className='tw:dropdown-content tw:bg-base-300 tw:rounded-box tw:z-1 tw:w-52 tw:p-2 tw:shadow-2xl'
>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Default'
value='default'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Dark'
value='dark'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Light'
value='light'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Retro'
value='retro'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Cyberpunk'
value='cyberpunk'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Valentine'
value='valentine'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Aqua'
value='aqua'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Caramellatte'
value='caramellatte'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Abyss'
value='abyss'
/>
</li>
<li>
<input
type='radio'
name='theme-dropdown'
className='theme-controller tw:btn tw:btn-sm tw:btn-block tw:btn-ghost tw:justify-start'
aria-label='Silk'
value='silk'
/>
</li>
</ul>
</div>
{isAuthenticated ? (
<div className='tw:flex tw:mr-2'>
<Link
@ -130,14 +240,13 @@ export default function NavBar({ appName }: { appName: string }) {
<Link to={'/user-settings'}>Settings</Link>
</li>
<li>
<Link
to={'/'}
<a
onClick={() => {
void onLogout()
}}
>
Logout
</Link>
</a>
</li>
</ul>
</div>

2
src/Components/Map/Subcomponents/Controls/SearchControl.tsx
View File

@ -118,7 +118,7 @@ export const SearchControl = () => {
placeholder='search ...'
autoComplete='off'
value={value}
className='tw:input tw:input-bordered tw:h-12 tw:grow tw:shadow-xl tw:rounded-lg tw:pr-12 tw:w-69'
className='tw:input tw:input-bordered tw:h-12 tw:grow tw:shadow-xl tw:rounded-box tw:pr-12 tw:w-69'
ref={searchInput}
onChange={(e) => setValue(e.target.value)}
onFocus={() => {

4
src/assets/css/leaflet.css
View File

@ -22,7 +22,7 @@
.leaflet-popup-content-wrapper, .leaflet-popup-tip{
background-color: var(--color-base-100);
color: var(--color-base-content);
border-radius: var(--radius-box);
}
.leaflet-tooltip {
@ -32,7 +32,7 @@
}
.leaflet-tooltip {
border-radius: 1em;
border-radius: var(--radius-box);
transition: opacity 500ms;
transition-delay: 50ms;
}

2
src/assets/css/tailwind.css
View File

@ -1,6 +1,6 @@
@import 'tailwindcss' prefix(tw);
@plugin "daisyui" {
themes: light --default, dark --prefersdark, cupcake, retro;
themes: light --default, dark --prefersdark, valentine, retro, aqua, cyberpunk, caramellatte, abyss, silk;
};
@theme {