mumuki-laboratory 9.0.2 → 9.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3bfbac4c5667f84f0ef0365430b3b8b22bb421d0149a906bff69f7ad8116200a
-  data.tar.gz: b3a2468082c345db35724748e1e1d992e1a7fd0e4688a480040e873ac5d94650
+  metadata.gz: 07b2e50b039758471cfb6e6ce92b5c72de56a3d6edbcc1ddbcdfd12422b51f34
+  data.tar.gz: 69b54d57063273a7f3dee32e42126eff821332dbe8acec8f8337f91f1b929b90
 SHA512:
-  metadata.gz: 228622d76f975543bac60f7b62f3f1ff28fb831934b1841e2fe1e4faaf6ed31b4301d30815c160c1aaa0b0751df34b056eec22ae0e56fc660261949deb40dd34
-  data.tar.gz: a5e86b47de449d68553f162bafa77a69c7dc850bbb65efa3ab1c1401c3091da5979453b50d306a1d8a95973ffc29a66ce6f6b9bd2c29e29192c83c0a68d887e3
+  metadata.gz: 4acb2a84b7b526ceebc4be7daf104e9a9d614c5659ab853da9614b16b1d3caffdc42c2cfce3fcdb22ee69e364d1339405291644dcf8b8f213e3756daf29d11de
+  data.tar.gz: 83e3a2120935b9b87c004d11fbd599ffe3a92093ab2decc2f787a905a4d0c50edb964390275f06452883213d42c03c35832281ad5963340d8f41f5b691b1e23c

data/app/assets/javascripts/mumuki_laboratory/application/faqs.js

@@ -32,9 +32,8 @@ mumuki.faqs = class {
   }
 
   _createNavbarItem($faqsNavbar, faqGroup) {
-    const $newLink = $('<a></a>').attr("href",`#${faqGroup.id}`)
-      .html(`${faqGroup.children[0].textContent}`);
-    const $navItem = $('<li></li>').html($newLink);
+    const $navItem = $(`<li><a href="#${faqGroup.id}">`)
+      .html(`${faqGroup.querySelector('h2').textContent}`);
     $faqsNavbar.append($navItem);
     return $navItem;
   }
