VSinerva/freesewing
1
0
Fork 0
Code Activity

fix(dev): Put theme picker in navbar on mobile

Browse source
This commit is contained in:
Joost De Cock 2022-06-09 17:23:12 +02:00
parent 3e9ea6b1ec
commit 337a1e9f8c
2 changed files with 8 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

13
packages/freesewing.dev/components/header.js
View file

@ -1,5 +1,5 @@
import { useState, useEffect } from 'react' import { useState, useEffect } from 'react'
import Logo from 'shared/components/logos/freesewing.js' import FreeSewingIcon from 'shared/components/icons/freesewing.js'
import Link from 'next/link' import Link from 'next/link'
import ThemePicker from 'shared/components/theme-picker.js' import ThemePicker from 'shared/components/theme-picker.js'
import CloseIcon from 'shared/components/icons/close.js' import CloseIcon from 'shared/components/icons/close.js'
@ -81,10 +81,11 @@ const Header = ({ app, setSearch }) => {
) )
} }
</button> </button>
<div className="flex flex-row gap-2 md:hidden"> <div className="flex flex-row items-center md:hidden pr-4">
<button className="btn btn-sm btn h-12 px-12" onClick={() => setSearch(true)}> <button onClick={() => setSearch(true)} className="btn btn-sm">
<SearchIcon /> <SearchIcon />
</button> </button>
<ThemePicker app={app} iconOnly />
</div> </div>
<button className={` <button className={`
btn btn-sm h-12 btn btn-sm h-12
@ -103,12 +104,12 @@ const Header = ({ app, setSearch }) => {
<div className="hidden md:flex md:flex-row gap-2"> <div className="hidden md:flex md:flex-row gap-2">
<Link href="/"> <Link href="/">
<a className="flex flex-column items-center"> <a className="flex flex-column items-center">
<Logo size={36} fill="currentColor" stroke={false} /> <FreeSewingIcon className="h-10 w-10"/>
</a> </a>
</Link> </Link>
<Link href="/"> <Link href="/">
<a role="button" className="btn btn-link btn-sm text-neutral-content h-12"> <a role="button" className="btn btn-link btn-sm text-neutral-content h-12 font-normal lowercase text-2xl">
freesewing.dev <span className="font-black px-1 normal-case">FreeSewing</span>.dev
</a> </a>
</Link> </Link>
</div> </div>

3
packages/freesewing.dev/components/layouts/docs.js
View file

@ -5,7 +5,6 @@ import Link from 'next/link'
import Logo from 'shared/components/logos/freesewing.js' import Logo from 'shared/components/logos/freesewing.js'
import Aside from 'shared/components/navigation/aside' import Aside from 'shared/components/navigation/aside'
import get from 'lodash.get' import get from 'lodash.get'
import ThemePicker from 'shared/components/theme-picker'
const PageTitle = ({ app, slug, title }) => { const PageTitle = ({ app, slug, title }) => {
if (title) return <h1>{title}</h1> if (title) return <h1>{title}</h1>
@ -60,7 +59,7 @@ const DefaultLayout = ({ app, title=false, children=[] }) => {
return ( return (
<div className="m-auto flex flex-row justify-center"> <div className="m-auto flex flex-row justify-center">
<Aside app={app} slug={slug} before={<ThemePicker app={app}/>}/> <Aside app={app} slug={slug} />
<section className="py-28 md:py-36"> <section className="py-28 md:py-36">
<div> <div>
{title && ( {title && (