fix: resolve compiler conflict in providers.ts, inline style in PrintableReport and implement mobile responsiveness

This commit is contained in:
2026-06-23 17:16:51 +00:00
parent d194dbf383
commit f14a8b0528
4 changed files with 7 additions and 10 deletions
+5 -5
View File
@@ -33,7 +33,7 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
const confidence = report?.confidence || 0;
return (
<div className="animate-fade-in w-full max-w-[210mm] mx-auto bg-white dark:bg-slate-900 shadow-xl print:shadow-none print:m-0 print:p-[8mm_12mm] p-[8mm] sm:p-[10mm_12mm] relative flex flex-col justify-between text-slate-800 dark:text-slate-200 border border-slate-200 dark:border-slate-800 rounded-lg print:rounded-none h-auto">
<div className="animate-fade-in w-full max-w-[210mm] mx-auto bg-white dark:bg-slate-900 shadow-xl print:shadow-none print:m-0 print:p-[8mm_12mm] p-4 sm:p-6 md:p-8 relative flex flex-col justify-between text-slate-800 dark:text-slate-200 border border-slate-200 dark:border-slate-800 rounded-lg print:rounded-none h-auto">
{/* Cabeçalho (Header) */}
<header className="border-b border-slate-100 dark:border-slate-800 pb-2.5">
@@ -137,8 +137,8 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
2. Propriedades Mecânicas
</h3>
<div className="flex-grow border border-slate-100 dark:border-slate-800/60 rounded-xl overflow-hidden bg-white dark:bg-slate-900 shadow-[0_2px_10px_-3px_rgba(6,81,237,0.05)] flex flex-col justify-between">
<div className="overflow-hidden">
<table className="w-full table-fixed text-left border-collapse text-xs">
<div className="overflow-x-auto min-w-0 w-full scrollbar-none">
<table className="w-full min-w-[320px] sm:min-w-0 table-fixed text-left border-collapse text-xs">
<thead>
<tr className="bg-slate-50/80 dark:bg-slate-800/40 border-b border-slate-50 dark:border-slate-800/60 text-[9px] text-slate-500 dark:text-slate-400 font-bold uppercase tracking-wider">
<th className="py-0.5 px-1 w-[35%]">Propriedade</th>
@@ -191,8 +191,8 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
3. Composição Química (%)
</h3>
<div className="flex-grow border border-slate-100 dark:border-slate-800/60 rounded-xl overflow-hidden bg-white dark:bg-slate-900 shadow-[0_2px_10px_-3px_rgba(6,81,237,0.05)] flex flex-col justify-start">
<div className="overflow-hidden">
<table className="w-full table-fixed text-left border-collapse text-xs">
<div className="overflow-x-auto min-w-0 w-full scrollbar-none">
<table className="w-full min-w-[320px] sm:min-w-0 table-fixed text-left border-collapse text-xs">
<thead>
<tr className="bg-slate-50/80 dark:bg-slate-800/40 border-b border-slate-50 dark:border-slate-800/60 text-[9px] text-slate-500 dark:text-slate-400 font-bold uppercase tracking-wider">
<th className="py-0.5 px-1.5 w-[15%]">Elem.</th>