card 1.97.0.1 → 1.98.0

data/mod/basic_formats/set/all/rss.rb

@@ -69,8 +69,8 @@ format :rss do
   view :comment_box      do "" end
   view :menu             do "" end
 
-  view :open,         view: :titled, mod: All::Base::Format
-  view :content,      view: :core,   mod: All::Base::Format
-  view :open_content, view: :core,   mod: All::Base::Format
-  view :closed,       view: :link,   mod: All::Base::Format
+  view :open,         :titled, mod: All::Base::Format
+  view :content,      :core,   mod: All::Base::Format
+  view :open_content, :core,   mod: All::Base::Format
+  view :closed,       :link,   mod: All::Base::Format
 end

data/mod/basic_formats/spec/set/all/json_spec.rb

@@ -14,7 +14,7 @@ RSpec.describe Card::Set::All::Json do
 
   describe "molecule view" do
     def basic_nucleus
-      Card["Basic"].format(:json).render :nucleus
+      Card[:basic].format(:json).render :nucleus
     end
 
     context "with internal link" do

data/mod/bootstrap/lib/bootstrap/component/layout.rb

@@ -40,7 +40,7 @@ class Bootstrap
         opts
       end
 
-      # @param *args column widths, column content and html attributes
+      # @param args column widths, column content and html attributes
       # @example
       #   row 6, 6, ["col one", "col two"], class: "count", id: "count"
       # @example
@@ -58,7 +58,11 @@ class Bootstrap
       # default column width type is for medium devices (col-md-)
       add_div_method :column, nil do |opts, _extra_args|
         @child_args.last.each do |medium, size|
-          prepend_class opts, "col-#{medium}-#{size.shift}"
+          if medium == :xs
+            prepend_class opts, "col-#{size.shift}"
+          else
+            prepend_class opts, "col-#{medium}-#{size.shift}"
+          end
         end
         opts
       end

data/mod/bootstrap/lib/javascript/script_load_select2.js.coffee

@@ -4,9 +4,6 @@ decko.slotReady (slot) ->
   slot.find('select:not(._no-select2)').each (_i) ->
     decko.initSelect2($(this))
 
-  # TODO: move to better place
-  $('.colorpicker-component').colorpicker()
-
 $.extend decko,
   initSelect2: (elem) ->
     if elem.length > 1
@@ -19,6 +16,14 @@ $.extend decko,
         opts.minimumResultsForSearch = elem.data("minimum-results-for-search")
       elem.select2(opts)
 
+$(window).ready ->
+  $('body').on 'select2:select', '._go-to-selected', ->
+    val = $(this).val()
+    if val != ''
+      window.location = decko.path(escape(val))
+
+  $('body').on "select2:select", "._submit-on-select", (event) ->
+      $(event.target).closest('form').submit()
 
 $.fn.cloneSelect2 = (withDataAndEvents, deepWithDataAndEvents) ->
   $old = if this.is('select') then this else this.find('select')

data/mod/bootstrap/lib/stylesheets/style_bootstrap_cards.scss

