Skip to content

Commit

Permalink
Merge pull request #39 from askdkc/add-dark-mode
Browse files Browse the repository at this point in the history
Add Dark Mode
  • Loading branch information
askdkc authored Dec 22, 2022
2 parents 2293677 + 8c27cb9 commit 6ecc671
Showing 1 changed file with 14 additions and 14 deletions.
28 changes: 14 additions & 14 deletions resources/views/livewire/tailwindcss/csv-importer.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@
<div class="pointer-events-none fixed inset-y-0 right-0 flex max-w-full pl-10 sm:pl-16">
<div class="pointer-events-auto w-screen max-w-md">
<form wire:submit.prevent="import" class="flex h-full flex-col divide-y divide-gray-200 bg-white shadow-xl overflow-y-auto">
<div class="py-6 px-4 sm:px-6">
<div class="py-6 px-4 sm:px-6 dark:bg-gray-800">
<div class="flex items-center justify-between">
<h2 class="text-lg font-medium">{{ __('Import') }}</h2>
<h2 class="text-lg font-medium dark:text-gray-300">{{ __('Import') }}</h2>
<div class="ml-3 flex h-7 items-center">
<button type="button" class="rounded-md text-indigo-200 hover:text-indigo-300 focus:outline-none focus:ring-2 focus:ring-white" wire:click="toggle">
<span class="sr-only">{{ __('Close panel') }}</span>
Expand All @@ -19,8 +19,8 @@
</div>
</div>
</div>
<div class="flex flex-1 flex-col justify-between">
<div class="p-4 sm:p-6">
<div class="flex flex-1 flex-col justify-between dark:bg-gray-700">
<div class="p-4 sm:p-6 dark:bg-gray-700">
<div>
<!-- File drop -->
<div class="max-w-lg flex justify-center px-6 pt-5 pb-6 border-2 border-dashed rounded-md"
Expand All @@ -44,14 +44,14 @@
<svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 24 24" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" />
</svg>
<div class="flex text-sm text-gray-600">
<label for="file" class="relative cursor-pointer bg-white rounded-md font-medium text-indigo-600 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
<div class="flex text-sm text-gray-600 dark:text-gray-300">
<label for="file" class="relative cursor-pointer bg-white dark:bg-gray-700 rounded-md font-medium text-indigo-600 dark:text-cyan-300 dark:hover:text-cyan-600 hover:text-indigo-300 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500 dark:focus-within:ring-blue-300">
<span>{{ __('Upload a file') }}</span>
<input id="file" wire:model="file" name="file" type="file" class="sr-only">
</label>
<p class="pl-1">{{ __('or drag and drop') }}</p>
<p class="pl-1 dark:text-gray-300">{{ __('or drag and drop') }}</p>
</div>
<p class="text-xs text-gray-500">
<p class="text-xs text-gray-500 dark:text-gray-300">
{{ __('CSV file up to :size', [
'size' => $fileSize,
]) }}
Expand All @@ -61,24 +61,24 @@
</div>

@error('file')
<span class="mt-2 text-red-500 font-medium text-sm">{{ $message }}</span>
<span class="mt-2 text-red-500 font-medium text-sm dark:text-red-200">{{ $message }}</span>
@enderror
<!-- End file drop -->

<!-- Column selection -->
{{-- If file uloaded --}}
@if ($fileHeaders)
<div class="mt-8">
<h2 class="font-medium">{{ __('Match columns')}}</h2>
<h2 class="font-medium dark:text-gray-200">{{ __('Match columns')}}</h2>

<div class="mt-4 space-y-5">
@foreach ($columnsToMap as $column => $value)
<div class="grid grid-cols-4 gap-4 items-start">
<label for="{{ $column }}" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2 col-span-1">
<label for="{{ $column }}" class="block text-sm font-medium text-gray-700 dark:text-gray-200 sm:mt-px sm:pt-2 col-span-1">
{{ $columnLabels[$column] ?? ucfirst(str_replace(['_', '-'], ' ', $column)) }}<span class="text-red-600 font-bold text-sm">{{ in_array('columnsToMap.' . $column, array_keys($requiredColumns)) ? '*': ''}}</span>
</label>
<div class="mt-1 sm:mt-0 sm:col-span-3">
<select wire:model.defer="columnsToMap.{{$column}}" type="text" name="{{ $column }}" id="{{ $column }}" class="max-w-lg block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
<select wire:model.defer="columnsToMap.{{$column}}" type="text" name="{{ $column }}" id="{{ $column }}" class="max-w-lg block w-full dark:bg-gray-700 dark:text-white shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
<option value="">{{ __('Select a column or keep if not required') }}</option>
@foreach ($fileHeaders as $fileHeader)
<option value="{{$fileHeader}}">{{ $fileHeader }}</option>
Expand All @@ -103,8 +103,8 @@
<livewire:handle-imports :model="$model"/>
</div>

<div class="flex flex-shrink-0 justify-end px-4 py-4">
<button type="submit" class="ml-4 inline-flex justify-center rounded-md border border-transparent bg-indigo-600 py-2 px-4 text-sm font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-50" {{ $fileRowCount === 0 ? 'disabled': ''}}>{{ __('Import') }}</button>
<div class="flex flex-shrink-0 justify-end px-4 py-4 dark:bg-gray-800">
<button type="submit" class="ml-4 inline-flex justify-center rounded-md border border-transparent bg-indigo-600 py-2 px-4 text-sm font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-50 dark:bg-indigo-700 dark:text-white dark:hover:text-blue-300" {{ $fileRowCount === 0 ? 'disabled': ''}}>{{ __('Import') }}</button>
</div>
</form>
</div>
Expand Down

0 comments on commit 6ecc671

Please sign in to comment.