lookbook 1.0.0.beta.4 → 1.0.0.beta.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/components/lookbook/base_component.rb +6 -4
- data/app/components/lookbook/copy_button/component.html.erb +3 -3
- data/app/components/lookbook/embed/component.html.erb +33 -33
- data/app/components/lookbook/header/component.html.erb +2 -2
- data/app/components/lookbook/nav/component.html.erb +4 -8
- data/app/components/lookbook/nav/component.rb +5 -7
- data/app/components/lookbook/nav/item/component.html.erb +12 -6
- data/app/components/lookbook/nav/item/component.rb +9 -2
- data/app/components/lookbook/page_tabs/component.html.erb +1 -1
- data/app/components/lookbook/split_layout/component.html.erb +1 -1
- data/app/components/lookbook/tab_panels/panel/component.html.erb +2 -2
- data/app/components/lookbook/tabs/component.html.erb +2 -2
- data/app/components/lookbook/tabs/dropdown_tab/component.html.erb +1 -1
- data/app/components/lookbook/tabs/tab/component.html.erb +1 -1
- data/app/components/lookbook/tag_component.rb +5 -10
- data/app/controllers/lookbook/application_controller.rb +1 -1
- data/app/views/layouts/lookbook/application.html.erb +76 -60
- data/app/views/layouts/lookbook/page.html.erb +35 -35
- data/app/views/lookbook/index.html.erb +24 -11
- data/app/views/lookbook/pages/show.html.erb +1 -1
- data/app/views/lookbook/previews/show.html.erb +7 -7
- data/lib/lookbook/config.rb +9 -1
- data/lib/lookbook/engine.rb +16 -6
- data/lib/lookbook/markdown.rb +3 -1
- data/lib/lookbook/page.rb +4 -0
- data/lib/lookbook/preview.rb +35 -5
- data/lib/lookbook/version.rb +1 -1
- data/lib/tasks/lookbook_tasks.rake +1 -1
- data/public/lookbook-assets/css/lookbook.css +12 -12
- data/public/lookbook-assets/js/lookbook.js +108 -108
- data/public/lookbook-assets/js/lookbook.js.map +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: feee8e4000727cf29049a598fea2a5f42c69fe7db5bb60b6da6c286fdb99d802
|
4
|
+
data.tar.gz: ab15348dfe00c841dd6ecccd9d0abe322ac918117f2bdc174f151c7673d9ee05
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 48bca09ccaa76942a3f68893c0b59248d4a6350227fb84a143d6f977f436ca1f9a5e77591ac746bbcf6d253b8f8f0788fe49eb1a27649abeda64fc509fd87c50
|
7
|
+
data.tar.gz: f53562df6656e4670e209d88fa0c3449ae2378e65e6b40dc6b691381e1ce6409999ffa35f5d533d833fb719ec155fe8682f1ef87bc93a37cd2111481ee0d4a24
|
@@ -10,11 +10,13 @@ module Lookbook
|
|
10
10
|
|
11
11
|
def render_component_tag(tag = :div, **attrs, &block)
|
12
12
|
merged_classes = class_names(attrs[:class], @html_attrs[:class])
|
13
|
-
|
13
|
+
merged_attrs = @html_attrs.except(:class).deep_merge(attrs.except(:class))
|
14
|
+
|
15
|
+
|
14
16
|
render Lookbook::TagComponent.new(tag: tag,
|
15
17
|
name: component_name,
|
16
|
-
**
|
17
|
-
|
18
|
+
**merged_attrs,
|
19
|
+
"x-data": prepare_alpine_data(merged_attrs[:"x-data"]),
|
18
20
|
class: merged_classes), &block
|
19
21
|
end
|
20
22
|
|
@@ -31,7 +33,7 @@ module Lookbook
|
|
31
33
|
end
|
32
34
|
|
33
35
|
def prepare_alpine_data(x_data = nil)
|
34
|
-
alpine_component_name = x_data || @html_attrs&.dig(:
|
36
|
+
alpine_component_name = x_data || @html_attrs&.dig(:"x-data") || alpine_component
|
35
37
|
if alpine_component_name.present?
|
36
38
|
args = Array.wrap(alpine_data)
|
37
39
|
args.any? ? "#{alpine_component_name}(#{safe_join(args).gsub(""", "'").tr("\"", "'")})" : alpine_component_name
|
@@ -1,10 +1,10 @@
|
|
1
1
|
<%= render_component :button,
|
2
2
|
name: "copy-button",
|
3
3
|
**@button_attrs,
|
4
|
-
|
4
|
+
"x-data": prepare_alpine_data,
|
5
5
|
"@click.prevent": "copyToClipboard" do |button| %>
|
6
|
-
<% button.icon name: @icon, size: icon_size,
|
7
|
-
<%= icon :check, size: icon_size, class: "text-green-500",
|
6
|
+
<% button.icon name: @icon, size: icon_size, "x-show": "!copied", cloak: true %>
|
7
|
+
<%= icon :check, size: icon_size, class: "text-green-500", "x-show": "copied", cloak: true %>
|
8
8
|
<% if content %>
|
9
9
|
<div x-ref="copyTarget" class="hidden"><%== content %></div>
|
10
10
|
<% end %>
|
@@ -1,41 +1,41 @@
|
|
1
1
|
<% if @example.present? %>
|
2
|
-
|
2
|
+
<%= render_component_tag class: "not-prose border-b border-lookbook-divider rounded-sm overflow-hidden", "@navigation:start.window": "cleanup" do %>
|
3
3
|
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
<% end %>
|
4
|
+
<%= render_component :toolbar, class: "border border-b-0 border-lookbook-divider" do |toolbar| %>
|
5
|
+
<% toolbar.section padded: true do %>
|
6
|
+
<h3>
|
7
|
+
<%= @example.preview.label %> (<%= @example.label %>)
|
8
|
+
</h3>
|
9
|
+
<% end %>
|
10
|
+
<% toolbar.section align: :right, divide: :left do %>
|
11
|
+
<%= render_component :button_group do |group| %>
|
12
|
+
<% group.button icon: :eye,
|
13
|
+
href: helpers.lookbook_inspect_path(@example.path, @params),
|
14
|
+
tooltip: "View in Inspector" %>
|
15
|
+
<% group.button icon: :external_link,
|
16
|
+
href: helpers.lookbook_inspect_path(@example.path, @params),
|
17
|
+
tooltip: "Open in new window",
|
18
|
+
target: "_blank" %>
|
20
19
|
<% end %>
|
21
20
|
<% end %>
|
21
|
+
<% end %>
|
22
22
|
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
23
|
+
<div
|
24
|
+
x-show="tab === 'preview'"
|
25
|
+
@viewport:loaded="loadResizer"
|
26
|
+
@dom:update-complete="loadResizer"
|
27
|
+
@viewport:resize-progress="resizeIframe"
|
28
|
+
@viewport:resize-complete="resizeIframe"
|
29
|
+
@tabs:change.window="resizeIframe">
|
30
|
+
<%= render_component :viewport,
|
31
|
+
src: helpers.lookbook_preview_path(@example.path, @params.merge(lookbook_embed: true)),
|
32
|
+
alpine_data: "store",
|
33
|
+
resize_height: false,
|
34
|
+
max_height: @max_height,
|
35
|
+
class: "mb-[-2px]" %>
|
36
|
+
</div>
|
37
37
|
|
38
|
-
|
38
|
+
<% end %>
|
39
39
|
<% else %>
|
40
40
|
<%= render_component_tag class: "bg-white flex flex-col items-center justify-center border-2 border-dashed border-gray-200 p-6 rounded-md not-prose" do %>
|
41
41
|
<div class="px-4 text-center">
|
@@ -47,5 +47,5 @@
|
|
47
47
|
</p>
|
48
48
|
</div>
|
49
49
|
</div>
|
50
|
-
|
50
|
+
<% end %>
|
51
51
|
<% end %>
|
@@ -60,11 +60,11 @@
|
|
60
60
|
<% end %>
|
61
61
|
<% group.button icon: :menu,
|
62
62
|
"@click.stop": "toggleSidebar",
|
63
|
-
|
63
|
+
"x-show": "$store.layout.mobile && sidebarHidden",
|
64
64
|
class: "!text-lookbook-header-text" %>
|
65
65
|
<% group.button icon: :x,
|
66
66
|
"@click.stop": "toggleSidebar",
|
67
|
-
|
67
|
+
"x-show": "$store.layout.mobile && !sidebarHidden",
|
68
68
|
"@keydown.esc.window": "closeMobileSidebar",
|
69
69
|
class: "!text-lookbook-header-text" %>
|
70
70
|
<% end %>
|
@@ -1,12 +1,8 @@
|
|
1
1
|
<%= render_component_tag class: "flex flex-col overflow-hidden h-full",
|
2
2
|
"@filter:change.stop": "filter($event.detail.text)" do %>
|
3
3
|
|
4
|
-
<% if
|
5
|
-
<%=
|
6
|
-
<% toolbar.section padded: true do %>
|
7
|
-
<h4 class="pt-1"><%= label %></h4>
|
8
|
-
<% end %>
|
9
|
-
<% end %>
|
4
|
+
<% if toolbar %>
|
5
|
+
<%= toolbar %>
|
10
6
|
<% end %>
|
11
7
|
|
12
8
|
<% if filter && items.any? %>
|
@@ -21,11 +17,11 @@
|
|
21
17
|
<%= safe_join(items) %>
|
22
18
|
</ul>
|
23
19
|
<div class="p-4 text-center" x-show="empty" x-cloak>
|
24
|
-
<h4 class="opacity-50 italic">No matching
|
20
|
+
<h4 class="opacity-50 italic">No matching results.</h4>
|
25
21
|
</div>
|
26
22
|
<% else %>
|
27
23
|
<div class="p-4 text-center">
|
28
|
-
<h4 class="opacity-50 italic">
|
24
|
+
<h4 class="opacity-50 italic">Nothing here yet.</h4>
|
29
25
|
</div>
|
30
26
|
<% end %>
|
31
27
|
</div>
|
@@ -1,28 +1,26 @@
|
|
1
1
|
module Lookbook
|
2
2
|
class Nav::Component < Lookbook::BaseComponent
|
3
3
|
renders_one :filter, Lookbook::Filter::Component
|
4
|
+
renders_one :toolbar, Lookbook::Toolbar::Component
|
4
5
|
|
5
6
|
def initialize(
|
7
|
+
id: nil,
|
6
8
|
collection:,
|
7
|
-
label: nil,
|
8
9
|
collapse_singles: false,
|
9
10
|
**attrs
|
10
11
|
)
|
12
|
+
@id = id.presence || "#{collection.id}-nav"
|
11
13
|
@collection = collection.as_tree
|
12
|
-
@label = label
|
13
14
|
@item_args = {
|
14
15
|
collapse_singles: collapse_singles
|
15
16
|
}
|
16
|
-
super(**attrs)
|
17
|
-
end
|
18
|
-
|
19
|
-
def label
|
20
|
-
@label || @collection.label
|
17
|
+
super(**attrs, id: id)
|
21
18
|
end
|
22
19
|
|
23
20
|
def items
|
24
21
|
@collection.non_empty_items.map do |item|
|
25
22
|
render Lookbook::Nav::Item::Component.new item,
|
23
|
+
nav_id: @id,
|
26
24
|
depth: 1,
|
27
25
|
**@item_args
|
28
26
|
end
|
@@ -1,16 +1,22 @@
|
|
1
|
-
<%= render_component_tag :li,
|
2
|
-
|
1
|
+
<%= render_component_tag :li,
|
2
|
+
id: id,
|
3
|
+
class: "list-none",
|
4
|
+
"x-show": "!filteredOut",
|
5
|
+
data: {
|
6
|
+
"entity-type": item.type
|
7
|
+
},
|
8
|
+
cloak: true do %>
|
3
9
|
<%= render_tag href.present? ? :a : :div,
|
4
10
|
href: href,
|
5
11
|
class: "flex items-center py-1 select-none cursor-pointer text-lookbook-nav-text hover:bg-lookbook-nav-item-hover",
|
6
12
|
style: "padding-left: #{left_pad}px",
|
7
|
-
|
13
|
+
"x-bind": "bindings.#{href.present? ? "link" : "toggle"}" do %>
|
8
14
|
<div class="relative flex items-center">
|
9
|
-
<%= icon
|
15
|
+
<%= icon nil,
|
10
16
|
size: 3,
|
11
17
|
class: "mr-1 text-lookbook-nav-toggle absolute -left-4",
|
12
|
-
|
13
|
-
<%= icon
|
18
|
+
"x-effect": "iconName = open ? 'chevron-down' : 'chevron-right'" if children? %>
|
19
|
+
<%= icon nav_icon, size: 3.5, class: "mr-1.5 text-lookbook-nav-icon" %>
|
14
20
|
<span><%= label %></span>
|
15
21
|
</div>
|
16
22
|
<% end %>
|
@@ -14,16 +14,22 @@ module Lookbook
|
|
14
14
|
|
15
15
|
def initialize(
|
16
16
|
item,
|
17
|
+
nav_id:,
|
17
18
|
depth: 1,
|
18
19
|
collapse_singles: false,
|
19
20
|
**html_attrs
|
20
21
|
)
|
22
|
+
@nav_id = nav_id
|
21
23
|
@item = item
|
22
24
|
@depth = depth
|
23
25
|
@collapse_singles = collapse_singles
|
24
26
|
super(**html_attrs)
|
25
27
|
end
|
26
28
|
|
29
|
+
def id
|
30
|
+
"#{@nav_id}-#{@item.id}"
|
31
|
+
end
|
32
|
+
|
27
33
|
def left_pad
|
28
34
|
((@depth - 1) * 12) + 24
|
29
35
|
end
|
@@ -40,6 +46,7 @@ module Lookbook
|
|
40
46
|
@children ||= if collection? && !collapsed?
|
41
47
|
item.non_empty_items.map do |item|
|
42
48
|
render Lookbook::Nav::Item::Component.new item,
|
49
|
+
nav_id: @nav_id,
|
43
50
|
depth: (@depth + 1),
|
44
51
|
collapse_singles: @collapse_singles
|
45
52
|
end
|
@@ -52,8 +59,8 @@ module Lookbook
|
|
52
59
|
collapsed? ? @item.first : @item
|
53
60
|
end
|
54
61
|
|
55
|
-
def nav_icon
|
56
|
-
ICONS[
|
62
|
+
def nav_icon
|
63
|
+
ICONS[@item.type] || :file
|
57
64
|
end
|
58
65
|
|
59
66
|
def collection?
|
@@ -1,4 +1,4 @@
|
|
1
|
-
<%= render_component_tag
|
1
|
+
<%= render_component_tag "x-data": "{ activeTab: null }" do %>
|
2
2
|
<div class="flex w-full border-b border-lookbook-divider mb-6">
|
3
3
|
<%= render_component :tabs, theme: :page do |t| %>
|
4
4
|
<% @tabs.each do |props| %>
|
@@ -1,4 +1,4 @@
|
|
1
|
-
<%= render_component_tag class: "grid h-full w-full",
|
1
|
+
<%= render_component_tag class: "grid h-full w-full", "x-bind": "bindings.root", "x-effect": "initSplit" do %>
|
2
2
|
<% panes.each.with_index(1) do |pane, i| %>
|
3
3
|
<%= pane %>
|
4
4
|
<% if i < panes.size %>
|
@@ -9,8 +9,8 @@
|
|
9
9
|
<%= safe_join(tabs) %>
|
10
10
|
</div>
|
11
11
|
<div x-ref="dropdownTrigger" class="absolute" x-show="hasHiddenTabs" :style="{left: `${triggerLeft}px`}">
|
12
|
-
<%= render_component :button, icon: :chevrons_right,
|
13
|
-
<%= render_component :button, icon: :menu, class: "-ml-3",
|
12
|
+
<%= render_component :button, icon: :chevrons_right, "x-show": "visibleTabsCount > 0" %>
|
13
|
+
<%= render_component :button, icon: :menu, class: "-ml-3", "x-show": "visibleTabsCount === 0" %>
|
14
14
|
</div>
|
15
15
|
<div class="hidden">
|
16
16
|
<div x-ref="tabsDropdown" data-cloak>
|
@@ -4,26 +4,21 @@ module Lookbook
|
|
4
4
|
|
5
5
|
def initialize(tag: :div, name: nil, cloak: false, **html_attrs)
|
6
6
|
@tag = tag
|
7
|
-
html_attrs[:class] = class_names(html_attrs[:class]) if html_attrs[:class]
|
8
7
|
html_attrs[:data] ||= {}
|
9
8
|
html_attrs[:data][:component] = name if name.present?
|
10
|
-
html_attrs[
|
11
|
-
|
9
|
+
html_attrs["x-cloak"] = true if cloak == true
|
10
|
+
html_attrs[self.class.escape_attribute_key] = false
|
11
|
+
@html_attrs = html_attrs
|
12
12
|
end
|
13
13
|
|
14
14
|
def call
|
15
|
-
@html_attrs[Rails.version.to_f < 7.0 ? :escape_attributes : :escape] = false
|
16
15
|
tag.public_send(@tag, **@html_attrs) do
|
17
16
|
content
|
18
17
|
end
|
19
18
|
end
|
20
19
|
|
21
|
-
|
22
|
-
|
23
|
-
def convert_attrs(html_attrs)
|
24
|
-
html_attrs.map do |name, value|
|
25
|
-
[name.to_s.tr("_", "-"), value]
|
26
|
-
end.to_h
|
20
|
+
def self.escape_attribute_key
|
21
|
+
@escape_attribute_key ||= Gem::Version.new(Rails.version) < Gem::Version.new('6.1.5.1') ? :escape_attributes : :escape
|
27
22
|
end
|
28
23
|
end
|
29
24
|
end
|
@@ -1,78 +1,94 @@
|
|
1
1
|
<% content_for :shell do %>
|
2
|
-
|
3
|
-
|
4
|
-
|
2
|
+
<% if Lookbook.previews? || Lookbook.pages? %>
|
3
|
+
<%= render_component :split_layout,
|
4
|
+
alpine_data: "$store.layout.main",
|
5
|
+
":class": "$store.layout.mobile && '!block'" do |layout| %>
|
5
6
|
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
7
|
+
<% layout.pane id: "app-sidebar", class: "flex flex-col bg-lookbook-sidebar relative translate-x-0",
|
8
|
+
":class": "{
|
9
|
+
'transition': $store.layout.mobile,
|
10
|
+
'translate-x-full': $store.layout.mobile && sidebarHidden,
|
11
|
+
'!absolute right-0 bottom-0 top-[40px] h-[calc(100%_-_40px)] w-full max-w-[420px] z-50 border-l border-lookbook-divider': $store.layout.mobile
|
12
|
+
}",
|
13
|
+
"@click.outside": "closeMobileSidebar",
|
14
|
+
cloak: true do %>
|
14
15
|
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
16
|
+
<%= render_component :split_layout,
|
17
|
+
alpine_data: "$store.layout.#{Lookbook.pages? && Lookbook.previews? ? "sidebar" : "singleSectionSidebar"}",
|
18
|
+
style: "height: calc(100vh - 2.5rem);" do |layout| %>
|
19
|
+
|
20
|
+
<% if Lookbook.previews? %>
|
21
|
+
<% layout.pane class: "overflow-hidden" do %>
|
22
|
+
<%= render_component :nav,
|
23
|
+
id: "previews-nav",
|
24
|
+
collection: Lookbook.previews,
|
25
|
+
alpine_data: "$store.nav.previews",
|
26
|
+
collapse_singles: true do |nav| %>
|
27
|
+
<%= nav.toolbar do |toolbar| %>
|
28
|
+
<% toolbar.section padded: true do %>
|
29
|
+
<h4 class="pt-1">Previews</h4>
|
30
|
+
<% end %>
|
31
|
+
<% end %>
|
32
|
+
<% nav.filter store: "$store.nav.previews.filter", placeholder: "Filter previews by name…" %>
|
33
|
+
<% end %>
|
34
|
+
<% end %>
|
26
35
|
<% end %>
|
27
|
-
<% end %>
|
28
36
|
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
37
|
+
<% if Lookbook.pages? %>
|
38
|
+
<% layout.pane class: "overflow-hidden" do %>
|
39
|
+
<%= render_component :nav,
|
40
|
+
id: "pages-nav",
|
41
|
+
collection: Lookbook.pages,
|
42
|
+
alpine_data: "$store.nav.pages" do |nav| %>
|
43
|
+
<%= nav.toolbar do |toolbar| %>
|
44
|
+
<% toolbar.section padded: true do %>
|
45
|
+
<h4 class="pt-1">Pages</h4>
|
46
|
+
<% end %>
|
47
|
+
<% end %>
|
48
|
+
<% end %>
|
49
|
+
<% end %>
|
36
50
|
<% end %>
|
37
51
|
<% end %>
|
38
52
|
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
<% render_component :button, icon: :x, "@click": "hidden = !hidden" %>
|
53
|
+
<% if Lookbook::Preview.errors.any? %>
|
54
|
+
<div x-data="{hidden: false}" class="flex-none border-t border-lookbook-divider absolute bottom-0 left-0 right-0" x-show="!hidden">
|
55
|
+
<%= render_component :toolbar do |toolbar| %>
|
56
|
+
<% toolbar.section padded: true, class: "flex items-center" do %>
|
57
|
+
<%= icon :alert_triangle, size: 4, class: "text-red-700" %>
|
58
|
+
<span class="ml-2">Preview load errors</span>
|
59
|
+
<% end %>
|
60
|
+
<% toolbar.section align: :right do %>
|
61
|
+
<% render_component :button, icon: :x, "@click": "hidden = !hidden" %>
|
62
|
+
<% end %>
|
50
63
|
<% end %>
|
51
|
-
<% end %>
|
52
64
|
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
65
|
+
<div class="h-full max-h-[300px] overflow-hidden">
|
66
|
+
<div class="bg-red-50 w-full overflow-auto h-full">
|
67
|
+
<ul class="text-sm divide-y divide-red-200">
|
68
|
+
<% Lookbook::Preview.errors.each do |error| %>
|
69
|
+
<% error = error.is_a?(Lookbook::Error) ? error : Lookbook::Error.new(error) %>
|
70
|
+
<li class="px-4 py-3">
|
71
|
+
<h4 class="break-all leading-tight text-xs ">
|
72
|
+
<%= error.file_name %><%= ":#{error.line_number}" if error.line_number %>
|
73
|
+
</h4>
|
74
|
+
<pre class="text-red-800 text-xs mt-2 whitespace-pre-wrap opacity-80 font-mono"><%= error.message %></pre>
|
75
|
+
</li>
|
76
|
+
<% end %>
|
77
|
+
</ul>
|
78
|
+
</div>
|
66
79
|
</div>
|
67
80
|
</div>
|
68
|
-
|
81
|
+
<% end %>
|
69
82
|
<% end %>
|
70
|
-
<% end %>
|
71
83
|
|
72
|
-
|
73
|
-
|
84
|
+
<% layout.pane id: "app-main", class: "overflow-hidden h-full", ":class": "$store.layout.mobile && 'w-screen'" do %>
|
85
|
+
<%= content_for?(:main) ? yield(:main) : yield %>
|
86
|
+
<% end %>
|
74
87
|
<% end %>
|
75
|
-
|
88
|
+
<% else %>
|
89
|
+
<div id="app-main" class="w-screen h-full overflow-hidden">
|
90
|
+
<%= content_for?(:main) ? yield(:main) : yield %>
|
91
|
+
</div>
|
76
92
|
<% end %>
|
77
93
|
<div class="absolute opacity-0 bg-black inset-0 top-[39px] z-[-1] transition-opacity" :class="($store.layout.mobile && !sidebarHidden) && '!opacity-30 !z-40'" data-cloak></div>
|
78
94
|
<% end %>
|
@@ -5,44 +5,44 @@
|
|
5
5
|
@navigation:complete.window="$refs.scroller.scrollTop = 0">
|
6
6
|
|
7
7
|
<div class="h-full bg-lookbook-page relative">
|
8
|
-
|
9
|
-
|
10
|
-
<div class="absolute top-0 right-0 pt-1 pr-0 pl-1 pb-1 rounded-bl-md">
|
11
|
-
<div class="bg-lookbook-page opacity-90 absolute inset-0 w-full h-full z-0"></div>
|
12
|
-
<div class="relative z-10 flex items-center">
|
8
|
+
<% unless @error %>
|
13
9
|
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
10
|
+
<div class="absolute top-0 right-0 pt-1 pr-0 pl-1 pb-1 rounded-bl-md">
|
11
|
+
<div class="bg-lookbook-page opacity-90 absolute inset-0 w-full h-full z-0"></div>
|
12
|
+
<div class="relative z-10 flex items-center">
|
13
|
+
|
14
|
+
<% if @previous_page %>
|
15
|
+
<%= render_component :button,
|
16
|
+
size: :lg,
|
17
|
+
icon: :chevron_left,
|
18
|
+
tooltip: "Previous page",
|
19
|
+
href: lookbook_page_path(@previous_page.lookup_path),
|
20
|
+
class: "pr-0.5 bg-transparent" %>
|
21
|
+
<% else %>
|
22
|
+
<%= render_component :button,
|
23
|
+
size: :lg,
|
24
|
+
icon: :chevron_left,
|
25
|
+
disabled: true,
|
26
|
+
class: "opacity-50 !cursor-default pr-0.5 bg-transparent" %>
|
27
|
+
<% end %>
|
28
28
|
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
29
|
+
<% if @next_page %>
|
30
|
+
<%= render_component :button,
|
31
|
+
size: :lg,
|
32
|
+
icon: :chevron_right,
|
33
|
+
tooltip: "Next page",
|
34
|
+
href: lookbook_page_path(@next_page.lookup_path),
|
35
|
+
class: "pl-0.5 bg-transparent" %>
|
36
|
+
<% else %>
|
37
|
+
<%= render_component :button,
|
38
|
+
size: :lg,
|
39
|
+
icon: :chevron_right,
|
40
|
+
disabled: true,
|
41
|
+
class: "opacity-50 !cursor-default pl-0.5 bg-transparent" %>
|
42
|
+
<% end %>
|
43
|
+
</div>
|
43
44
|
</div>
|
44
|
-
|
45
|
-
<% end %>
|
45
|
+
<% end %>
|
46
46
|
|
47
47
|
<%= yield %>
|
48
48
|
</div>
|