Fixes

Author: RobiNN1

assets/css/styles.css

@@ -194,9 +194,6 @@
   .-mt-1\.5 {
     margin-top: calc(0.25rem * -1.5);
   }
-  .mr-1 {
-    margin-right: calc(0.25rem * 1);
-  }
   .mr-3 {
     margin-right: calc(0.25rem * 3);
   }

templates/components/button.twig

@@ -6,15 +6,10 @@
     {% set btn_color = 'bg-primary-500 hover:bg-primary-600 focus:ring-primary-200 disabled:bg-primary-300 dark:bg-primary-700 dark:hover:bg-primary-800 dark:focus:ring-primary-400 dark:disabled:bg-primary-400' %}
 {% endif %}
 
-{% set classes = 'text-sm inline-flex items-center border border-transparent rounded-sm py-1.5 px-3 font-semibold text-white align-middle shadow-sm focus:ring-3 dark:text-white ' ~ btn_color %}
+{% set classes = 'text-sm inline-flex items-center gap-1 border border-transparent rounded-sm py-1.5 px-3 font-semibold text-white align-middle shadow-sm focus:ring-3 dark:text-white ' ~ btn_color %}
 
 {% if link %}
-    <a href="{{ link }}" class="{{ classes ~ class|space }}">
-        {% if icon %}
-            {{ svg(icon, 12, (text ? 'mr-1' : '')) }}
-        {% endif %}
-        {{ text }}
-    </a>
+    <a href="{{ link }}" class="{{ classes ~ class|space }}">{{ icon ? svg(icon, 12) : '' }}{{ text }}</a>
 {% else %}
     {% macro attr(attributes) %}
         {% for name, value in attributes %}
@@ -29,9 +24,6 @@
     {% set id = id is not empty ? 'id="' ~ id ~ '" name="' ~ id ~ '" ' : '' %}
 
     <button type="{{ submit ? 'submit' : 'button' }}" {{ id|raw }}class="{{ classes ~ class|space }}"{{ _self.attr(attributes) }}>
-        {% if icon %}
-            {{ svg(icon, 12, (text ? 'mr-1' : '')) }}
-        {% endif %}
-        {{ text }}
+        {{ icon ? svg(icon, 12) : '' }}{{ text }}
     </button>
 {% endif %}

templates/dashboards/opcache.twig

@@ -3,7 +3,6 @@
         include('components/button.twig', {
             text: (is_ignored ? 'Show' : 'Ignore') ~ ' scripts from this tool',
             link: link(['pp', 'p'], {'ignore': (is_ignored ? 'no' : 'yes')}),
-            class: 'mr-1',
         })
     ],
     head_items: [

templates/partials/table_view.twig

@@ -55,8 +55,8 @@
                 {% endfor %}
                 {% if show_actions %}
                     <td class="px-3 py-2 border-b border-gray-200 text-sm whitespace-nowrap dark:border-gray-700">
-                        <button class="delete-key text-red-500 hover:text-red-700 font-semibold inline-flex items-center" type="button" title="Delete">
-                            {{ svg('trash', 16, 'mr-1') }} Delete
+                        <button class="delete-key text-red-500 hover:text-red-700 font-semibold inline-flex items-center gap-1" type="button" title="Delete">
+                            {{ svg('trash', 16) }} Delete
                         </button>
                     </td>
                 {% endif %}

templates/partials/view_key.twig

@@ -38,15 +38,15 @@
 
     <span>
         {% if export_url %}
-            <a href="{{ export_url }}" class="inline-flex items-center font-semibold text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300">
-                {{ svg('export', 16, 'mr-1') }} Export
+            <a href="{{ export_url }}" class="inline-flex items-center gap-1 font-semibold text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300">
+                {{ svg('export', 16) }} Export
             </a>
         {% endif %}
 
         {% if delete_url %}
-            <a href="{{ delete_url }}" class="inline-flex items-center font-semibold text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"
+            <a href="{{ delete_url }}" class="inline-flex items-center gap-1 font-semibold text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"
                onclick="return confirm('Are you sure you want to remove this item?');">
-                {{ svg('trash', 16, 'mr-1') }} Delete
+                {{ svg('trash', 16) }} Delete
             </a>
         {% endif %}
     </span>
@@ -56,8 +56,8 @@
     {{ include('partials/view_key_array.twig') }}
 {% else %}
     {% if edit_url %}
-        <a href="{{ edit_url ~ encode_url }}" class="mr-3 mb-4 inline-flex items-center font-semibold text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300">
-            {{ svg('edit', 16, 'mr-1') }} Edit
+        <a href="{{ edit_url ~ encode_url }}" class="mr-3 mb-4 inline-flex items-center gap-1 font-semibold text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300">
+            {{ svg('edit', 16) }} Edit
         </a>
     {% endif %}
     <div class="rounded-sm bg-white border border-gray-200 dark:bg-gray-800 dark:border-gray-700">

templates/partials/view_key_array.twig

@@ -32,13 +32,13 @@
 
             <div>
                 {% if type not in types.extra.hide_edit %}
-                    <a href="{{ edit_url }}&{{ types[type].param }}={{ item.key ~ item_encode_url }}" class="text-gray-500 hover:text-gray-700 font-semibold inline-flex items-center mr-3 dark:text-gray-400 dark:hover:text-gray-300">
-                        {{ svg('edit', 16, 'mr-1') }} Edit
+                    <a href="{{ edit_url }}&{{ types[type].param }}={{ item.key ~ item_encode_url }}" class="text-gray-500 hover:text-gray-700 font-semibold inline-flex items-center gap-1 mr-3 dark:text-gray-400 dark:hover:text-gray-300">
+                        {{ svg('edit', 16) }} Edit
                     </a>
                 {% endif %}
-                <a href="{{ deletesub_url }}&{{ types[type].param }}={{ item.key }}" class="text-red-500 hover:text-red-700 font-semibold inline-flex items-center dark:text-red-400 dark:hover:text-red-300"
+                <a href="{{ deletesub_url }}&{{ types[type].param }}={{ item.key }}" class="text-red-500 hover:text-red-700 font-semibold inline-flex items-center gap-1 dark:text-red-400 dark:hover:text-red-300"
                    onclick="return confirm('Are you sure you want to remove this item?');">
-                    {{ svg('trash', 16, 'mr-1') }} Delete
+                    {{ svg('trash', 16) }} Delete
                 </a>
             </div>
         </div>