sergio/saladeaula.digital
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

form black

Browse Source
This commit is contained in:
Sérgio Rafael Siqueira
2025-03-18 23:07:37 -03:00
parent bc8a763112
commit bc8b9805e3
4 changed files with 14 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
eduseg/src/components/Card.tsx
View File

@@ -2,7 +2,7 @@ import clsx from "clsx";
interface CardProps { interface CardProps {
children: React.ReactNode; children: React.ReactNode;
color?: "gradient" | "darker" | "yellow"; color?: "gradient" | "darker" | "yellow" | "zinc";
className?: string | undefined; className?: string | undefined;
} }
@@ -11,13 +11,15 @@ export function Card({ children, color = "gradient", className }: CardProps) {
gradient: "bg-linear-to-tr from-green-secondary to-yellow-primary", gradient: "bg-linear-to-tr from-green-secondary to-yellow-primary",
darker: "bg-green-primary text-white", darker: "bg-green-primary text-white",
yellow: "text-green-primary bg-yellow-tertiary", yellow: "text-green-primary bg-yellow-tertiary",
zinc: "text-white bg-zinc-900",
}; };
return ( return (
<div <div
className={clsx( className={clsx(
"lg:rounded-2xl p-3 xl:p-10", "lg:rounded-2xl",
"lg:drop-shadow-sm", "lg:drop-shadow-sm",
"p-3 lg:p-12",
colorVariants[color], colorVariants[color],
className, className,
)} )}

8
eduseg/src/components/Form.tsx
View File

@@ -35,10 +35,10 @@ export function Form() {
className="flex flex-col gap-3 lg:gap-6" className="flex flex-col gap-3 lg:gap-6"
> >
{formState.isSubmitSuccessful && ( {formState.isSubmitSuccessful && (
<p className="bg-green-700 text-white p-2.5 rounded-lg">OK!</p> <p className="bg-green-700 text-white p-3 rounded-lg">OK!</p>
)} )}
<div className="grid lg:grid-cols-2 gap-2.5 lg:gap-5"> <div className="grid lg:grid-cols-2 gap-3 lg:gap-6">
<label> <label>
Nome Nome
<Input {...register("name")} /> <Input {...register("name")} />
@@ -56,7 +56,7 @@ export function Form() {
<button <button
type="submit" type="submit"
className="font-medium bg-green-secondary hover:bg-green-support p-2.5 rounded-lg transition cursor-pointer h-12" className="font-medium bg-green-secondary hover:text-black hover:bg-green-support p-3 rounded-lg transition cursor-pointer h-12"
> >
Quero um orçamento Quero um orçamento
</button> </button>
@@ -72,7 +72,7 @@ interface IInput extends React.HTMLAttributes<HTMLElement> {
export function Input({ as = "input", className, ...props }: IInput) { export function Input({ as = "input", className, ...props }: IInput) {
return createElement(as, { return createElement(as, {
className: clsx( className: clsx(
"border border-gray-300 focus:border-green-secondary focus:ring ring-green-secondary bg-white p-2.5 rounded-lg w-full outline-none", "border border-transparent focus:border-green-secondary focus:ring ring-green-secondary text-white bg-black p-3 rounded-lg w-full outline-none",
className, className,
), ),
...props, ...props,

8
eduseg/src/layouts/Layout.astro
View File

@@ -20,7 +20,7 @@ import {
</head> </head>
<body> <body>
<Container className="flex items-center py-3 max-lg:px-3"> <Container className="flex items-center p-3">
<Logo className="h-8" /> <Logo className="h-8" />
<div class="ml-auto"> <div class="ml-auto">
@@ -32,7 +32,7 @@ import {
</Container> </Container>
<section class="bg-lime-400 sticky top-0 z-10"> <section class="bg-lime-400 sticky top-0 z-10">
<Container className="flex items-center py-3 max-lg:px-3"> <Container className="flex items-center p-3">
<div class="flex gap-1.5 lg:gap-3 items-center"> <div class="flex gap-1.5 lg:gap-3 items-center">
<div class="bg-black p-1.5 lg:p-3 rounded-lg lg:rounded-xl"> <div class="bg-black p-1.5 lg:p-3 rounded-lg lg:rounded-xl">
<AcademicCapIcon className="w-5 fill-lime-400" /> <AcademicCapIcon className="w-5 fill-lime-400" />
@@ -42,7 +42,7 @@ import {
<div class="text-black truncate max-lg:max-w-36"> <div class="text-black truncate max-lg:max-w-36">
NR-18 PEMT Plataforma Móvel de Trabalho Aéreo NR-18 PEMT Plataforma Móvel de Trabalho Aéreo
</div> </div>
<Select client:load /> <!-- <Select client:load /> -->
</div> </div>
</div> </div>
@@ -58,7 +58,7 @@ import {
<slot /> <slot />
<footer class="bg-stone-900 py-3 lg:py-10 max-lg:px-3"> <footer class="bg-stone-900 p-3 lg:py-10">
<Container className="space-y-5"> <Container className="space-y-5">
<div class="space-y-1"> <div class="space-y-1">
<Logo className="h-10" /> <Logo className="h-10" />

4
eduseg/src/pages/index.astro
View File

@@ -7,7 +7,7 @@ import Layout from "@layouts/Layout.astro";
--- ---
<Layout> <Layout>
<Container className="lg:space-y-5"> <Container className="lg:space-y-5 lg:p-3">
<!-- <div class="max-lg:px-5"> <!-- <div class="max-lg:px-5">
<Bookmark className="h-96" /> <Bookmark className="h-96" />
</div> --> </div> -->
@@ -69,7 +69,7 @@ import Layout from "@layouts/Layout.astro";
</div> </div>
</div> </div>
<Card color="yellow" className="rounded-xl p-4"> <Card color="zinc" className="rounded-xl p-4">
<Form client:load /> <Form client:load />
</Card> </Card>
</section> </section>