@@ -24,7 +24,7 @@ header {
 
 .d0-card-header a {
   color: $body-color;
-  &.edit-link {
+  &.edit-link, &.bridge-link {
     color: $text-muted;
   }
 }
@@ -108,10 +108,12 @@ body.mceContentBody {
   max-height: none !important;
 }
 
-.navbox-form .select2-container {
-  width: 100%
+.navbox-form {
+  min-width: 50%;
+  .select2-container {
+    width: 100%
+  }
 }
-
 /*----------- Sidebar -------------*/
 
 .row.row-offcanvas {
@@ -121,7 +123,7 @@ body.mceContentBody {
 }
 
 /* collapsed sidebar styles */
-@media screen and (max-width: 767px) {
+@media screen and (max-width: 576px) {
   .row-offcanvas {
     position: relative;
     -webkit-transition: all 0.25s ease-out;
@@ -161,7 +163,7 @@ body.mceContentBody {
   .card-slot > .d0-card-frame > .d0-card-header,
   .card-slot > .d0-card-header,
   .card-slot.labeled-view > .labeled-content > .d0-card-body,
-  .card-slot.content-view,
+  .card-slot,
   .card > .card-body,
   .card > .card-header {
     > .card-menu._show-on-hover > a {
@@ -171,7 +173,7 @@ body.mceContentBody {
   .card-slot:hover > .d0-card-frame > .d0-card-header,
   .card-slot:hover > .d0-card-header,
   .card-slot.labeled-view:hover > .labeled-content > .d0-card-body,
-  .card-slot.content-view:hover,
+  .card-slot:hover,
   .card:hover > .card-body,
   .card:hover > .card-header{
     > .card-menu._show-on-hover > a {
@@ -380,7 +382,8 @@ body.mceContentBody {
 .bar {
   border-left: 3px solid $bar_stripe_color !important;
   .bar-nav {
-    min-width: 20px;
+    width: 20px;
+    margin-left: auto;
   }
   .media {
     width: 100%
@@ -388,15 +391,81 @@ body.mceContentBody {
   .media-left {
     max-width: 25%
   }
+  .bar-body {
+    display: flex;
+  }
+  .bar-left, .bar-right, .bar-middle {
+    display: flex;
+    padding: 0.5rem;
+    flex-wrap: wrap;
+    align-items: center;
+  }
+  .bar-left {
+    font-weight: bold;
+    align-items: flex-start;
+  }
+  .bar-middle {
+    display: none;
+    justify-content: center;
+  }
+  .bar-right {
+    justify-content: flex-end;
+  }
+}
+
+@include media-breakpoint-up(md) {
+  .bar .bar-middle {
+    display: flex;
+  }
+}
+
+.bar-body {
+  border: 1px solid $border-color;
+  width: calc(100% - 20px)
+}
+
+.bar-nav {
+  display: flex;
+  flex-direction: column;
+  padding-left: 3px;
+  a {
+    color: $text-muted;
+    &:hover {
+      color: $primary;
+    }
+  }
+}
+
+@include media-breakpoint-up(sm) {
+  .bar-nav {
+    display: none;
+  }
+  .bar, .expanded-bar {
+    &:hover .bar-nav {
+      display: flex
+    }
+  }
+}
+
+.collapsed-bar {
+  display: flex;
+  justify-content: space-between;
 }
 
 .expanded-bar {
-  margin-bottom: 1em;
-  .bar-bottom {
-    padding: 1em 1em 1em 2em;
-    border: 1px solid $border-color;
-    border-top: 0;
+  margin: 0.5em 0;
+  display: flex;
+  > .bar-body {
+    > .bar {
+      border-bottom: 1px solid $border-color;
+      display: flex;
+    }
+    > .bar-bottom {
+      padding: 1em 1em 1em 2em;
+      border-top: 0;
+    }
   }
+
 }
 
 .item-box {
@@ -427,10 +496,24 @@ body.mceContentBody {
     height: 130px;
     width: 190px;
   }
+  i {
+    display: flex;
+    justify-content: center;
+    min-height: 130px;
+    align-items: center;
+    font-size: 70px;
+    color: $text-muted;
+  }
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
+.box-bottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
 .badge {
   vertical-align: text-top!important;
 }

data/mod/bootstrap/lib/stylesheets/style_select2_bootstrap.scss

@@ -468,7 +468,7 @@ $s2bs-form-control-transition: $input-transition !default;
     .select2-selection__arrow {
       position: absolute;
       bottom: 0;
-      right: $s2bs-padding-base-horizontal;
+      right: $s2bs-padding-base-horizontal / 2;
       top: 0;
       width: $s2bs-caret-width-base;
 

data/mod/bootstrap/set/abstract/bootswatch_theme.rb

@@ -20,7 +20,7 @@
 # is taken from files.
 # The bootswatch theme content is taken directly from the files in the bootswatch
 # submodule. For the rest we use code file cards.
-# Cards of type "customized skin" have the same structure but make the variables
+# Cards of type "customized bootswatch skin" have the same structure but make the variables
 # and stylesheets part editable.
 #
 # Bootswatch theme cards are machine cards for the following reason.
@@ -45,7 +45,6 @@ CONTENT_PARTS = %i[pre_variables variables post_variables stylesheets].freeze
 
 PRE_VARIABLES_CARD_NAMES = %i[
   style_jquery_ui_smoothness
-  style_right_sidebar
   bootstrap_functions
 ].freeze
 

data/mod/bootstrap/set/abstract/bootswatch_theme/html_views.rb

@@ -13,7 +13,7 @@ format :html do
   view :bar_left do
     class_up "card-title", "my-0 ml-2"
     class_up "media-left", "m-0"
-    text_with_image size: :small, title: "", text: _render_title,
+    text_with_image size: :medium, title: "", text: _render_title,
                     media_opts: { class: "align-items-center" }
     # field_nest(:image, view: :core) + wrap_with(:h4, render(:title))
   end

data/mod/bootstrap/set/all/bootstrap/dropdown.rb

@@ -0,0 +1,87 @@
+format :html do
+  def dropdown_button name, items_or_opts={}, opts={}
+    items = block_given? ? yield : items_or_opts
+    opts = items_or_opts if block_given?
+    <<-HTML
+      <div class="btn-group #{opts[:extra_css_class]}" role="group">
+        <button class="btn btn-primary dropdown-toggle"
+                data-toggle="dropdown" title="#{name}" aria-expanded="false"
+                aria-haspopup="true">
+          #{icon_tag opts[:icon] if opts[:icon]} #{name}
+          <span class="caret"></span>
+        </button>
+        #{dropdown_list items, opts[:class], opts[:active]}
+      </div>
+    HTML
+  end
+
+  def split_button main_button, active_item
+    wrap_with :div, class: "btn-group" do
+      [
+        main_button,
+        split_button_toggle,
+        dropdown_list(yield, "dropdown-menu-right", active_item)
+      ]
+    end
+  end
+
+  private
+
+  # @param items
+  #   [String] plain html
+  #   [Array<String, Array>] list of item names
+  #         If an item is an array then the first element is used as header for a section.
+  #         The second item has to be an array with the item names for that section.
+  #   [Hash] key is used to identify active item, value is the item name.
+  # @param active specifies which item to highlight as active. If items are given as array
+  #     it has to be the index of the active item. If items are given as hash it has to be
+  #     the key of that item.
+  def dropdown_list items, extra_css_class=nil, active=nil
+    wrap_with :ul, class: "dropdown-menu #{extra_css_class}", role: "menu" do
+      list =
+        case items
+        when Array
+          dropdown_array_list items, active
+        when Hash
+          dropdown_hash_list items, active
+        else
+          [items]
+        end
+      list.flatten.compact.join "\n"
+    end
+  end
+
+  def dropdown_header text
+    content_tag(:h6, text, class: "dropdown-header")
+  end
+
+  def dropdown_hash_list items, active=nil
+    items.map { |key, item| dropdown_list_item item, key, active }
+  end
+
+  def dropdown_array_list items, active=nil
+    items.map.with_index { |item, i| dropdown_list_item item, i, active }
+  end
+
+  def dropdown_list_item item, active_test, active
+    return unless item
+
+
+    if item.is_a? Array
+      [dropdown_header(item.first), dropdown_array_list(item.second)]
+    else
+      "<li class='dropdown-item#{' active' if active_test == active}'>#{item}</li>"
+    end
+  end
+
+  def split_button_toggle
+    wrap_with(:a,
+              href: "#",
+              class: "nav-link pl-0 dropdown-toggle dropdown-toggle-split",
+              "data-toggle" => "dropdown",
+              "aria-haspopup" => "true",
+              "aria-expanded" => "false") do
+      '<span class="sr-only">Toggle Dropdown</span>'
+    end
+  end
+end

data/mod/bootstrap/set/all/bootstrap/helper.rb

@@ -1,175 +1,14 @@
 format :html do
-  # same for all:
-  # :search,
-  ICON_MAP = {
-    material: {
-      plus: :add,
-      pencil: :edit,
-      trash: :delete,
-      wrench: :build,
-      new_window: :open_in_new,
-      history: :history,
-      triangle_left: :expand_less,
-      triangle_right: :expand_more,
-      flag: :flag,
-      option_horizontal: :more_horiz,
-      option_vertical: :more_vert,
-      pushpin: :pin_drop,
-      baby_formula: :device_hub,
-      log_out: :call_made,
-      log_in: :call_received,
-      explore: :explore,
-      remove: :close,
-      expand: :expand_more,
-      collapse_down: :expand_less,
-      globe: :public,
-      check_circle_o: nil,
-      commenting: :comment,
-    },
-    font_awesome: {
-      option_horizontal: :ellipsis_h,
-      pushpin: "thumb-tack",
-      globe: :globe,
-      zoom_out: "search-minus",
-      close: :remove,
-      check_circle_o: "check-circle-o",
-      check_circe: "check-circle",
-      reorder: "align-justify",
-      commenting: :commenting,
-    },
-    glyphicon: {
-      option_horizontal: "option-horizontal",
-      option_vertical: "option-vertical",
-      triangle_left: "triangle-left",
-      triangle_right: "triagnle-right",
-      baby_formula: "baby-formula",
-      log_out: "log-out",
-      log_in: "log-in",
-      collapse_down: "collaps-down",
-      globe: :globe,
-      zoom_out: "zoom-out",
-      close: :remove,
-      new_window: "new-window",
-      history: :time,
-      check_circle_o: "ok-circle",
-      check_circle: "ok-sign",
-      reorder: "align-justify"
-    }
-
-  }.freeze
-
-  def icon_class library, icon
-    ICON_MAP[library][icon] || icon
-  end
-
-  def material_icon icon, opts={}
-    universal_icon_tag icon, :material, opts
-  end
-
-  def glyphicon icon, opts={}
-    universal_icon_tag icon, :glyphicon, opts
-  end
-
-  def fa_icon icon, opts={}
-    universal_icon_tag icon, :font_awesome, opts
-  end
-
-  def icon_tag icon, opts={}
-    opts = { class: opts } unless opts.is_a? Hash
-    library = opts.delete(:library) || default_icon_library
-    universal_icon_tag icon, library, opts
-  end
-
-  def universal_icon_tag icon, icon_library=default_icon_library, opts={}
-    return "" unless icon.present?
-    opts = { class: opts } unless opts.is_a? Hash
-    icon_method = "#{icon_library}_icon_tag"
-    send icon_method, icon, opts
-  end
-
-  def default_icon_library
-    :material
-  end
-
-  def glyphicon_icon_tag icon, opts={}
-    prepend_class opts, "glyphicon glyphicon-#{icon_class(:glyphicon, icon)}"
-    wrap_with :span, "", opts.merge("aria-hidden": true)
-  end
-
-  def font_awesome_icon_tag icon, opts={}
-    prepend_class opts, "fa fa-#{icon_class(:font_awesome, icon)}"
-    wrap_with :i, "", opts
-  end
-
-  def material_icon_tag icon, opts={}
-    add_class opts, "material-icons"
-    wrap_with :i, icon_class(:material, icon), opts
-  end
-
   def button_link link_text, opts={}
     btn_type = opts.delete(:btn_type) || "primary"
     opts[:class] = [opts[:class], "btn btn-#{btn_type}"].compact.join " "
     smart_link_to link_text, opts
   end
 
-  def dropdown_button name, items_or_opts={}, opts={}
-    items = block_given? ? yield : items_or_opts
-    opts = items_or_opts if block_given?
-    <<-HTML
-      <div class="btn-group btn-group-sm #{opts[:extra_css_class]}" role="group">
-        <button class="btn btn-primary dropdown-toggle"
-                data-toggle="dropdown" title="#{name}" aria-expanded="false"
-                aria-haspopup="true">
-          #{icon_tag opts[:icon] if opts[:icon]} #{name}
-          <span class="caret"></span>
-        </button>
-        #{dropdown_list items, opts[:class], opts[:active]}
-      </div>
-    HTML
-  end
-
-  def dropdown_list items, extra_css_class=nil, active=nil
-    wrap_with :ul, class: "dropdown-menu #{extra_css_class}", role: "menu" do
-      case items
-      when Array
-        items.map.with_index { |item, i| dropdown_list_item item, i, active }
-      when Hash
-        items.map { |key, item| dropdown_list_item item, key, active }
-      else
-        [items]
-      end.compact.join "\n"
-    end
-  end
-
-  def dropdown_list_item item, active_test, active
-    return unless item
-    "<li #{'class=\'active\'' if active_test == active}>#{item}</li>"
-  end
-
   def separator
     '<li role="separator" class="divider"></li>'
   end
 
-  def split_button main_button, active_item
-    wrap_with :div, class: "btn-group btn-group-sm" do
-      [
-        main_button,
-        split_button_toggle,
-        dropdown_list(yield, nil, active_item)
-      ]
-    end
-  end
-
-  def split_button_toggle
-    button_tag(situation: "primary",
-               class: "dropdown-toggle",
-               "data-toggle" => "dropdown",
-               "aria-haspopup" => "true",
-               "aria-expanded" => "false") do
-      '<span class="caret"></span><span class="sr-only">Toggle Dropdown</span>'
-    end
-  end
-
   def list_group content_or_options=nil, options={}
     options = content_or_options if block_given?
     content = block_given? ? yield : content_or_options