application.html.erb in panda_cms-0.5.0

- old
+ new
@@ -1,54 +1,30 @@
-<%= render "panda_cms/shared/header", html_class: "h-full bg-gray-50" %>
+<%= render "panda_cms/shared/header", html_class: "h-full bg-white" %>
   <div class="flex h-full" id="panda-container">
-    <div class="lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-72 lg:flex-col top-0 -m-t-2 w-full absolute" data-controller="panda-cms-menu">
-      <div class="flex grow flex-col gap-y-5 overflow-y-auto bg-panda-cms-dark px-4 pb-4 lg:max-h-full max-h-16" data-panda-cms-menu-target="menu" data-transition-enter="transition-all ease-in-out duration-300" data-transition-enter-from="m-h-16" data-transition-enter-to="max-h-full" data-transition-leave="transition-all ease-in-out duration-300" data-transition-leave-from="max-h-full" data-transition-leave-to="max-h-16">
+    <div class="absolute top-0 w-full lg:flex lg:fixed lg:inset-y-0 lg:z-50 lg:flex-col lg:w-72">
+      <div class="flex overflow-y-auto flex-col gap-y-5 px-4 pb-4 max-h-16 bg-gradient-to-br lg:max-h-full grow from-dark to-mid" data-transition-enter="transition-all ease-in-out duration-300" data-transition-enter-from="m-h-16" data-transition-enter-to="max-h-full" data-transition-leave="transition-all ease-in-out duration-300" data-transition-leave-from="max-h-full" data-transition-leave-to="max-h-16">
         <%= render partial: "panda_cms/admin/shared/sidebar" %>
       </div>
     </div>
 
-    <div class="flex flex-col flex-1 ml-0 lg:ml-72 mt-16 lg:mt-0" id="panda-inner-container" <% if content_for :sidebar %> data-controller="toggle" data-action="keydown.esc->modal#close" tabindex="-1"<% end %>>
-      <header class="w-full" id="panda-action-bar">
-        <div class="flex relative z-10 flex-shrink-0 h-16 bg-white border-b border-gray-200 shadow-sm">
-          <div class="flex flex-1 justify-between px-4 sm:px-6">
-            <div class="flex flex-1">
-              <form class="flex w-full md:ml-0" action="#" method="GET">
-                <!-- <label for="search-field" class="sr-only">Search</label>
-                <div class="relative w-full text-gray-400 focus-within:text-gray-600">
-                  <div class="flex absolute inset-y-0 left-0 items-center pointer-events-none">
-                    <svg class="flex-shrink-0 w-5 h-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
-                      <path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd" />
-                    </svg>
-                  </div>
-                  <input name="search-field" autocomplete="off" id="search-field" class="py-2 pr-3 pl-8 w-full h-full text-gray-900 border-0 sm:text-sm focus:ring-0 focus:outline-none focus:placeholder:text-gray-400" placeholder="Search" type="search">
-                </div> -->
-                <% if content_for :sidebar %>
-                  <a href="#" id="slideover-toggle" data-action="click->toggle#toggle touch->toggle#toggle" class="block relative right-0 py-4 pr-0 mt-1 w-32 font-semibold text-right text-gray-500 hover:text-gray-700 min-w-32 px-auto"><i class="fa-light fa-gear"></i> <%= yield :sidebar_title %></a>
-                <% end %>
-              </form>
-            </div>
-          </div>
-        </div>
-      </header>
-
-      <%= render "panda_cms/admin/shared/breadcrumbs" %>
-
+    <div class="flex flex-col flex-1 mt-16 ml-0 lg:mt-0 lg:ml-72" id="panda-inner-container" <% if content_for :sidebar %> data-controller="toggle" data-action="keydown.esc->modal#close" tabindex="-1"<% end %>>
       <section id="panda-main" class="flex flex-row h-full">
         <div class="flex-1 h-full" id="panda-cms-primary-content">
+          <%= render "panda_cms/admin/shared/breadcrumbs" %>
           <%= yield %>
         </div>
 
         <% if content_for :sidebar %>
-          <div data-toggle-target="toggleable" class="flex hidden flex-col h-full bg-white divide-y divide-gray-200 shadow-xl basis-3/12 absolute right-0"
+          <div data-toggle-target="toggleable" class="flex hidden absolute right-0 flex-col h-full bg-white divide-y divide-gray-200 shadow-xl basis-3/12"
             data-transition-enter="transform transition ease-in-out duration-500"
             data-transition-enter-from="translate-x-full"
             data-transition-enter-to="translate-x-0"
             data-transition-leave="transform transition ease-in-out duration-500"
             data-transition-leave-from="translate-x-full"
             data-transition-leave-to="translate-x-0"
             id="slideover">
             <div class="overflow-y-auto flex-1 h-0">
-              <div class="py-3 px-4 bg-panda-cms-dark">
+              <div class="py-3 px-4 mb-4 bg-black">
                 <div class="flex justify-between items-center">
                   <h2 class="text-base font-semibold leading-6 text-white" id="slideover-title"><i class="mr-2 fa-light fa-gear"></i> <%= yield :sidebar_title %> </h2>
                   <a href="#" data-action="click->toggle#toggle touch->toggle#toggle"><i class="font-bold text-white fa-regular fa-xmark right"></i></a>
                 </div>
               </div>