Skip to content

Commit

Permalink
Edit dark mode complete
Browse files Browse the repository at this point in the history
  • Loading branch information
luedu1103 committed Nov 29, 2024
1 parent ee7e84a commit e7fd3f9
Show file tree
Hide file tree
Showing 4 changed files with 27 additions and 29 deletions.
46 changes: 23 additions & 23 deletions app/src/pages/Dashboard/Dashboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ export const GalleryDashboard = () => {
}

return (
<div className={styles.container} style={{ backgroundColor: dark ? 'black' : 'white' }}>
<div className={styles.container} style={{ backgroundColor: dark ? '#242424' : 'white' }}>
{isSidebarOpen && (
<div
className={styles.overlay}
Expand All @@ -141,8 +141,8 @@ export const GalleryDashboard = () => {
<div
className={`${styles.sidebar} ${isSidebarOpen ? styles.sidebarOpen : ""}`}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
}}
>
<div className={styles.sidebarContent}>
Expand All @@ -152,7 +152,7 @@ export const GalleryDashboard = () => {
className={styles.sidebarButton}
onClick={() => setIsModalOpen(true)}
style={{
color: showCommunityProjects ? (dark ? 'black' : 'white') : (dark ? 'white' : 'black'),
color: showCommunityProjects ? (dark ? '#242424' : 'white') : (dark ? 'white' : '#242424'),
}}
>
<Plus className={styles.sidebarIcon} />
Expand All @@ -161,19 +161,19 @@ export const GalleryDashboard = () => {
<button
className={styles.sidebarButton}
style={{
color: showCommunityProjects ? (dark ? 'black' : 'white') : (dark ? 'white' : 'black'),
color: showCommunityProjects ? (dark ? '#242424' : 'white') : (dark ? 'white' : '#242424'),
}}
>
<Layout className={styles.sidebarIcon} style={{ color: dark ? 'white' : 'black' }} />
<Layout className={styles.sidebarIcon} style={{ color: dark ? 'white' : '#242424' }} />
<span>Desplegar Galería</span>
</button>
<button
className={styles.sidebarButton}
style={{
color: showCommunityProjects ? (dark ? 'black' : 'white') : (dark ? 'white' : 'black'),
color: showCommunityProjects ? (dark ? '#242424' : 'white') : (dark ? 'white' : '#242424'),
}}
>
<Edit className={styles.sidebarIcon} style={{ color: dark ? 'white' : 'black' }} />
<Edit className={styles.sidebarIcon} style={{ color: dark ? 'white' : '#242424' }} />
<span>Editar Galería</span>
</button>
</nav>
Expand All @@ -183,13 +183,13 @@ export const GalleryDashboard = () => {
<header
className={styles.header}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
}}
>
<div className={styles.headerContent}>
<button onClick={toggleSidebar} className={styles.menuButton}>
<Menu className={styles.menuIcon} style={{ color: dark ? 'white' : 'black' }} />
<Menu className={styles.menuIcon} style={{ color: dark ? 'white' : '#242424' }} />
<span className={styles.srOnly}>Dashboard</span>
</button>
<div style={{ display: 'flex', gap: '24px' }}>
Expand All @@ -203,15 +203,15 @@ export const GalleryDashboard = () => {
<div className={styles.profileSection}>
<h1 className={styles.profileName}>{user.displayname}</h1>
<div className={styles.searchContainer}>
<Search className={styles.searchIcon} style={{ color: dark ? 'white' : 'black' }} />
<Search className={styles.searchIcon} style={{ color: dark ? 'white' : '#242424' }} />
<input
type="search"
placeholder="¿Qué estás buscando?"
className={styles.searchInput}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
borderColor: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
borderColor: dark ? 'white' : '#242424',
}}
/>
</div>
Expand All @@ -220,7 +220,7 @@ export const GalleryDashboard = () => {
className={`${styles.filterButton} ${!showCommunityProjects ? styles.active : ''}`}
onClick={() => setShowCommunityProjects(false)}
style={{
color: showCommunityProjects ? (dark ? 'white' : 'black') : (dark ? 'black' : 'white'),
color: showCommunityProjects ? (dark ? 'white' : '#242424') : (dark ? '#242424' : 'white'),
}}
>
Mis proyectos
Expand All @@ -229,7 +229,7 @@ export const GalleryDashboard = () => {
className={`${styles.filterButton} ${showCommunityProjects ? styles.active : ''}`}
onClick={loadCommunityProjects}
style={{
color: showCommunityProjects ? (dark ? 'black' : 'white') : (dark ? 'white' : 'black'),
color: showCommunityProjects ? (dark ? '#242424' : 'white') : (dark ? 'white' : '#242424'),
}}
>
Proyectos de la comunidad
Expand All @@ -244,8 +244,8 @@ export const GalleryDashboard = () => {
key={index}
className={styles.galleryCard}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
}}
>
<img
Expand All @@ -263,8 +263,8 @@ export const GalleryDashboard = () => {
href={`/${gallery.slug}`}
className={styles.openButton}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
}}
>
Visitar
Expand All @@ -278,8 +278,8 @@ export const GalleryDashboard = () => {
key={gallery.id}
className={styles.galleryCard}
style={{
backgroundColor: dark ? 'black' : 'white',
color: dark ? 'white' : 'black',
backgroundColor: dark ? '#242424' : 'white',
color: dark ? 'white' : '#242424',
}}
>
<img
Expand Down
2 changes: 1 addition & 1 deletion app/src/pages/Dashboard/GalleryDashboard.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
gap: 0.75rem;
padding: 0.75rem;
border-radius: 0.5rem;
color: black;
color: #e4e4e4;
text-decoration: none;
border: none;
background: none;
Expand Down
5 changes: 3 additions & 2 deletions app/src/pages/Editor/components/ContentSidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -183,8 +183,9 @@ const SidebarContent = () => {
p={8}
style={{
borderRadius: 'var(--mantine-radius-md)',
backgroundColor: dark ? 'black' : '#e5e5e5',
color: dark ? '#e5e5e5' : 'black',
backgroundColor: dark ? '#333333' : '#e5e5e5',
color: dark ? '#e5e5e5' : '#333333',
border: '1px solid var(--mantine-color-gray-4)',
}}
>
<ContentMasonry filterInput={filterInput} />
Expand Down
3 changes: 0 additions & 3 deletions app/src/pages/Home/components/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,9 +30,6 @@ export const Header = () => {
const [isLoading, setIsLoading] = useState(false);
const [loginError, setLoginError] = useState('');

const { colorScheme } = useMantineColorScheme();
const dark = colorScheme === 'dark';

const handleLogin = async (e: React.FormEvent) => {
e.preventDefault();
setIsLoading(true);
Expand Down

0 comments on commit e7fd3f9

Please sign in to comment.