adjust more the UI - final
This commit is contained in:
@ -26,7 +26,7 @@ import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
|
||||
|
||||
|
||||
export default function App({ Component, pageProps: { session, ...pageProps }, }: AppProps<{ session: Session }>) {
|
||||
console.log(pageProps);
|
||||
// console.log(pageProps);
|
||||
const router = useRouter();
|
||||
const [messages, setMessages] = useState({});
|
||||
|
||||
|
@ -40,7 +40,7 @@ const AdminTranslations = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<ProtectedRoute allowedRoles={[UserRole.ADMIN, UserRole.POWERUSER]}>
|
||||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="sticky top-0 z-10 bg-white shadow-md py-4 px-4">
|
||||
<div className="flex justify-between items-center">
|
||||
<h1 className="text-xl font-semibold leading-tight text-gray-800">Edit Translations</h1>
|
||||
@ -70,24 +70,23 @@ const AdminTranslations = () => {
|
||||
<table className="w-full text-sm text-left text-gray-500">
|
||||
<thead className="text-xs text-gray-700 uppercase bg-gray-50">
|
||||
<tr>
|
||||
<th scope="col" className="py-3 px-6">Key</th>
|
||||
<th scope="col" className="py-3 px-6">Base Translation</th>
|
||||
<th scope="col" className="py-3 px-6">Translation</th>
|
||||
<th scope="col" className="py-3 px-6 w-2/12">Key</th> {/* Adjusted width */}
|
||||
<th scope="col" className="py-3 px-6 w-3/12">Base Translation</th> {/* Adjusted width */}
|
||||
<th scope="col" className="py-3 px-6 w-7/12">Translation</th> {/* Adjusted width */}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{Object.entries(baseTranslations).map(([key, baseValue]) => (
|
||||
<tr key={key} className="bg-white border-b hover:bg-gray-50">
|
||||
<td className="py-4 px-6 font-medium text-gray-900 whitespace-nowrap">{key}</td>
|
||||
<td className="py-4 px-6 font-medium text-gray-900 whitespace-nowrap text-ellipsis">{key}</td>
|
||||
<td className="py-4 px-6">{baseValue}</td>
|
||||
<td className="py-4 px-6">
|
||||
<input
|
||||
type="text"
|
||||
<textarea
|
||||
value={translations[key] || ''}
|
||||
placeholder='Въведи превод...'
|
||||
onChange={e => handleChange(key, e.target.value)}
|
||||
className="block w-full text-base px-2 py-1 border border-gray-300 focus:ring-blue-500 focus:border-blue-500 rounded placeholder-gray-400"
|
||||
style={{ transition: 'box-shadow .3s', boxShadow: translations[key] ? '0 0 0px 1px rgba(59, 130, 246, 0.5)' : 'none' }}
|
||||
className="block w-60hv text-base px-2 py-1 border border-gray-300 focus:ring-blue-500 focus:border-blue-500 rounded placeholder-gray-400"
|
||||
style={{ width: '100%', resize: 'both', transition: 'box-shadow .3s', boxShadow: translations[key] ? '0 0 0px 1px rgba(59, 130, 246, 0.5)' : 'none' }}
|
||||
/>
|
||||
|
||||
</td>
|
||||
|
Reference in New Issue
Block a user