yadunut/clan-core
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

UI/fonts: migrate all text-* classes

Browse Source
This commit is contained in:
Johannes Kirschbauer
2024-11-19 15:33:30 +01:00
parent 78dbeb6276
commit eecd39b24a
14 changed files with 37 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pkgs/webview-ui/app/src/Form/fields/Select.tsx
View File

@@ -219,7 +219,7 @@ export function SelectInput(props: SelectInputpProps) {
<span class="label-text text-neutral">{props.helperText}</span>
)}
{props.error && (
<span class="label-text-alt font-bold text-error">
<span class="label-text-alt font-bold text-error-700">
{props.error}
</span>
)}

4
pkgs/webview-ui/app/src/Form/fields/TextInput.tsx
View File

@@ -60,7 +60,9 @@ export function TextInput(props: TextInputProps) {
<span class="label-text text-neutral">{props.helperText}</span>
)}
{props.error && (
<span class="label-text-alt font-bold text-error">{props.error}</span>
<span class="label-text-alt font-bold text-error-700">
{props.error}
</span>
)}
</div>
</label>

16
pkgs/webview-ui/app/src/Form/form/index.tsx
View File

@@ -132,7 +132,7 @@ interface UnsupportedProps {
const Unsupported = (props: UnsupportedProps) => (
<div>
{props.error && <div class="font-bold text-error">{props.error}</div>}
{props.error && <div class="font-bold text-error-700">{props.error}</div>}
<span>
Invalid or unsupported schema entry of type:{" "}
<b>{JSON.stringify(props.schema.type)}</b>
@@ -193,7 +193,7 @@ export function StringField<T extends FieldValues, R extends ResponseData>(
props.schema.type !== "integer"
) {
return (
<span class="text-error">
<span class="text-error-700">
Error cannot render the following as String input.
<Unsupported schema={props.schema} />
</span>
@@ -339,7 +339,9 @@ interface OptionSchemaProps {
}
export function OptionSchema(props: OptionSchemaProps) {
return (
<Switch fallback={<option class="text-error">Item spec unhandled</option>}>
<Switch
fallback={<option class="text-error-700">Item spec unhandled</option>}
>
<Match when={typeof props.itemSpec === "string" && props.itemSpec}>
{(o) => <option>{o()}</option>}
</Match>
@@ -444,7 +446,7 @@ export function ArrayFields<T extends FieldValues, R extends ResponseData>(
) {
if (props.schema.type !== "array") {
return (
<span class="text-error">
<span class="text-error-700">
Error cannot render the following as array.
<Unsupported schema={props.schema} />
</span>
@@ -621,7 +623,7 @@ export function ArrayFields<T extends FieldValues, R extends ResponseData>(
</ListValueDisplay>
)}
</For>
<span class="label-text-alt font-bold text-error">
<span class="label-text-alt font-bold text-error-700">
{fieldArray.error}
</span>
@@ -703,7 +705,7 @@ export function ObjectFields<T extends FieldValues, R extends ResponseData>(
) {
if (props.schema.type !== "object") {
return (
<span class="text-error">
<span class="text-error-700">
Error cannot render the following as Object
<Unsupported schema={props.schema} />
</span>
@@ -748,7 +750,7 @@ export function ObjectFields<T extends FieldValues, R extends ResponseData>(
/>
)}
{typeof propSchema === "boolean" && (
<span class="text-error">
<span class="text-error-700">
Schema: Object of Boolean not supported
</span>
)}

4
pkgs/webview-ui/app/src/components/FileInput.tsx
View File

@@ -92,7 +92,9 @@ export function FileInput(props: FileInputProps) {
aria-errormessage={`${props.name}-error`}
/>
{props.error && (
<span class="label-text-alt font-bold text-error">{props.error}</span>
<span class="label-text-alt font-bold text-error-700">
{props.error}
</span>
)}
</div>
</div>

4
pkgs/webview-ui/app/src/components/SelectInput.tsx
View File

@@ -47,7 +47,9 @@ export function SelectInput<T extends FieldValues, R extends ResponseData>(
</select>
{props.error && (
<span class="label-text-alt font-bold text-error">{props.error}</span>
<span class="label-text-alt font-bold text-error-700">
{props.error}
</span>
)}
</label>
);

4
pkgs/webview-ui/app/src/components/TextInput.tsx
View File

@@ -63,7 +63,9 @@ export function TextInput<T extends FieldValues, R extends ResponseData>(
</Show>
</div>
{props.error && (
<span class="label-text-alt font-bold text-error">{props.error}</span>
<span class="label-text-alt font-bold text-error-700">
{props.error}
</span>
)}
</label>
);

2
pkgs/webview-ui/app/src/layout/header.tsx
View File

@@ -59,7 +59,7 @@ export const Header = (props: HeaderProps) => {
<span class="flex flex-col">
<Show when={query.data}>
{(meta) => [
<span class="text-primary">{meta().name}</span>,
<span class="text-primary-800">{meta().name}</span>,
<span class="text-neutral">{meta()?.description}</span>,
]}
</Show>

2
pkgs/webview-ui/app/src/routes/clans/create.tsx
View File

@@ -103,7 +103,7 @@ export const CreateClan = () => {
{(field, props) => (
<label class="form-control w-full">
<div class="label">
<span class="label-text block after:ml-0.5 after:text-primary after:content-['*']">
<span class="label-text block after:ml-0.5 after:text-primary-800 after:content-['*']">
Name
</span>
</div>

12
pkgs/webview-ui/app/src/routes/clans/details.tsx
View File

@@ -74,8 +74,8 @@ const EditClanForm = (props: EditClanFormProps) => {
<>
<figure class="p-1">
<div class="flex flex-col items-center">
<div class="text-3xl text-primary">{curr_name()}</div>
<div class="text-secondary">Wide settings</div>
<div class="text-3xl text-primary-800">{curr_name()}</div>
<div class="text-secondary-800">Wide settings</div>
</div>
</figure>
<figure>
@@ -100,7 +100,7 @@ const EditClanForm = (props: EditClanFormProps) => {
)}
</Field>
<div class="card-body">
<span class="text-xl text-primary">General</span>
<span class="text-xl text-primary-800">General</span>
<Field
name="name"
validate={[required("Please enter a unique name for the clan.")]}
@@ -108,7 +108,7 @@ const EditClanForm = (props: EditClanFormProps) => {
{(field, props) => (
<label class="form-control w-full">
<div class="label">
<span class="label-text block after:ml-0.5 after:text-primary after:content-['*']">
<span class="label-text block after:ml-0.5 after:text-primary-800 after:content-['*']">
Name
</span>
</div>
@@ -226,9 +226,9 @@ const AdminModuleForm = (props: AdminModuleFormProps) => {
return (
<Form onSubmit={handleSubmit}>
<div class="card-body">
<span class="text-xl text-primary">Administration</span>
<span class="text-xl text-primary-800">Administration</span>
<div class="grid grid-cols-12 gap-2">
<span class="col-span-12 text-lg text-neutral">
<span class="col-span-12 text-lg text-neutral-800">
Each of the following keys can be used to authenticate on machines
</span>
<For each={keys()}>

2
pkgs/webview-ui/app/src/routes/clans/list.tsx
View File

@@ -59,7 +59,7 @@ const ClanItem = (props: ClanItemProps) => {
return (
<div class="stat">
<div class="stat-figure text-primary">
<div class="stat-figure text-primary-800">
<div class="join">
<button
class="join-item btn-sm"

6
pkgs/webview-ui/app/src/routes/machines/details.tsx
View File

@@ -431,7 +431,7 @@ const MachineForm = (props: MachineDetailsProps) => {
</div>
</figure>
<div class="card-body">
<span class="text-xl text-primary">General</span>
<span class="text-xl text-primary-800">General</span>
{/*
<Field name="machine.tags" type="string[]">
{(field, props) => field.value}
@@ -536,14 +536,14 @@ const MachineForm = (props: MachineDetailsProps) => {
{(module) => (
<>
<div class="divider"></div>
<span class="text-xl text-primary">{module.name}</span>
<span class="text-xl text-primary-800">{module.name}</span>
{module.component}
</>
)}
</For>
<div class="divider"></div>
<span class="text-xl text-primary">Actions</span>
<span class="text-xl text-primary-800">Actions</span>
<div class="my-4 flex flex-col gap-6">
<span class="max-w-md text-neutral">
Installs the system for the first time. Used to bootstrap the remote

2
pkgs/webview-ui/app/src/routes/modules/list.tsx
View File

@@ -14,7 +14,7 @@ const ModuleListItem = (props: { name: string; info: ModuleInfo }) => {
return (
<div class="stat">
<div class="stat-figure text-primary">
<div class="stat-figure text-primary-800">
<div class="join">more</div>
</div>

2
pkgs/webview-ui/app/src/routes/welcome/index.tsx
View File

@@ -18,7 +18,7 @@ export const Welcome = () => {
Build your own
</button>
<button
class="link w-full text-right text-primary"
class="link w-full text-right text-primary-800"
onClick={async () => {
const uri = await registerClan();
if (uri) {

18
pkgs/webview-ui/app/tailwind.config.ts
View File

@@ -5,23 +5,7 @@ import core from "./tailwind/core-plugin";
/** @type {import('tailwindcss').Config} */
const config = {
content: ["./src/**/*.{js,jsx,ts,tsx}"],
theme: {
colors: {
secondary: {
50: "#f7f9f9",
100: "#e7f2f4",
200: "#d7e8ea",
300: "#afc6ca",
400: "#8fb2b6",
500: "#7b9a9e",
600: "#4f747a",
700: "#415e63",
800: "#445f64",
900: "#2b4347",
950: "#0d1415",
},
},
},
theme: {},
daisyui: {
themes: [
{