Romain/plantes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add lang

Browse Source
This commit is contained in:
Romulus21
2022-01-22 23:00:21 +01:00
parent 021848b543
commit 62cb27c85e
18 changed files with 347 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/Plants.js
View File

@@ -3,16 +3,17 @@ import {getPicture} from "../utilities/pictures"
import {InputField, TextAreaField} from "./Form"
import {Button} from "./Button"
import {useState} from "preact/hooks"
import {Text} from "./Translation"
export const PlantThumb = ({ plant, children }) => {
return <Link href={`/plant/${plant.id}`} class="block h-48">
<div className="bg-green-400 relative rounded shadow-lg flex flex-col">
return <Link href={`/plant/${plant.id}`} class="block h-48 cursor-pointer">
<div className="group bg-primary-light relative rounded shadow-lg flex flex-col">
<img src={getPicture(plant.id)} alt="" className="object-cover h-48 w-full min-h-48 min-w-48 rounded" />
<div className="bg-green-700 text-white p-2 text-center absolute bottom-0 w-full rounded-bl rounded-br">
<div className="bg-primary group-hover:bg-primary-dark text-white p-2 text-center absolute bottom-0 w-full rounded-bl rounded-br">
{children}
</div>
<div title="Actions" className="absolute right-2 top-2 rounded-full flex justify-center items-center bg-green-700 w-6 h-6">
<div title="Actions" className="absolute right-2 top-2 rounded-full flex justify-center items-center bg-primary group-hover:bg-primary-dark w-6 h-6">
{plant.actions.length}
</div>
</div>
@@ -29,13 +30,13 @@ export const PlantForm = ({children, plant, ...props}) => {
className="mb-2 mt-5"
value={plantForm.name}
onChange={(e) => setPlantForm({ ...plantForm, name: e.target.value }) }>
Name
<Text text="Name" />
</InputField>
<TextAreaField name="description"
className="mb-5"
value={plantForm.description}
onChange={(e) => setPlantForm({ ...plantForm, description: e.target.value })}>
Description
<Text text="Description" />
</TextAreaField>
<fieldset className="mb-5 flex gap-2 max-w-[300px] mx-auto">
@@ -48,7 +49,7 @@ export const PlantForm = ({children, plant, ...props}) => {
className="sr-only peer"
/>
<label htmlFor="indoor" className="w-full block peer-checked:bg-blue-700 bg-blue-500 hover:bg-blue-700 px-2 py-1 text-center rounded border dark:border-white">
Indoor
<Text text="Indoor" />
</label>
</div>
@@ -61,7 +62,7 @@ export const PlantForm = ({children, plant, ...props}) => {
className="sr-only peer"
/>
<label htmlFor="outdoor" className="w-full block peer-checked:bg-blue-700 bg-blue-500 hover:bg-blue-700 px-2 py-1 text-center rounded border dark:border-white">
Outdoor
<Text text="Outdoor" />
</label>
</div>
</fieldset>
@@ -70,7 +71,7 @@ export const PlantForm = ({children, plant, ...props}) => {
className="mt-5"
value={plantForm.spot}
onChange={(e) => setPlantForm({ ...plantForm, spot: e.target.value }) }>
Spot
<Text text="Spot" />
</InputField>
<Button type="submit" className="block w-full mt-5 mb-2 bg-green-800 hover:bg-green-900 text-white mx-auto px-2 py-1 shadow">