mirror of
https://github.com/felipegcoutinho/openmonetis.git
synced 2026-05-09 11:01:45 +00:00
style(ui): padronizar tipografia — font-medium para font-semibold
Padronização de peso tipográfico em títulos, rótulos de seção, nomes de entidades e valores monetários em toda a interface. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -34,7 +34,7 @@ export function CalculatorDisplay({
|
||||
<div className="mt-auto flex items-end justify-end gap-2">
|
||||
<div
|
||||
className={cn(
|
||||
"truncate text-right font-medium tracking-tight tabular-nums leading-none transition-all",
|
||||
"truncate text-right font-medium tracking-tight leading-none transition-all",
|
||||
isResultView ? "text-2xl" : "text-3xl",
|
||||
)}
|
||||
>
|
||||
|
||||
@@ -20,9 +20,9 @@ function MoneyValues({ amount, className, showPositiveSign = false }: Props) {
|
||||
return (
|
||||
<span
|
||||
className={cn(
|
||||
"inline-flex items-baseline transition-all duration-200 tracking-tighter",
|
||||
"inline-flex items-baseline tabular-nums transition-all duration-200 tracking-tighter",
|
||||
privacyMode &&
|
||||
"blur-[6px] select-none hover:blur-none focus-within:blur-none",
|
||||
"blur-sm select-none hover:blur-none focus-within:blur-none",
|
||||
className,
|
||||
)}
|
||||
aria-label={privacyMode ? "Valor oculto" : displayValue}
|
||||
|
||||
@@ -37,7 +37,7 @@ export default function MonthNavigation() {
|
||||
};
|
||||
|
||||
return (
|
||||
<Card className="sticky top-16 z-10 flex w-full flex-row p-4 backdrop-blur-xs supports-backdrop-filter:bg-card/80">
|
||||
<Card className="sticky top-16 z-10 flex w-full flex-row p-4 backdrop-blur-xs supports-backdrop-filter:bg-card/80 ">
|
||||
<div className="flex items-center gap-1">
|
||||
<NavigationButton
|
||||
direction="left"
|
||||
|
||||
@@ -96,7 +96,7 @@ export function FeedbackDialogBody({ onClose }: { onClose?: () => void }) {
|
||||
<Icon className={cn("h-5 w-5", item.color)} />
|
||||
</div>
|
||||
<div className="flex-1 text-left space-y-1">
|
||||
<h3 className="font-medium text-sm flex items-center gap-2">
|
||||
<h3 className="font-semibold text-sm flex items-center gap-2">
|
||||
{item.title}
|
||||
<RiExternalLinkLine className="h-3.5 w-3.5 text-muted-foreground" />
|
||||
</h3>
|
||||
|
||||
@@ -42,7 +42,7 @@ export function NavDropdown({ items }: NavDropdownProps) {
|
||||
{item.icon}
|
||||
</span>
|
||||
<span className="flex flex-col min-w-0">
|
||||
<span className="font-medium">{item.label}</span>
|
||||
<span className="font-semibold">{item.label}</span>
|
||||
{item.description && (
|
||||
<span className="text-xs text-muted-foreground truncate lowercase">
|
||||
{item.description}
|
||||
|
||||
@@ -42,7 +42,7 @@ export function NavMenu() {
|
||||
return (
|
||||
<>
|
||||
{/* Desktop */}
|
||||
<nav className="hidden md:flex items-center justify-center flex-1 ">
|
||||
<nav className="hidden md:flex items-center justify-center flex-1">
|
||||
<NavigationMenu viewport={false}>
|
||||
<NavigationMenuList className="gap-0">
|
||||
<NavigationMenuItem>
|
||||
|
||||
@@ -22,7 +22,7 @@ export function NavToolsDropdown({ onOpenCalculator }: NavToolsDropdownProps) {
|
||||
<RiCalculatorLine className="size-4" />
|
||||
</span>
|
||||
<span className="flex flex-col flex-1 text-left">
|
||||
<span className="font-medium">calculadora</span>
|
||||
<span className="font-semibold">calculadora</span>
|
||||
<span className="text-xs text-muted-foreground lowercase">
|
||||
Faça cálculos rápidos
|
||||
</span>
|
||||
@@ -39,7 +39,7 @@ export function NavToolsDropdown({ onOpenCalculator }: NavToolsDropdownProps) {
|
||||
)}
|
||||
</span>
|
||||
<span className="flex flex-col flex-1 text-left">
|
||||
<span className="font-medium">privacidade</span>
|
||||
<span className="font-semibold">privacidade</span>
|
||||
<span className="text-xs text-muted-foreground lowercase">
|
||||
Oculta valores na tela
|
||||
</span>
|
||||
|
||||
@@ -126,7 +126,9 @@ export function NavbarUser({
|
||||
>
|
||||
<RiHistoryLine className="size-4 text-muted-foreground shrink-0" />
|
||||
<span className="flex-1">Changelog</span>
|
||||
<Badge variant="outline">v{version}</Badge>
|
||||
<Badge variant="outline" className="text-xs font-semibold">
|
||||
v{version}
|
||||
</Badge>
|
||||
</Link>
|
||||
|
||||
<DialogTrigger asChild>
|
||||
@@ -147,7 +149,7 @@ export function NavbarUser({
|
||||
className={cn(itemClass, "text-success")}
|
||||
>
|
||||
<RiMegaphoneLine className="size-4 text-success shrink-0" />
|
||||
<span className="flex-1 tracking-wide text-xs font-medium">
|
||||
<span className="flex-1 tracking-wide text-xs font-bold">
|
||||
Atualização {updateCheck.latestVersion} disponível
|
||||
</span>
|
||||
</Link>
|
||||
|
||||
@@ -68,7 +68,7 @@ export function createSidebarNavData(
|
||||
.map((pagador) => ({
|
||||
title: pagador.name?.trim().length
|
||||
? pagador.name.trim()
|
||||
: "Payer sem nome",
|
||||
: "Pagador sem nome",
|
||||
url: `/payers/${pagador.id}`,
|
||||
key: pagador.canEdit ? pagador.id : `${pagador.id}-shared`,
|
||||
isShared: !pagador.canEdit,
|
||||
|
||||
@@ -9,7 +9,7 @@ export default function PageDescription({
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<h1 className="text-xl font-medium flex items-center gap-1 tracking-tight">
|
||||
<h1 className="text-2xl font-semibold flex items-center gap-1 ">
|
||||
<span className="text-primary">{icon}</span>
|
||||
{title}
|
||||
</h1>
|
||||
|
||||
@@ -89,7 +89,7 @@ export function PaymentSuccess({
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<DialogTitle className="text-xl font-medium">{title}</DialogTitle>
|
||||
<DialogTitle className="text-xl font-semibold">{title}</DialogTitle>
|
||||
<DialogDescription className="text-sm leading-relaxed">
|
||||
{description}
|
||||
</DialogDescription>
|
||||
|
||||
@@ -98,7 +98,7 @@ function AlertDialogTitle({
|
||||
return (
|
||||
<AlertDialogPrimitive.Title
|
||||
data-slot="alert-dialog-title"
|
||||
className={cn("text-lg font-medium", className)}
|
||||
className={cn("text-lg font-semibold", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -266,7 +266,7 @@ function ChartTooltipContent({
|
||||
</span>
|
||||
</div>
|
||||
{item.value !== undefined && item.value !== null && (
|
||||
<span className="text-foreground font-mono font-medium tabular-nums">
|
||||
<span className="text-foreground font-mono font-medium">
|
||||
{item.value.toLocaleString()}
|
||||
</span>
|
||||
)}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
||||
import { RiCheckLine } from "@remixicon/react";
|
||||
import { RiCheckLine, RiSubtractLine } from "@remixicon/react";
|
||||
import type * as React from "react";
|
||||
import { cn } from "@/shared/utils/ui";
|
||||
|
||||
@@ -13,7 +13,7 @@ function Checkbox({
|
||||
<CheckboxPrimitive.Root
|
||||
data-slot="checkbox"
|
||||
className={cn(
|
||||
"peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-lg border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground data-[state=indeterminate]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-lg border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
@@ -22,7 +22,8 @@ function Checkbox({
|
||||
data-slot="checkbox-indicator"
|
||||
className="grid place-content-center text-current transition-none"
|
||||
>
|
||||
<RiCheckLine className="size-3.5" />
|
||||
<RiCheckLine className="size-3.5 [[data-state=indeterminate]_&]:hidden" />
|
||||
<RiSubtractLine className="size-3.5 hidden [[data-state=indeterminate]_&]:block" />
|
||||
</CheckboxPrimitive.Indicator>
|
||||
</CheckboxPrimitive.Root>
|
||||
);
|
||||
|
||||
@@ -95,10 +95,7 @@ export const CurrencyInput = React.forwardRef<
|
||||
value={displayValue}
|
||||
onChange={handleChange}
|
||||
onBlur={onBlur}
|
||||
className={cn(
|
||||
"text-left font-medium tabular-nums tracking-tight",
|
||||
className,
|
||||
)}
|
||||
className={cn("text-left tracking-tight", className)}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
@@ -106,7 +106,7 @@ function DialogTitle({
|
||||
return (
|
||||
<DialogPrimitive.Title
|
||||
data-slot="dialog-title"
|
||||
className={cn("text-lg leading-none font-medium", className)}
|
||||
className={cn("text-lg leading-none font-semibold", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -62,7 +62,7 @@ function EmptyTitle({ className, ...props }: React.ComponentProps<"div">) {
|
||||
return (
|
||||
<div
|
||||
data-slot="empty-title"
|
||||
className={cn("text-lg font-medium tracking-tight", className)}
|
||||
className={cn("text-lg font-semibold tracking-tight", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -586,7 +586,7 @@ function SidebarMenuBadge({
|
||||
data-slot="sidebar-menu-badge"
|
||||
data-sidebar="menu-badge"
|
||||
className={cn(
|
||||
"text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none",
|
||||
"text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium select-none",
|
||||
"peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
|
||||
"peer-data-[size=sm]/menu-button:top-1",
|
||||
"peer-data-[size=default]/menu-button:top-1.5",
|
||||
|
||||
@@ -37,7 +37,7 @@ export default function WidgetCard({
|
||||
<CardHeader>
|
||||
<div className="flex w-full items-start justify-between">
|
||||
<div>
|
||||
<CardTitle className="flex items-center gap-1 tracking-tight">
|
||||
<CardTitle className="flex items-center gap-1 ">
|
||||
{icon && <span className="size-4">{icon}</span>}
|
||||
{title}
|
||||
</CardTitle>
|
||||
|
||||
Reference in New Issue
Block a user