lookbook 1.3.1 → 1.3.4

data/app/components/lookbook/code/highlight_github.css

@@ -0,0 +1,406 @@
+.theme-github {
+  --dark-bg: #111111;
+  --dark-gray-1: #404040;
+  --dark-gray-2: #d0d0d0;
+  --dark-gray-3: #cccccc;
+  --dark-gray-4: #777777;
+  --dark-gray-5: #aaaaaa;
+  --dark-gray-6: #bbbbbb;
+  --dark-gray-7: #666666;
+  --dark-blue-1: #3677a9;
+  --dark-blue-2: #24909d;
+  --dark-blue-3: #447fcf;
+  --dark-blue-4: #009988;
+  --dark-red-1: #a61717;
+  --dark-red-2: #331111;
+  --dark-red-3: #e50808;
+  --dark-red-4: #520000;
+  --dark-red-5: #d22323;
+  --dark-red-6: #cd2828;
+  --dark-yellow-1: #e9b96e;
+  --dark-yellow-2: #ffa500;
+  --dark-orange: #d2691e;
+  --dark-white: #ffffff;
+  --dark-green-1: #589819;
+  --dark-green-2: #6ab825;
+  --dark-green-3: #44ccaa;
+
+  --light-bg: #ffffff;
+  --light-gray-1: #f8f8f8;
+  --light-gray-2: #27272a;
+  --light-gray-3: #cccccc;
+  --light-gray-4: #888888;
+  --light-gray-5: #999999;
+  --light-gray-6: #555555;
+  --light-gray-7: #bbbbbb;
+  --light-yellow-1: #999988;
+  --light-red-1: #a61717;
+  --light-red-2: #e3d2d2;
+  --light-red-3: #dd1144;
+  --light-red-4: #ffdddd;
+  --light-red-5: #aa0000;
+  --light-red-6: #990000;
+  --light-purple-1: #800080;
+  --light-purple-2: #990073;
+  --light-black: #000000;
+  --light-green-1: #ddffdd;
+  --light-green-2: #009926;
+  --light-blue-1: #445588;
+  --light-blue-2: #009999;
+  --light-blue-3: #008080;
+  --light-blue-4: #0086b3;
+  --light-blue-5: #3c5d5d;
+  --light-blue-6: #000080;
+
+  --hl-bg: var(--light-bg);
+  --hl-hll-bg: var(--light-gray-1);
+  --hl-border: var(--light-gray-3);
+  --hl-line-number: var(--light-gray-2);
+  --hl-comment: var(--light-yellow-1);
+  --hl-comment-preproc: var(--light-gray-5);
+  --hl-comment-special-fg: var(--light-gray-5);
+  --hl-comment-special-bg: transparent;
+  --hl-error-fg: var(--light-red-1);
+  --hl-error-bg: var(--light-red-2);
+  --hl-subtle-fg: var(--light-gray-2);
+  --hl-entity: var(--light-purple-1);
+  --hl-keyword: var(--light-black);
+  --hl-output: var(--light-gray-4);
+  --hl-operator: var(--light-black);
+  --hl-punctuation: var(--light-gray-6);
+  --hl-string: var(--light-red-3);
+  --hl-string-other: var(--light-red-3);
+  --hl-string-regex: var(--light-green-2);
+  --hl-string-symbol: var(--light-purple-2);
+  --hl-deleted-fg: var(--light-black);
+  --hl-deleted-bg: var(--light-red-4);
+  --hl-danger: var(--light-red-5);
+  --hl-heading: var(--light-gray-5);
+  --hl-inserted-fg: var(--light-black);
+  --hl-inserted-bg: var(--light-green-1);
+  --hl-prompt: var(--light-gray-6);
+  --hl-subheading: var(--light-purple-1);
+  --hl-keyword-crude: var(--light-black);
+  --hl-keyword-subtle: var(--light-blue-1);
+  --hl-number: var(--light-blue-2);
+  --hl-attribute: var(--light-blue-3);
+  --hl-builtin: var(--light-blue-4);
+  --hl-builtin-pseudo: var(--light-gray-5);
+  --hl-class: var(--light-blue-1);
+  --hl-variable: var(--light-blue-3);
+  --hl-decorator: var(--light-blue-5);
+  --hl-exception: var(--light-red-6);
+  --hl-function: var(--light-red-6);
+  --hl-namespace: var(--light-gray-6);
+  --hl-tag: var(--light-blue-6);
+  --hl-word: var(--light-black);
+  --hl-whitespace: var(--light-gray-7);
+
+  &.dark {
+    --hl-bg: var(--dark-bg);
+    --hl-hll-bg: var(--dark-gray-1);
+    --hl-border: var(--dark-gray-4);
+    --hl-line-number: var(--dark-gray-2);
+    --hl-comment: var(--dark-blue-1);
+    --hl-comment-preproc: var(--dark-orange);
+    --hl-comment-special-fg: var(--dark-red-3);
+    --hl-comment-special-bg: var(--dark-red-4);
+    --hl-error-fg: var(--dark-red-1);
+    --hl-error-bg: var(--dark-red-2);
+    --hl-subtle-fg: var(--dark-gray-2);
+    --hl-entity: var(--dark-gray-2);
+    --hl-keyword: var(--dark-gray-3);
+    --hl-output: var(--dark-gray-3);
+    --hl-operator: var(--dark-gray-4);
+    --hl-punctuation: var(--dark-yellow-1);
+    --hl-string: var(--dark-orange);
+    --hl-string-other: var(--dark-yellow-2);
+    --hl-string-regex: var(--dark-red-6);
+    --hl-string-symbol: var(--dark-orange);
+    --hl-deleted-fg: var(--dark-red-5);
+    --hl-deleted-bg: transparent;
+    --hl-danger: var(--dark-red-5);
+    --hl-heading: var(--dark-white);
+    --hl-inserted-fg: var(--dark-green-1);
+    --hl-inserted-bg: transparent;
+    --hl-prompt: var(--dark-gray-5);
+    --hl-subheading: var(--dark-white);
+    --hl-keyword-crude: var(--dark-green-2);
+    --hl-keyword-subtle: var(--dark-green-2);
+    --hl-number: var(--dark-red-6);
+    --hl-attribute: var(--dark-gray-6);
+    --hl-builtin: var(--dark-blue-2);
+    --hl-builtin-pseudo: var(--dark-blue-2);
+    --hl-class: var(--dark-blue-3);
+    --hl-variable: var(--dark-green-3);
+    --hl-decorator: var(--dark-yellow-2);
+    --hl-exception: var(--dark-gray-6);
+    --hl-function: var(--dark-blue-4);
+    --hl-namespace: var(--dark-blue-3);
+    --hl-tag: var(--dark-green-2);
+    --hl-word: var(--dark-green-2);
+    --hl-whitespace: var(--dark-gray-7);
+  }
+}
+
+.theme-github {
+  background-color: var(--hl-bg);
+
+  .line-numbers {
+    background-color: var(--hl-bg);
+    border-color: var(--hl-border);
+    color: var(--hl-line-number);
+  }
+
+  .highlight {
+    .hll {
+      background-color: var(--hl-hll-bg);
+    }
+    .c {
+      color: var(--hl-comment);
+      font-style: italic;
+    } /* Comment */
+    .err {
+      color: var(--hl-error-fg);
+      background-color: var(--hl-error-bg);
+    } /* Error */
+    .g {
+      color: var(--hl-subtle-fg);
+    } /* Generic */
+    .k {
+      color: var(--hl-keyword);
+      font-weight: bold;
+    } /* Keyword; catches prefixes and css3 */
+    .l {
+      color: var(--hl-subtle-fg);
+    } /* Literal */
+    .n,
+    .h {
+      color: var(--hl-keyword);
+    } /* Name */
+    .o {
+      color: var(--hl-operator);
+      font-weight: bold;
+    } /* Operator */
+    .x {
+      color: var(--hl-subtle-fg);
+    } /* Other */
+    .p {
+      color: var(--hl-punctuation);
+    } /* Punctuation */
+    .cm {
+      color: var(--hl-comment);
+      font-style: italic;
+    } /* Comment.Multiline */
+    .cp {
+      color: var(--hl-comment-preproc);
+      font-weight: bold;
+    } /* Comment.Preproc */
+    .c1 {
+      color: var(--hl-comment);
+      font-style: italic;
+    } /* Comment.Single */
+    .cs {
+      color: var(--hl-comment-special-fg);
+      background-color: var(--hl-comment-special-bg);
+      font-weight: bold;
+      font-style: italic;
+    } /* Comment.Special */
+    .gd {
+      color: var(--hl-deleted-fg);
+      background-color: var(--hl-deleted-bg);
+    } /* Generic.Deleted */
+    .ge {
+      color: var(--hl-subtle-fg);
+      font-style: italic;
+    } /* Generic.Emph */
+    .gr {
+      color: var(--hl-danger);
+    } /* Generic.Error */
+    .gh {
+      color: var(--hl-heading);
+    } /* Generic.Heading */
+    .gi {
+      color: var(--hl-inserted-fg);
+      background-color: var(--hl-inserted-bg);
+    } /* Generic.Inserted */
+    .go {
+      color: var(--hl-output);
+    } /* Generic.Output */
+    .gp {
+      color: var(--hl-prompt);
+    } /* Generic.Prompt */
+    .gs {
+      color: var(--hl-subtle-fg);
+      font-weight: bold;
+    } /* Generic.Strong */
+    .gu {
+      color: var(--hl-subheading);
+      font-weight: bold;
+    } /* Generic.Subheading */
+    .gt {
+      color: var(--hl-danger);
+    } /* Generic.Traceback */
+    .kc {
+      color: var(--hl-keyword-crude);
+      font-weight: bold;
+    } /* Keyword.Constant */
+    .kd {
+      color: var(--hl-keyword-crude);
+      font-weight: bold;
+    } /* Keyword.Declaration */
+    .kn {
+      color: var(--hl-keyword-crude);
+      font-weight: bold;
+    } /* Keyword.Namespace */
+    .kp {
+      color: var(--hl-keyword-crude);
+      font-weight: bold;
+    } /* Keyword.Pseudo */
+    .kr {
+      color: var(--hl-keyword-crude);
+      font-weight: bold;
+    } /* Keyword.Reserved */
+    .kt {
+      color: var(--hl-keyword-subtle);
+      font-weight: bold;
+    } /* Keyword.Type */
+    .ld {
+      color: var(--hl-subtle-fg);
+    } /* Literal.Date */
+    .m {
+      color: var(--hl-number);
+    } /* Literal.Number */
+    .s {
+      color: var(--hl-string);
+    } /* Literal.String */
+    .na {
+      color: var(--hl-attribute);
+    } /* Name.Attribute */
+    .nb {
+      color: var(--hl-builtin);
+    } /* Name.Builtin */
+    .nc {
+      color: var(--hl-class);
+      font-weight: bold;
+    } /* Name.Class */
+    .no {
+      color: var(--hl-variable);
+    } /* Name.Constant */
+    .nd {
+      color: var(--hl-decorator);
+    } /* Name.Decorator */
+    .ni {
+      color: var(--hl-entity);
+    } /* Name.Entity */
+    .ne {
+      color: var(--hl-exception);
+      font-weight: bold;
+    } /* Name.Exception */
+    .nf {
+      color: var(--hl-function);
+      font-weight: bold;
+    } /* Name.Function */
+    .nl {
+      color: var(--hl-subtle-fg);
+    } /* Name.Label */
+    .nn {
+      color: var(--hl-namespace);
+    } /* Name.Namespace */
+    .nx {
+      color: var(--hl-subtle-fg);
+    } /* Name.Other */
+    .py {
+      color: var(--hl-subtle-fg);
+    } /* Name.Property */
+    .nt {
+      color: var(--hl-tag);
+    } /* Name.Tag */
+    .nv {
+      color: var(--hl-variable);
+    } /* Name.Variable */
+    .ow {
+      color: var(--hl-word);
+      font-weight: bold;
+    } /* Operator.Word */
+    .w {
+      color: var(--hl-whitespace);
+    } /* Text.Whitespace */
+    .mf {
+      color: var(--hl-number);
+    } /* Literal.Number.Float */
+    .mh {
+      color: var(--hl-number);
+    } /* Literal.Number.Hex */
+    .mi {
+      color: var(--hl-number);
+    } /* Literal.Number.Integer */
+    .mo {
+      color: var(--hl-number);
+    } /* Literal.Number.Oct */
+    .sb {
+      color: var(--hl-string);
+    } /* Literal.String.Backtick */
+    .sc {
+      color: var(--hl-string);
+    } /* Literal.String.Char */
+    .sd {
+      color: var(--hl-string);
+    } /* Literal.String.Doc */
+    .s2 {
+      color: var(--hl-string);
+    } /* Literal.String.Double */
+    .se {
+      color: var(--hl-string);
+    } /* Literal.String.Escape */
+    .sh {
+      color: var(--hl-string);
+    } /* Literal.String.Heredoc */
+    .si {
+      color: var(--hl-string);
+    } /* Literal.String.Interpol */
+    .sx {
+      color: var(--hl-string-other);
+    } /* Literal.String.Other */
+    .sr {
+      color: var(--hl-string-regex);
+    } /* Literal.String.Regex */
+    .s1 {
+      color: var(--hl-string);
+    } /* Literal.String.Single */
+    .ss {
+      color: var(--hl-string-symbol);
+    } /* Literal.String.Symbol */
+    .bp {
+      color: var(--hl-builtin-pseudo);
+    } /* Name.Builtin.Pseudo */
+    .vc {
+      color: var(--hl-variable);
+    } /* Name.Variable.Class */
+    .vg {
+      color: var(--hl-variable);
+    } /* Name.Variable.Global */
+    .vi {
+      color: var(--hl-variable);
+    } /* Name.Variable.Instance */
+    .il {
+      color: var(--hl-number);
+    } /* Literal.Number.Integer.Long */
+
+    /* Make line numbers unselectable: excludes line numbers from copy-paste user ops */
+    .line-number {
+      -webkit-user-select: none;
+      -moz-user-select: none;
+    }
+
+    /* Mozilla specific */
+    .line-number::-moz-selection {
+      background-color: transparent;
+    }
+
+    /* Other major browsers */
+    .line-number::selection {
+      background-color: transparent;
+    }
+  }
+}

data/app/components/lookbook/nav/item/component.html.erb

@@ -8,7 +8,7 @@
   cloak: true do %>
   <%= lookbook_tag href.present? ? :a : :button,
     href: href,
-    class: "flex items-center py-1 select-none cursor-pointer text-lookbook-nav-text hover:bg-lookbook-nav-item-hover transition",
+    class: "flex w-full items-center py-1 select-none cursor-pointer text-lookbook-nav-text hover:bg-lookbook-nav-item-hover transition",
     style: "padding-left: #{left_pad}px",
     "x-bind": "bindings.#{href.present? ? "link" : "toggle"}" do %>
     <div class="relative flex items-center w-full">

data/app/components/lookbook/params/editor/component.html.erb

@@ -1,5 +1,5 @@
-<%= render_component_tag class: "p-4 overflow-hidden" do %>
-  <div class="bg-white border border-lookbook-divider rounded-md overflow-x-auto">
+<%= render_component_tag class: "overflow-hidden" do %>
+  <div class="bg-lookbook-params-editor-bg border border-lookbook-divider rounded-md overflow-x-auto">
     <table class="border-collapse w-full" :class="narrow && 'linear'">
       <thead>
         <tr>

data/app/components/lookbook/params/field/component.css

@@ -3,7 +3,7 @@
     table:not(.linear) {
       thead {
         tr {
-          @apply border-b border-gray-300;
+          @apply border-b border-lookbook-divider;
         }
 
         th {
@@ -21,7 +21,7 @@
 
       tbody {
         tr + tr td {
-          @apply border-t border-gray-200;
+          @apply border-t border-lookbook-divider;
         }
 
         td {
@@ -53,7 +53,7 @@
       }
 
       tr:not(:last-child) {
-        @apply border-b border-gray-200;
+        @apply border-b border-lookbook-divider;
       }
 
       tr {

data/app/components/lookbook/split_layout/component.html.erb

@@ -2,7 +2,7 @@
   <% panes.each.with_index(1) do |pane, i| %>
     <%= pane %>
     <% if i < panes.size %>
-      <div class="bg-lookbook-divider relative" x-init="registerGutter">
+      <div class="bg-lookbook-divider relative z-50" x-init="registerGutter">
         <div class="absolute z-10 bg-transparent hover:bg-lookbook-draggable-hint transition-all" :class="{
           'w-[9px] h-full -translate-x-1/2 cursor-[col-resize]': vertical,
           'h-[9px] w-full -translate-y-1/2 cursor-[row-resize]': horizontal

data/app/components/lookbook/tag_component.rb

@@ -19,7 +19,7 @@ module Lookbook
     end
 
     def self.escape_attribute_key
-      @escape_attribute_key ||= Gem::Version.new(Rails.version) < Gem::Version.new("6.1.5.1") ? :escape_attributes : :escape
+      @escape_attribute_key ||= (Gem::Version.new(Rails.version) < Gem::Version.new("6.1.5.1")) ? :escape_attributes : :escape
     end
   end
 end

data/app/components/lookbook/viewport/component.css

@@ -4,7 +4,7 @@
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cg fill='%23f3f3f3' fill-opacity='1'%3E%3Cpath fill-rule='evenodd' d='M0 0h4v4H0V0zm4 4h4v4H4V4z'/%3E%3C/g%3E%3C/svg%3E");
 
     .resize-handle {
-      @apply flex items-center justify-center h-full w-full border-lookbook-divider bg-lookbook-viewport-handle hover:bg-lookbook-draggable-hint hover:bg-opacity-20;
+      @apply flex items-center justify-center h-full w-full border-lookbook-divider bg-lookbook-viewport-handle hover:bg-lookbook-viewport-handle-hover hover:bg-opacity-20;
       @apply text-lookbook-viewport-handle-icon-stroke hover:text-lookbook-viewport-handle-icon-stroke-hover transition select-none touch-none;
     }
   }

data/app/components/lookbook/viewport/component.html.erb

@@ -27,7 +27,7 @@
       style="width: calc(100% + 2px); height: calc(100% + 1px); <%= "max-height: #{@max_height}px;" if @max_height.present? %>">
       <iframe seamless<%= " id=#{@iframe_id}" if @iframe_id.present? %>
         x-ref="iframe"
-        class="h-full w-full border border-lookbook-divider"
+        class="bg-lookbook-page-bg h-full w-full border border-lookbook-divider"
         :class="{ 'pointer-events-none': reflowing }"
         style="<%= "max-height: #{@max_height}px;" if @max_height.present? %>"
         src="<%= @src %>"

data/app/components/lookbook/viewport/component.rb

@@ -10,7 +10,7 @@ module Lookbook
     end
 
     def generate_id(*args)
-      args.map { |args| args.delete_prefix("/").tr("&?=/_\-", "-") }.join("-")
+      args.map { |args| args.delete_prefix("/").tr("&?=/_-", "-") }.join("-")
     end
 
     protected

data/app/controllers/concerns/lookbook/targetable_concern.rb

@@ -103,7 +103,7 @@ module Lookbook
       }
 
       preview = @preview
-      target_examples = @target.type == :group ? @target.examples : [@target]
+      target_examples = (@target.type == :group) ? @target.examples : [@target]
 
       examples = target_examples.map do |example|
         render_args = @preview.render_args(example.name, params: preview_controller.params)
@@ -118,7 +118,7 @@ module Lookbook
         example
       end
 
-      target = @target.type == :group ? @target : examples.find { |e| e.lookup_path == @target.lookup_path }
+      target = (@target.type == :group) ? @target : examples.find { |e| e.lookup_path == @target.lookup_path }
 
       params_ref = @params
       preview.define_singleton_method(:params, proc { params_ref })

data/app/helpers/lookbook/application_helper.rb

@@ -27,7 +27,7 @@ module Lookbook
     end
 
     def generate_id(*args)
-      args.map { |args| args.delete_prefix("/").tr("&?=/_\-", "-") }.join("-")
+      args.map { |args| args.delete_prefix("/").tr("&?=/_-", "-") }.join("-")
     end
   end
 end

data/app/views/lookbook/inspector/panels/_notes.html.erb

@@ -2,7 +2,7 @@
 <% if items.many? %>
   <div class="divide-y divide-dashed divide-lookbook-divider bg-lookbook-prose-bg h-full w-full">
     <% items.each do |item| %>
-      <div class="px-4 py-6 relative">
+      <div class="p-4 relative">
         <h6 class="italic font-mono mb-4 opacity-40">
           # <%= item.label %>
         </h6>
@@ -11,7 +11,7 @@
     <% end %>
   </div>
 <% else %>
-  <div class="px-4 py-6 bg-lookbook-prose-bg w-full h-full">
+  <div class="p-4 w-full h-full bg-lookbook-prose-bg">
     <%= lookbook_render :prose do %>
       <%== items.any? ? items.first.notes : "<em class='opacity-50'>No notes provided.</em>" %>
     <% end %>

data/app/views/lookbook/inspector/panels/_params.html.erb

@@ -5,7 +5,7 @@
     <% end %>
   </div>
 <% else %>
-  <div class="h-full overflow-x-hidden">
+  <div class="p-4 w-full h-full overflow-x-hidden">
     <%= lookbook_render "params/editor" do |editor| %>
       <% @params.each do |param| %>
         <% editor.field param: param %>

data/config/app.yml

@@ -17,6 +17,9 @@ shared:
     highlight: true
     with_toc_data: true
     lax_spacing: true
+  highlighter_options:
+    theme: github
+    dark: false
   sort_examples: false
   preview_paths: []
   preview_display_options: {}

data/lib/lookbook/page.rb

@@ -26,7 +26,7 @@ module Lookbook
       @content = ""
       @page_name = remove_position_prefix(path_name)
       @rel_path = @pathname.relative_path_from(@base_path)
-      page_path = @rel_path.dirname.to_s == "." ? @page_name : "#{@rel_path.dirname}/#{@page_name}"
+      page_path = (@rel_path.dirname.to_s == ".") ? @page_name : "#{@rel_path.dirname}/#{@page_name}"
       extract_frontmatter(file_contents)
       super(page_path)
     end

data/lib/lookbook/services/code/code_beautifier.rb

@@ -12,7 +12,7 @@ module Lookbook
     def call
       language = opts.fetch(:language, "html")
       stripped_source = source.strip
-      result = language.downcase == "html" ? HtmlBeautifier.beautify(stripped_source, opts) : stripped_source
+      result = (language.downcase == "html") ? HtmlBeautifier.beautify(stripped_source, opts) : stripped_source
       result.to_s.strip.html_safe
     rescue
       source.strip.html_safe

data/lib/lookbook/services/code/code_highlighter.rb

@@ -11,7 +11,7 @@ module Lookbook
     end
 
     def opts
-      @opts.is_a?(String) || @opts.is_a?(Symbol) ? {language: @opts} : @opts.to_h
+      (@opts.is_a?(String) || @opts.is_a?(Symbol)) ? {language: @opts} : @opts.to_h
     end
 
     def call

data/lib/lookbook/stores/config_store.rb

@@ -10,7 +10,7 @@ module Lookbook
     end
 
     def project_name=(name)
-      store[:project_name] = name == false ? nil : name
+      store[:project_name] = (name == false) ? nil : name
     end
 
     def page_paths=(paths = nil)
@@ -43,6 +43,10 @@ module Lookbook
       store[:markdown_options].merge!(options.to_h)
     end
 
+    def highlighter_options=(options = nil)
+      store[:highlighter_options].merge!(options.to_h)
+    end
+
     def ui_theme=(name)
       name = name.to_s
       if Theme.valid_theme?(name)

data/lib/lookbook/stores/panel_store.rb

@@ -96,7 +96,7 @@ module Lookbook
       config.each do |group, panels|
         panels.map! do |opts|
           opts.transform_values! do |value|
-            value.is_a?(String) && value.start_with?("->") ? eval(value) : value # standard:disable Security/Eval
+            (value.is_a?(String) && value.start_with?("->")) ? eval(value) : value # standard:disable Security/Eval
           end
         end
       end
@@ -111,7 +111,7 @@ module Lookbook
     end
 
     def insert_index(position, items_count)
-      index = position == 0 ? 1 : (position || 0).to_int
+      index = (position == 0) ? 1 : (position || 0).to_int
       last_position = items_count + 1
       index = last_position if index > last_position
       index - 1

data/lib/lookbook/support/store.rb

@@ -71,7 +71,7 @@ module Lookbook
     protected
 
     def normalize_value(value)
-      @recursive && !value.is_a?(Store) && value.is_a?(Hash) ? Store.new(value, recursive: @recursive) : value
+      (@recursive && !value.is_a?(Store) && value.is_a?(Hash)) ? Store.new(value, recursive: @recursive) : value
     end
   end
 end

data/lib/lookbook/tags/position_tag.rb

@@ -5,7 +5,7 @@ module Lookbook
     def value
       if text.present?
         int = text.to_i
-        int == 0 ? DEFAULT_POSITION : int
+        (int == 0) ? DEFAULT_POSITION : int
       else
         DEFAULT_POSITION
       end

data/lib/lookbook/theme.rb

@@ -12,6 +12,14 @@ module Lookbook
       blue: {
         favicon_light_mode: "#2563EB",
         favicon_dark_mode: "#60A5FA"
+      },
+      green: {
+        favicon_light_mode: "#16a34a",
+        favicon_dark_mode: "#66E093"
+      },
+      rose: {
+        favicon_light_mode: "#E11D48",
+        favicon_dark_mode: "#FFA0B5"
       }
     }
 

data/lib/lookbook/version.rb

@@ -1,3 +1,3 @@
 module Lookbook
-  VERSION = "1.3.1"
+  VERSION = "1.3.4"
 end