adminita 0.1.0__py3-none-any.whl

adminita/static/src/input.css

@@ -0,0 +1,370 @@
+/* Adminita - Django Admin Theme using Tailwind CSS v4 */
+
+@import "tailwindcss";
+
+/* Theme customization for Adminita */
+@theme {
+  /* Primary colors - Blue theme for admin */
+  --color-primary-50: #eff6ff;
+  --color-primary-100: #dbeafe;
+  --color-primary-200: #bfdbfe;
+  --color-primary-300: #93c5fd;
+  --color-primary-400: #60a5fa;
+  --color-primary-500: #3b82f6;
+  --color-primary-600: #2563eb;
+  --color-primary-700: #1d4ed8;
+  --color-primary-800: #1e40af;
+  --color-primary-900: #1e3a8a;
+  --color-primary-950: #172554;
+
+  /* Custom gray shades for better dark mode */
+  --color-gray-750: #2d3748;
+}
+
+/* Custom component styles */
+@layer components {
+
+  /* Django admin form field overrides */
+  .admin-input {
+    @apply w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors;
+  }
+
+  .admin-textarea {
+    @apply w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors min-h-24;
+  }
+
+  .admin-select {
+    @apply w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors;
+  }
+
+  .admin-checkbox {
+    @apply rounded border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500 focus:ring-offset-0;
+  }
+
+  .admin-radio {
+    @apply border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500 focus:ring-offset-0;
+  }
+
+  .admin-link {
+    @apply text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-300 underline transition-colors;
+  }
+
+  .admin-btn-primary {
+    @apply inline-flex items-center px-6 py-2.5 bg-primary-600 hover:bg-primary-700 text-white rounded-lg font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500;
+  }
+
+  .admin-btn-secondary {
+    @apply inline-flex items-center px-4 py-2.5 bg-gray-600 hover:bg-gray-700 text-white rounded-lg font-medium transition-colors;
+  }
+
+  .admin-btn-danger {
+    @apply inline-flex items-center px-4 py-2.5 bg-red-600 hover:bg-red-700 text-white rounded-lg font-medium transition-colors;
+  }
+
+  .admin-btn-outline {
+    @apply inline-flex items-center px-4 py-2.5 border border-gray-300 dark:border-gray-600 hover:bg-gray-50 dark:hover:bg-gray-700 text-gray-700 dark:text-gray-300 rounded-lg font-medium transition-colors;
+  }
+
+  .admin-card {
+    @apply bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700;
+  }
+
+  .errorlist {
+    @apply text-red-600 dark:text-red-400 text-sm mt-1;
+  }
+
+  .errorlist li {
+    @apply mb-1;
+  }
+
+  .help,
+  .helptext {
+    @apply text-sm text-gray-600 dark:text-gray-400 mt-1 block;
+  }
+
+  /* Django admin specific class mappings */
+  .vTextField,
+  .vURLField,
+  .vIntegerField,
+  .vBigIntegerField,
+  .vPositiveIntegerField,
+  .vSmallIntegerField,
+  .vEmailField {
+    @apply max-w-lg px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors;
+  }
+
+  .vLargeTextField,
+  .vXMLLargeTextField {
+    @apply max-w-3xl px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors min-h-24;
+  }
+
+  select:not([multiple]) {
+    @apply max-w-md px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-colors;
+  }
+
+  input[type="checkbox"]:not(.action-select) {
+    @apply rounded border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500 focus:ring-offset-0;
+  }
+
+  input[type="radio"] {
+    @apply border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500 focus:ring-offset-0;
+  }
+
+  .action-select {
+    @apply rounded border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500 focus:ring-offset-0;
+  }
+
+  .submit-row {
+    @apply flex items-center justify-between bg-gray-50 dark:bg-gray-800 px-6 py-4 rounded-lg border border-gray-200 dark:border-gray-700;
+  }
+
+  .deletelink {
+    @apply inline-flex items-center px-4 py-2.5 bg-red-600 hover:bg-red-700 text-white rounded-lg font-medium transition-colors;
+  }
+
+  .addlink {
+    @apply inline-flex items-center px-6 py-2.5 bg-primary-600 hover:bg-primary-700 text-white rounded-lg font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500;
+  }
+
+  .changelink,
+  .viewlink {
+    @apply text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-300 underline transition-colors;
+  }
+}
+
+/* Result list table styling */
+@layer components {
+  #result_list {
+    @apply w-full border-collapse;
+  }
+
+  #result_list thead th {
+    @apply px-4 py-3 text-left text-xs font-semibold text-gray-700 dark:text-gray-300 uppercase tracking-wider bg-gray-50 dark:bg-gray-750 border-b border-gray-200 dark:border-gray-700;
+  }
+
+  #result_list thead th a {
+    @apply text-gray-700 dark:text-gray-300 hover:text-primary-600 dark:hover:text-primary-400 no-underline;
+  }
+
+  #result_list tbody tr {
+    @apply border-b border-gray-200 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-750 transition-colors;
+  }
+
+  #result_list tbody td {
+    @apply px-4 py-3 text-sm text-gray-900 dark:text-gray-100;
+    text-align: left !important;
+  }
+
+  #result_list tbody td a {
+    @apply text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-300 no-underline;
+  }
+
+  /* Action checkboxes column */
+  #result_list .action-checkbox {
+    @apply w-10;
+  }
+
+  /* Make thumbnail images smaller */
+  #result_list img {
+    @apply max-w-[60px] max-h-[60px] rounded;
+  }
+
+  /* Inline form thumbnails (TabularInline, StackedInline) */
+  .inline-related img,
+  .tabular td img {
+    @apply max-h-[80px] w-auto rounded;
+  }
+
+  /* Stacked inline thumbnails */
+  .inline-stacked img {
+    @apply max-h-[100px] w-auto rounded;
+  }
+
+  /* Readonly field images in change forms */
+  .readonly img,
+  .field-box img {
+    @apply max-h-[120px] w-auto rounded;
+  }
+
+  /* Related widget wrapper (add/edit/delete icons next to ForeignKey fields) */
+  .related-widget-wrapper {
+    @apply flex items-center gap-2;
+  }
+
+  .related-widget-wrapper select {
+    @apply flex-1;
+  }
+
+  .related-widget-wrapper-link {
+    @apply inline-flex items-center justify-center w-6 h-6 text-gray-500 hover:text-primary-600 dark:text-gray-400 dark:hover:text-primary-400 transition-colors;
+  }
+
+  .related-widget-wrapper-link img {
+    @apply w-4 h-4;
+  }
+
+  /* Django admin date/time picker icons */
+  .datetimeshortcuts {
+    @apply inline-flex items-center gap-1 ml-2;
+  }
+
+  .datetimeshortcuts a {
+    @apply text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-300;
+  }
+
+  .datetimeshortcuts img {
+    @apply inline-block w-4 h-4;
+  }
+
+  /* File input styling */
+  input[type="file"] {
+    @apply block w-full text-sm text-gray-500 dark:text-gray-400 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-primary-50 file:text-primary-700 dark:file:bg-gray-700 dark:file:text-primary-400 file:cursor-pointer hover:file:bg-primary-100 dark:hover:file:bg-gray-600 file:transition-colors;
+  }
+
+
+  /* Hide TinyMCE metadata / helper blocks under ProseEditorField */
+  .tox-tinymce+div {
+    display: none !important;
+  }
+
+  /* Hide django-prose-editor toolbar labels/metadata */
+  .ProseMirror-menubar-wrapper .ProseMirror-menuitem-label,
+  .prose-editor-wrapper [class*="format_"],
+  .prose-editor [class*="format_"],
+  [data-prose-editor] [class*="format_"],
+  .field-description [class*="format_"],
+  .form-row [class*="format_"] {
+    display: none !important;
+  }
+
+  /* Alternative: hide any stray text nodes that look like toolbar labels */
+  .form-row>div:not([class]) {
+    font-size: 0;
+  }
+
+  .form-row>div:not([class]) * {
+    font-size: 0.875rem;
+  }
+
+  /* Django admin calendar widget styling */
+  .calendarbox,
+  .clockbox {
+    @apply bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg z-50;
+  }
+
+  .calendar {
+    @apply bg-white dark:bg-gray-800;
+  }
+
+  .calendar caption {
+    @apply bg-primary-600 text-white font-semibold py-2 px-3;
+  }
+
+  .calendar th {
+    @apply text-xs font-medium text-gray-600 dark:text-gray-400 py-1;
+  }
+
+  .calendar td {
+    @apply text-center;
+  }
+
+  .calendar td a {
+    @apply block px-2 py-1 text-sm text-gray-700 dark:text-gray-300 hover:bg-primary-100 dark:hover:bg-primary-900 rounded;
+  }
+
+  .calendar td.today a {
+    @apply bg-primary-500 text-white font-bold;
+  }
+
+  .calendar-shortcuts {
+    @apply bg-gray-50 dark:bg-gray-750 px-3 py-2 border-t border-gray-200 dark:border-gray-700;
+  }
+
+  .calendar-shortcuts a {
+    @apply text-sm text-primary-600 dark:text-primary-400 hover:underline mr-3;
+  }
+
+  .calendar-cancel {
+    @apply bg-gray-50 dark:bg-gray-750 px-3 py-2 border-t border-gray-200 dark:border-gray-700 text-center;
+  }
+
+  .calendar-cancel a {
+    @apply text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900;
+  }
+
+  /* Clock widget */
+  .clockbox h2 {
+    @apply bg-primary-600 text-white font-semibold py-2 px-3;
+  }
+
+  .clockbox .timelist {
+    @apply py-2;
+  }
+
+  .clockbox .timelist li a {
+    @apply block px-3 py-1 text-sm text-gray-700 dark:text-gray-300 hover:bg-primary-100 dark:hover:bg-primary-900;
+  }
+
+  /* Date/time shortcut icons */
+  .datetimeshortcuts a {
+    @apply text-primary-600 dark:text-primary-400;
+  }
+
+  .date-icon,
+  .clock-icon {
+    @apply inline-block w-4 h-4 cursor-pointer;
+  }
+
+  /* Boolean field icons */
+  .field-__str__ img,
+  img[src*="icon-yes"],
+  img[src*="icon-no"],
+  img[src*="icon-unknown"] {
+    @apply w-4 h-4 inline-block;
+  }
+
+  /* Many-to-many selector (filter_horizontal/filter_vertical) */
+  .selector {
+    @apply flex gap-2;
+  }
+
+  .selector select {
+    @apply min-h-[150px] border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700;
+  }
+
+  .selector-chooser {
+    @apply flex flex-col justify-center gap-1;
+  }
+
+  .selector-chooser a {
+    @apply px-2 py-1 bg-gray-100 dark:bg-gray-700 rounded hover:bg-gray-200 dark:hover:bg-gray-600;
+  }
+
+  /* Action bar above results */
+  .actions {
+    @apply flex items-center gap-3 px-4 py-3 bg-gray-50 dark:bg-gray-750 border-b border-gray-200 dark:border-gray-700;
+  }
+
+  .actions select {
+    @apply max-w-xs;
+  }
+
+  .actions button {
+    @apply px-4 py-2 bg-primary-600 hover:bg-primary-700 text-white rounded-lg font-medium transition-colors;
+  }
+
+  /* Sortable column indicators */
+  th.sorted a {
+    @apply font-bold;
+  }
+
+  th.ascending a::after {
+    content: " ▲";
+    @apply text-xs;
+  }
+
+  th.descending a::after {
+    content: " ▼";
+    @apply text-xs;
+  }
+}