@@ -51,8 +50,19 @@ mumuki.faqs = class {
   _createFaqsGroups() {
     const elemsGroups = this._buildFaqsGroups();
     elemsGroups.forEach((group, index) => {
-      $(group).wrapAll(`<div class='mu-faqs-group' id='mu-faqs-group-${index}'>`)
+      $(group).wrapAll(`<div class='mu-faqs-group' id='mu-faqs-group-${index}'>`);
     });
+    this._createFaqsIcons();
+  }
+
+  _createFaqsIcons() {
+    const $faqIcon = $('<i class="mu-faqs-group-icon fa fa-plus">');
+    $faqIcon.click(function(e){
+      const $elem = $(this);
+      $elem.toggleClass('fa-plus fa-minus');
+      $elem.closest('.mu-faqs-group').toggleClass('active');
+    })
+    $('.mu-faqs-group').prepend($faqIcon);
   }
 
   _buildFaqsGroups() {

data/app/assets/javascripts/mumuki_laboratory/application/user.js

@@ -1,9 +1,20 @@
 mumuki.load(() => {
-  var hash = document.location.hash;
-  if (hash) {
-    $(".nav-tabs a[data-target='" + hash + "']").tab('show');
+  const $userMenuHeader = $('.mu-user-menu-header');
+  let onUserProfile = document.querySelector('.mu-profile-info') !== null;
+
+  $userMenuHeader.click(() => {
+    $('.mu-user-menu-items').toggleClass('hidden-sm-screen');
+    $('#mu-user-menu-header-icon').toggleClass('fa-chevron-up fa-chevron-down');
+  });
+
+  if (onUserProfile) {
+    $userMenuHeader.click();
   }
-  $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
-    window.location.hash = $(e.target).attr('data-target');
+
+  $('.mu-user-menu-item .active').click((e) => {
+    if (onUserProfile) {
+      e.preventDefault();
+      $userMenuHeader.click();
+    }
   });
 });

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_faqs.scss

@@ -1,11 +1,14 @@
 .mu-faqs-container {
   position: relative;
   display: table;
+  width: 100%;
 
   .mu-faqs-content {
     padding-top: 50px;
 
-    @media (min-width: $container-sm) {
+    width: 100%;
+
+    @media (min-width: 768px) {
       width: 75%;
       float: right;
     }
@@ -14,14 +17,37 @@
       padding: 32px;
       box-shadow: 0 0.375em 2.8125em 0 #d2d5d9;
       margin-bottom: 32px;
+
+      @media (max-width: 767px) {
+        &:not(.active) {
+          h3, p {
+            display: none
+          }
+          h2 {
+            margin-bottom: 0px;
+          }
+        }
+      }
+
       h2 {
         margin-top: 0;
         margin-bottom: 20px;
       }
+
       h3 {
         color: #1A94A3; // should be $brand-secondary
         margin-top: 40px;
       }
+
+      .mu-faqs-group-icon {
+        float: right;
+        margin-top: 10px;
+        cursor: pointer;
+        display: none;
+        @media (max-width: 767px) {
+          display: unset;
+        }
+      }
     }
   }
 
@@ -31,10 +57,6 @@
     width: 25%;
     padding-top: 50px;
 
-    @media (min-width: $container-sm) {
-      display: hidden;
-    }
-
     ul {
       border-left: 1px solid $mu-color-disabled;
       list-style: none;

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_user_menu.scss

@@ -1,12 +1,41 @@
 .mu-user-menu {
   display: flex;
+  margin-top: 25px;
+}
+
+.mu-user-menu-content {
+  flex-grow: 1;
 }
 
 .mu-user-menu-header {
   font-size: 15px;
   color: $mu-color-disabled;
   text-transform: uppercase;
-  margin-bottom: 30px;
+  padding-left: 2px;
+  cursor: pointer;
+
+  @media only screen and (min-width: $screen-md-min) {
+    padding-left: 15px;
+    cursor: auto;
+
+    i {
+      display: none;
+    }
+
+    span {
+      padding-left: 0px;
+    }
+  }
+}
+
+.mu-user-menu-items {
+  margin-top: 30px;
+
+  &.hidden-sm-screen {
+    @media only screen and (max-width: $screen-sm-max) {
+      display: none;
+    }
+  }
 }
 
 .mu-user-menu-item {
@@ -30,6 +59,5 @@
     border-top: 2px solid $mu-color-separator;
 
     margin: 25px 0;
-    width: 100%
   }
 }

data/app/helpers/user_menu_helper.rb

@@ -1,22 +1,36 @@
 module UserMenuHelper
+  def user_menu_header
+    content_tag :div, user_menu_header_icon, class: 'mu-user-menu-header'
+  end
+
+  def user_menu_divider
+    content_tag :div, '', class: 'mu-user-menu-divider horizontal'
+  end
+
   def profile_user_menu_link
-    user_menu_link t(:my_profile), user_path, 'show'
+    user_menu_item t(:my_profile), user_path, 'show'
   end
 
   def messages_user_menu_link
-    user_menu_link t(:messages), messages_user_path, 'messages'
+    user_menu_item t(:messages), messages_user_path, 'messages'
   end
 
   def discussions_user_menu_link
-    user_menu_link t(:discussions), discussions_user_path, 'discussions'
+    user_menu_item t(:discussions), discussions_user_path, 'discussions' if current_user&.can_discuss_here?
   end
 
   def certificates_user_menu_link
-    user_menu_link t(:certificates), certificates_user_path, 'certificates'
+    user_menu_item t(:certificates), certificates_user_path, 'certificates'
   end
 
-  def user_menu_link(label, path, active_on)
+  private
+
+  def user_menu_item(label, path, active_on)
     link_klass = 'active' if action_name == active_on
-    link_to label, path, { class: link_klass }.compact
+    content_tag :div, link_to(label, path, { class: link_klass }.compact), class: 'mu-user-menu-item'
+  end
+
+  def user_menu_header_icon
+    fa_icon('chevron-down', text: t(:my_account), id: 'mu-user-menu-header-icon', right: true)
   end
 end

data/app/views/faqs/index.html.erb

@@ -1,3 +1,7 @@
+<% content_for :breadcrumbs do %>
+  <%= header_breadcrumbs %>
+<% end %>
+
 <div class="mu-faqs">
   <h1><%= t(:faqs) %></h1>
 
@@ -5,7 +9,7 @@
     <div class="mu-faqs-content">
       <%= @faqs %>
     </div>
-    <div class="mu-faqs-navbar">
+    <div class="mu-faqs-navbar hidden-xs">
       <nav>
         <ul>
         </ul>

data/app/views/layouts/_user_menu.html.erb

@@ -1,25 +1,17 @@
-<div class="col-md-3 mu-tab-body mu-user-menu">
-  <div class="col-md-12">
-    <div class="mu-user-menu-header">
-      <%= t(:my_account) %>
-    </div>
-    <div class="mu-user-menu-item">
-      <%= profile_user_menu_link %>
-    </div>
-    <div class="mu-user-menu-divider horizontal"></div>
-    <div class="mu-user-menu-item">
-      <%= messages_user_menu_link %>
-    </div>
-    <% if current_user&.can_discuss_here? %>
-      <div class="mu-user-menu-item">
+<div class="col-md-3 mu-tab-body">
+  <div class="mu-user-menu">
+    <div class="mu-user-menu-content">
+      <%= user_menu_header %>
+      <div class="col-xs-12 mu-user-menu-items hidden-sm-screen">
+        <%= profile_user_menu_link %>
+        <%= user_menu_divider %>
+        <%= messages_user_menu_link %>
         <%= discussions_user_menu_link %>
+        <%= user_menu_divider %>
+        <%= certificates_user_menu_link %>
       </div>
-    <% end %>
-    <div class="mu-user-menu-divider horizontal"></div>
-    <div class="mu-user-menu-item">
-      <%= certificates_user_menu_link %>
     </div>
+    <div class="mu-user-menu-divider vertical hidden-sm hidden-xs"></div>
   </div>
-  <div class="mu-user-menu-divider vertical hidden-sm hidden-xs"></div>
 </div>
 <div class="mu-user-menu-divider horizontal visible-sm visible-xs"></div>

data/app/views/users/certificates.html.erb

@@ -4,15 +4,15 @@
 
 <%= render partial: 'layouts/user_menu' %>
 
-<div class="mu-user-header">
-  <h1><%= t(:certificates) %></h1>
-</div>
-<% if @certificates.empty? %>
-  <div class="mu-tab-body">
-    <%= t :certificates_will_be_here %>
+<div class="col-md-9 mu-tab-body">
+  <div class="mu-user-header">
+    <h1><%= t(:certificates) %></h1>
   </div>
-<% else %>
-  <div class="col-md-9 mu-tab-body">
+  <% if @certificates.empty? %>
+    <div class="mu-tab-body">
+      <%= t :certificates_will_be_here %>
+    </div>
+  <% else %>
     <div class="col-md-12">
       <div class="mu-list-group">
         <% @certificates.each do |certificate| %>
@@ -28,5 +28,5 @@
         <% end %>
       </div>
     </div>
-  </div>
-<% end %>
+  <% end %>
+</div>

data/lib/mumuki/laboratory/version.rb

@@ -1,5 +1,5 @@
 module Mumuki
   module Laboratory
-    VERSION = '9.0.2'
+    VERSION = '9.0.3'
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: mumuki-laboratory
 version: !ruby/object:Gem::Version
-  version: 9.0.2
+  version: 9.0.3
 platform: ruby
 authors:
 - Franco Bulgarelli
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-03-09 00:00:00.000000000 Z
+date: 2021-03-10 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails