ldez/new-manga
1
0
Fork 0
mirror of https://github.com/ld3z/new-manga.git synced 2026-11-09 21:23:45 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

add tailwind

Browse source
This commit is contained in:
ld3zian 2025-01-16 18:02:15 -07:00
parent a8b95aa752
commit 618901a871
11 changed files with 855 additions and 375 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/components/LanguageSelector.astro
View file

@ -9,8 +9,12 @@ interface Props {
const { currentLang, currentType } = Astro.props;
---
<div class="filters">
<select name="language" id="language">
<div class="flex flex-wrap gap-4">
<select
name="language"
id="language"
class="px-4 py-2 rounded-md bg-secondary text-primary border border-hover focus:border-accent focus:outline-none focus:ring-1 focus:ring-accent transition-colors"
>
{availableLanguages.map(lang => (
<option value={lang} selected={lang === currentLang}>
{getLanguageName(lang)}
@ -18,7 +22,11 @@ const { currentLang, currentType } = Astro.props;
))}
</select>
<select name="contentType" id="contentType">
<select
name="contentType"
id="contentType"
class="px-4 py-2 rounded-md bg-secondary text-primary border border-hover focus:border-accent focus:outline-none focus:ring-1 focus:ring-accent transition-colors"
>
{availableContentTypes.map(type => (
<option value={type} selected={type === currentType}>
{type.toUpperCase()}
@ -39,25 +47,4 @@ const { currentLang, currentType } = Astro.props;
langSelect.addEventListener('change', updateURL);
typeSelect.addEventListener('change', updateURL);
</script>
<style>
.filters {
display: flex;
gap: 1rem;
margin-bottom: 2rem;
}
select {
padding: 0.5rem 1rem;
border-radius: 4px;
background: var(--bg-secondary);
color: var(--text-color);
border: 1px solid var(--bg-hover);
}
select:focus {
outline: none;
border-color: rgb(var(--accent));
}
</style>
</script>