feat: Add multi-language support (i18n)
Languages supported (8): - English (en) - 日本語 (ja) - Deutsch (de) - Français (fr) - Español (es) - 简体中文 (zh-CN) - 繁體中文 (zh-TW) - 한국어 (ko) Changes: - Add locale column to users table - Add SetLocale middleware for automatic locale detection - Add LocaleController for language switching - Create language files with translations for all UI elements - Add language selector to user profile page - Update all Blade views to use translation strings
This commit is contained in:
@@ -15,7 +15,7 @@
|
||||
<!-- Header -->
|
||||
<div class="mb-6 flex items-center justify-between">
|
||||
<h1 class="text-3xl font-bold text-gray-900">
|
||||
{{ $isEditMode ? 'Edit Document' : 'New Document' }}
|
||||
{{ $isEditMode ? __('messages.documents.edit_document') : __('messages.documents.new_document') }}
|
||||
</h1>
|
||||
|
||||
<div class="flex space-x-3">
|
||||
@@ -24,22 +24,22 @@
|
||||
href="{{ route('documents.show', $document) }}"
|
||||
class="inline-flex items-center px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"
|
||||
>
|
||||
Cancel
|
||||
{{ __('messages.common.cancel') }}
|
||||
</a>
|
||||
|
||||
<button
|
||||
wire:click="delete"
|
||||
wire:confirm="Are you sure you want to delete this document?"
|
||||
wire:confirm="{{ __('messages.documents.delete_confirm') }}"
|
||||
class="inline-flex items-center px-4 py-2 border border-red-300 rounded-md text-sm font-medium text-red-700 bg-white hover:bg-red-50"
|
||||
>
|
||||
Delete
|
||||
{{ __('messages.documents.delete') }}
|
||||
</button>
|
||||
@else
|
||||
<a
|
||||
href="{{ route('documents.show', 'home') }}"
|
||||
class="inline-flex items-center px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"
|
||||
>
|
||||
Cancel
|
||||
{{ __('messages.common.cancel') }}
|
||||
</a>
|
||||
@endif
|
||||
|
||||
@@ -50,7 +50,7 @@ class="inline-flex items-center px-4 py-2 bg-indigo-600 border border-transparen
|
||||
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-3m-1 4l-3 3m0 0l-3-3m3 3V4"></path>
|
||||
</svg>
|
||||
Save
|
||||
{{ __('messages.documents.save') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -60,27 +60,27 @@ class="inline-flex items-center px-4 py-2 bg-indigo-600 border border-transparen
|
||||
<!-- Title -->
|
||||
<div>
|
||||
<label for="title" class="block text-sm font-medium text-gray-700 mb-2">
|
||||
Title
|
||||
{{ __('messages.documents.title_label') }}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="title"
|
||||
wire:model="title"
|
||||
class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500"
|
||||
placeholder="Document Title (use / for folders, e.g. Laravel/Livewire/Components)"
|
||||
placeholder="{{ __('messages.documents.title_placeholder') }}"
|
||||
>
|
||||
@error('title')
|
||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
||||
@enderror
|
||||
<p class="mt-1 text-xs text-gray-500">
|
||||
Tip: Use slashes (/) in the title to organize documents into folders automatically
|
||||
{{ __('messages.documents.title_hint') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Markdown Editor -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">
|
||||
Content
|
||||
{{ __('messages.documents.content_label') }}
|
||||
</label>
|
||||
<div wire:ignore>
|
||||
<div x-data="markdownEditor()" x-init="initEditor()">
|
||||
@@ -103,12 +103,12 @@ class="w-full"
|
||||
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
||||
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
|
||||
</svg>
|
||||
Saving...
|
||||
{{ __('messages.documents.saving') }}
|
||||
</div>
|
||||
|
||||
@if($isEditMode && $document)
|
||||
<div>
|
||||
Path: <code class="text-xs bg-gray-100 px-2 py-1 rounded">{{ $document->path }}</code>
|
||||
{{ __('messages.documents.path') }}: <code class="text-xs bg-gray-100 px-2 py-1 rounded">{{ $document->path }}</code>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@@ -137,7 +137,7 @@ class="w-full"
|
||||
autosave: {
|
||||
enabled: false,
|
||||
},
|
||||
placeholder: 'Write your markdown here...',
|
||||
placeholder: '{{ __("messages.documents.content_placeholder") }}',
|
||||
toolbar: [
|
||||
'bold', 'italic', 'heading', '|',
|
||||
'quote', 'unordered-list', 'ordered-list', '|',
|
||||
@@ -148,9 +148,7 @@ class="w-full"
|
||||
status: ['lines', 'words', 'cursor'],
|
||||
});
|
||||
|
||||
// エディタの変更をLivewireに反映
|
||||
this.editor.codemirror.on('change', () => {
|
||||
// wire:ignoreの外にあるhidden inputを探す
|
||||
const formElement = this.$el.closest('form');
|
||||
const hiddenInput = formElement.querySelector('input[type="hidden"][wire\\:model="content"]');
|
||||
if (hiddenInput) {
|
||||
|
||||
@@ -14,7 +14,7 @@ class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-
|
||||
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"></path>
|
||||
</svg>
|
||||
Edit
|
||||
{{ __('messages.documents.edit') }}
|
||||
</a>
|
||||
@endauth
|
||||
</div>
|
||||
@@ -22,12 +22,12 @@ class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-
|
||||
<div class="flex items-center text-sm text-gray-500 space-x-4">
|
||||
@if($document->created_by)
|
||||
<span>
|
||||
Created by {{ $document->creator->name }}
|
||||
{{ __('messages.documents.created_by') }} {{ $document->creator->name }}
|
||||
</span>
|
||||
@endif
|
||||
|
||||
<span>
|
||||
Updated {{ $document->updated_at->diffForHumans() }}
|
||||
{{ __('messages.documents.updated') }} {{ $document->updated_at->diffForHumans() }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -41,7 +41,7 @@ class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-
|
||||
@if(count($backlinks) > 0)
|
||||
<div class="border-t border-gray-200 pt-8">
|
||||
<h2 class="text-xl font-semibold text-gray-900 mb-4">
|
||||
Linked References
|
||||
{{ __('messages.documents.linked_references') }}
|
||||
</h2>
|
||||
|
||||
<div class="space-y-3">
|
||||
@@ -69,11 +69,11 @@ class="block p-4 bg-gray-50 rounded-lg hover:bg-gray-100 transition"
|
||||
<div class="mt-12 pt-8 border-t border-gray-200">
|
||||
<div class="grid grid-cols-2 gap-4 text-sm text-gray-500">
|
||||
<div>
|
||||
<span class="font-medium">Path:</span>
|
||||
<span class="font-medium">{{ __('messages.documents.path') }}:</span>
|
||||
<code class="ml-2 text-xs bg-gray-100 px-2 py-1 rounded">{{ $document->path }}</code>
|
||||
</div>
|
||||
<div>
|
||||
<span class="font-medium">Last modified:</span>
|
||||
<span class="font-medium">{{ __('messages.documents.last_modified') }}:</span>
|
||||
<span class="ml-2">{{ $document->updated_at->format('Y-m-d H:i:s') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -51,7 +51,7 @@ class="w-full max-w-2xl bg-white rounded-lg shadow-2xl"
|
||||
type="text"
|
||||
wire:model.live="search"
|
||||
class="w-full pl-10 pr-4 py-3 border-0 focus:ring-0 text-lg"
|
||||
placeholder="Search documents..."
|
||||
placeholder="{{ __('messages.quick_switcher.placeholder') }}"
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
@@ -61,7 +61,7 @@ class="w-full pl-10 pr-4 py-3 border-0 focus:ring-0 text-lg"
|
||||
<div class="max-h-96 overflow-y-auto">
|
||||
@if(empty($this->results))
|
||||
<div class="p-8 text-center text-gray-500">
|
||||
No documents found
|
||||
{{ __('messages.quick_switcher.no_results') }}
|
||||
</div>
|
||||
@else
|
||||
<ul class="divide-y divide-gray-200">
|
||||
@@ -109,15 +109,15 @@ class="block px-4 py-3 hover:bg-gray-50 transition {{ $index === $selectedIndex
|
||||
<span class="flex items-center">
|
||||
<kbd class="px-2 py-1 bg-white border border-gray-300 rounded text-xs font-semibold mr-1">↑</kbd>
|
||||
<kbd class="px-2 py-1 bg-white border border-gray-300 rounded text-xs font-semibold mr-2">↓</kbd>
|
||||
to navigate
|
||||
{{ __('messages.quick_switcher.navigate') }}
|
||||
</span>
|
||||
<span class="flex items-center">
|
||||
<kbd class="px-2 py-1 bg-white border border-gray-300 rounded text-xs font-semibold mr-2">↵</kbd>
|
||||
to select
|
||||
{{ __('messages.quick_switcher.select') }}
|
||||
</span>
|
||||
<span class="flex items-center">
|
||||
<kbd class="px-2 py-1 bg-white border border-gray-300 rounded text-xs font-semibold mr-2">esc</kbd>
|
||||
to close
|
||||
{{ __('messages.quick_switcher.close') }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<div class="p-4" x-data="sidebarState()" x-init="initExpandedFolders()">
|
||||
<div class="mb-4">
|
||||
<h2 class="text-sm font-semibold text-gray-700 uppercase tracking-wider">
|
||||
Documents
|
||||
{{ __('messages.documents.title') }}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
@if(empty($tree))
|
||||
<div class="text-sm text-gray-500 italic">
|
||||
No documents found
|
||||
{{ __('messages.documents.no_documents') }}
|
||||
</div>
|
||||
@else
|
||||
<div class="space-y-1">
|
||||
@@ -24,7 +24,7 @@ class="flex items-center justify-center px-4 py-2 text-sm font-medium text-white
|
||||
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
|
||||
</svg>
|
||||
New Document
|
||||
{{ __('messages.documents.new_document') }}
|
||||
</a>
|
||||
</div>
|
||||
@endauth
|
||||
|
||||
Reference in New Issue
Block a user