Sha256: 3a1a84ce5c83a7f2b19743b78ca51fb0eeb301a3b433a56ed4fb5d360eb58259
Contents?: true
Size: 1.53 KB
Versions: 5
Compression:
Stored size: 1.53 KB
Contents
<div class="bg-gray-50 h-full flex flex-col" x-data="{viewportHeight: 0, viewportWidth: 0}">
<header class="py-2 px-4 w-full flex-none bg-white border-b border-gray-300 flex items-center h-10">
<div class="flex items-center ">
<div class="flex items-center space-x-1">
<strong><%= @preview.label %></strong>
<span>/</span>
<span><%= @example.label %></span>
</div>
<a href="<%= preview_path %>" class="block ml-2 text-gray-400 hover:text-indigo-800 transition" x-tooltip.theme.lookbook="`Open preview in new window`" target="_blank">
<svg class="feather w-3 h-3 ">
<use xlink:href="#external-link" />
</svg>
</a>
</div>
<div class="ml-auto flex text-xs font-monospace text-gray-700 space-x-1">
<span x-text="`${viewportWidth}px`"></span>
<span class="text-gray-500">x</span>
<span x-text="`${viewportHeight}px`"></span>
</div>
</header>
<div class="grid h-full" x-data :style="`grid-template-rows: 1fr 1px ${$store.inspector.height}px`">
<%= render "partials/preview" %>
<div class="w-full gutter border-t border-gray-300 relative" x-data="split({direction: 'vertical', minSize: 200, onDrag: (splits) => { $store.inspector.height = splits[2] }})">
<div class="h-[11px] w-full bg-transparent hover:bg-indigo-100 hover:bg-opacity-20 transition absolute left-0 right-0 transform -translate-y-1/2 cursor-[row-resize]"></div>
</div>
<% if @inspector %>
<%= render "partials/inspector/inspector" %>
<% end %>
</div>
</div>
Version data entries
5 entries across 5 versions & 1 rubygems