adminita/templates/admin/base.html

@@ -0,0 +1,173 @@
+{% load i18n static %}
+<!DOCTYPE html>
+<html lang="{{ LANGUAGE_CODE|default:"en-us" }}" class="h-full">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}{% endblock %}</title>
+    
+    <link rel="stylesheet" href="{% static 'adminita/adminita-tailwind.css' %}">
+    <script src="{% static 'adminita/adminita-tailwind.js' %}" defer></script>
+    <link rel="stylesheet" href="{% static 'admin/css/widgets.css' %}">
+  
+  </head>
+    {% block dark_mode_vars %}
+    <script>
+        // Dark mode handling
+        if (localStorage.getItem('darkMode') === 'true' || 
+            (!localStorage.getItem('darkMode') && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
+            document.documentElement.classList.add('dark');
+        }
+    </script>
+    {% endblock %}
+    
+    {% block extrastyle %}{% endblock %}
+    {% block extra_head %}{% endblock %}
+</head>
+
+<body class="min-h-full bg-gray-50 text-gray-900 dark:bg-gray-900 dark:text-gray-100">
+    <div class="flex min-h-screen">
+        
+        <!-- Sidebar -->
+        {% block sidebar %}
+        <aside id="sidebar" class="w-64 bg-white dark:bg-gray-800 shadow-sm border-r border-gray-200 dark:border-gray-700 fixed h-full z-40 transform md:transform-none transition-transform duration-300 ease-in-out -translate-x-full md:translate-x-0">
+            
+            {% block branding %}
+            <div class="h-16 px-6 flex items-center justify-between border-b border-gray-200 dark:border-gray-700">
+                <a href="{% url 'admin:index' %}" class="text-sm font-normal text-gray-900 dark:text-white hover:text-primary-600 dark:hover:text-primary-400 transition-colors">
+                    {{ site_header|default:_('Django administration') }}
+                </a>
+            </div>
+            {% endblock %}
+            
+            {% block nav-global %}{% endblock %}
+            
+            <nav class="px-4 py-6 overflow-y-auto h-[calc(100vh-4rem)]">
+                {% block sidebar_content %}
+                {% if app_list %}
+                    <div class="space-y-6">
+                        {% for app in app_list %}
+                        <div>
+                            <h3 class="px-3 text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-2">
+                                {{ app.name }}
+                            </h3>
+                            <div class="space-y-1">
+                                {% for model in app.models %}
+                                <a href="{{ model.admin_url }}" 
+                                   class="flex items-center px-3 py-2 text-sm font-medium rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors {% if request.path == model.admin_url %}bg-gray-100 dark:bg-gray-700 text-primary-600 dark:text-primary-400{% else %}text-gray-700 dark:text-gray-300{% endif %}">
+                                    <span>{{ model.name }}</span>
+                                </a>
+                                {% endfor %}
+                            </div>
+                        </div>
+                        {% endfor %}
+                    </div>
+                {% endif %}
+                {% endblock %}
+            </nav>
+        </aside>
+        
+        <!-- Overlay for mobile -->
+        <div id="sidebar-overlay" class="fixed inset-0 bg-black/50 z-30 hidden md:hidden"></div>
+        {% endblock %}
+        
+        <!-- Main Content  -->
+        <div class="flex-1 flex flex-col md:ml-64 transition-all duration-300" id="main-content">
+            
+            <!-- Top Bar -->
+            {% block header %}
+            <header class="h-16 bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 flex items-center justify-between px-6 sticky top-0 z-20">
+                
+                <div class="flex items-center space-x-4">
+                    <!-- Mobile menu button - hidden on desktop -->
+                    <button id="sidebar-toggle" type="button" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors md:hidden">
+                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/>
+                        </svg>
+                    </button>
+                    
+                    {% block page_title %}
+                    <h1 class="text-xl font-semibold text-gray-900 dark:text-white">
+                        {% block content_title %}{% endblock %}
+                    </h1>
+                    {% endblock %}
+                </div>
+                
+                <div class="flex items-center space-x-4">
+                    <!-- Dark mode toggle -->
+                    <button id="dark-mode-toggle" type="button" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" title="Toggle dark mode">
+                        <svg class="w-5 h-5 hidden dark:block" fill="currentColor" viewBox="0 0 20 20">
+                            <path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"/>
+                        </svg>
+                        <svg class="w-5 h-5 block dark:hidden" fill="currentColor" viewBox="0 0 20 20">
+                            <path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"/>
+                        </svg>
+                    </button>
+                    
+                    {% block usertools %}
+                    {% if user.is_active and user.is_staff %}
+                    <div class="flex items-center space-x-3 text-sm">
+                        <span class="text-gray-700 dark:text-gray-300 hidden sm:inline">
+                            {% trans 'Welcome,' %} <strong>{{ user.get_username }}</strong>
+                        </span>
+                        <a href="{% url 'admin:password_change' %}" class="text-gray-600 dark:text-gray-400 hover:text-primary-600 dark:hover:text-primary-400 transition-colors hidden sm:inline">
+                            {% trans 'Change password' %}
+                        </a>
+                        <span class="text-gray-400 hidden sm:inline">/</span>
+                        <form method="post" action="{% url 'admin:logout' %}" style="display: inline;">
+                            {% csrf_token %}
+                            <button type="submit" class="text-gray-600 dark:text-gray-400 hover:text-primary-600 dark:hover:text-primary-400 transition-colors bg-transparent border-0 cursor-pointer">
+                                {% trans 'Log out' %}
+                            </button>
+                        </form>
+                    </div>
+                    {% endif %}
+                    {% endblock %}
+                </div>
+            </header>
+            {% endblock %}
+            
+            <!-- Main Content Area with Max Width Container -->
+            <main class="flex-1 p-6">
+                <!-- Container with max-width to prevent super-wide content -->
+                <div class="max-w-7xl mx-auto">
+                    {% block messages %}
+                        {% if messages %}
+                        <div class="mb-6 space-y-2">
+                            {% for message in messages %}
+                            <div class="rounded-lg p-4 {% if message.tags %}{{ message.tags }}{% endif %} 
+                                {% if 'error' in message.tags %}bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 text-red-800 dark:text-red-200
+                                {% elif 'warning' in message.tags %}bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 text-yellow-800 dark:text-yellow-200
+                                {% elif 'success' in message.tags %}bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 text-green-800 dark:text-green-200
+                                {% else %}bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 text-blue-800 dark:text-blue-200{% endif %}">
+                                {{ message|capfirst }}
+                            </div>
+                            {% endfor %}
+                        </div>
+                        {% endif %}
+                    {% endblock messages %}
+                    
+                    {% block content %}
+                    {% endblock %}
+                    
+                    {% block sidebar_right %}{% endblock %}
+                </div>
+            </main>
+            
+            {% block footer %}
+            <footer class="px-6 py-4 border-t border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800">
+                <div class="text-sm text-gray-600 dark:text-gray-400 text-center max-w-7xl mx-auto">
+                    {% block footer_content %}
+                    Powered by <a href="https://github.com/djangify/adminita" class="text-primary-600 dark:text-primary-400 hover:underline" target="_blank">Adminita</a>
+                    {% endblock %}
+                </div>
+            </footer>
+            {% endblock %}
+        </div>
+    </div>
+    
+    
+
+    {% block extrajs %}{% endblock %}
+</body>
+</html>