ontoportal-lirmm · syphax-bouazzouni · Aug 8, 2023 · Aug 8, 2023 · Aug 8, 2023 · Aug 8, 2023
diff --git a/app/assets/images/icons/internal-link.svg b/app/assets/images/icons/internal-link.svg
diff --git a/app/assets/stylesheets/application.css.scss.erb b/app/assets/stylesheets/application.css.scss.erb
@@ -52,7 +52,7 @@
 @import "agents";
 
 @import "nav_bar";
-
+@import "ontology_viewer";
 /* Bootstrap and Font Awesome */
 @import "bootstrap";
 @import "bootstrap_overrides";

diff --git a/app/assets/stylesheets/components/chip_button.scss b/app/assets/stylesheets/components/chip_button.scss
@@ -1,18 +1,17 @@
 .chip_button_container {
-    background-color: #F6F6F6;
-    padding: 10px;
-    border-radius: 5px;
-    color: #777777 !important;
-    font-weight: 500;
-    font-size: 15px;
+  background-color: #f6f6f6;
+  padding: 10px;
+  border-radius: 5px;
+  color: #777777 !important;
+  font-weight: 500;
+  font-size: 15px;
 }
-.chip_button_container_clickable{
-    background-color: var(--light-color);
-    padding: 10px;
-    border-radius: 5px;
-    color: var(--primary-color);
-    font-weight: 500;
-    font-size: 15px;
+.chip_button_container_clickable {
+  background-color: var(--light-color);
+  line-height: 44px;
+  padding: 10px;
+  border-radius: 5px;
+  color: var(--primary-color);
+  font-weight: 500;
+  font-size: 15px;
 }
-
-
diff --git a/app/assets/stylesheets/components/chips.scss b/app/assets/stylesheets/components/chips.scss
@@ -1,7 +1,3 @@
-.chips-container div{
-    margin-right: 10px;
-}
-
 .chips-container svg path{
     fill: var(--primary-color);
 }
@@ -19,13 +15,14 @@
 }
 .chips-container div label span{
     position: relative;
-    display: inline-block;
+    display: flex;
+    align-items: center;
     background:white;
     border: 0.5px solid #BDBDBD;
     color: #a7a7a7;
-    padding: 8px;
+    padding: 3px;
     border-radius: 5px;
-    font-size: 13px;
+    font-size: 12px;
     user-select: none;
 
 }

diff --git a/app/assets/stylesheets/concepts.scss b/app/assets/stylesheets/concepts.scss
@@ -131,7 +131,7 @@ div.synonym-change-request button {
 }
 
 #concept_browser{
-  .outline-tabs .tab-items{
+  .outline-tabs div, .outline-tabs .tab-items{
     width: 100%;
   }
   .outline-tabs .tab-items .nav-item {

diff --git a/app/assets/stylesheets/ontologies.scss b/app/assets/stylesheets/ontologies.scss
@@ -175,6 +175,7 @@ $ont-show-bg-color: #e9ecef;
 #bd_content .sidebar {
   overflow-x: auto;
   white-space: nowrap;
+  min-width: 35%;
 }
 
 #search_box:focus {

diff --git a/app/assets/stylesheets/ontology_viewer.scss b/app/assets/stylesheets/ontology_viewer.scss
@@ -0,0 +1,20 @@
+.ontologies-tabs-container {
+  & > .tabs-container {
+    justify-content: center;
+  }
+
+  & > .tabs-container > div {
+    width: 1248px;
+    padding: 0 50px;
+  }
+
+  & > .tab-content {
+    display: flex;
+    justify-content: center;
+
+    & > .tab-pane {
+      width: 1248px;
+      padding: 0 50px;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/themes/lirmm/bootstrap_overrides.scss b/app/assets/stylesheets/themes/lirmm/bootstrap_overrides.scss
@@ -8,6 +8,10 @@ a {
 a i {
   color: $color-primary;
 }
+.text-primary {
+  color: $color-primary !important;
+}
+
 
 .btn-info, .btn-outline-primary:hover, .btn-primary ,  .nav-pills .nav-link.active{
   background-color: $color-primary !important;

diff --git a/app/components/chip_button_component.rb b/app/components/chip_button_component.rb
@@ -1,7 +1,8 @@
 class ChipButtonComponent < ViewComponent::Base
-    def initialize(url: nil, text:, type: "static")
+    def initialize(url: nil, text:, type: "static",  **html_options)
         @url = url
         @text = text
         @type = type
+        @html_options = html_options.merge({href: @url})
     end
 end
diff --git a/app/components/chip_button_component/chip_button_component.html.haml b/app/components/chip_button_component/chip_button_component.html.haml
@@ -1,5 +1,5 @@
 - if @type == "static"
-    %span.chip_button_container
+    %span.chip_button_container{@html_options}
         = @text
 - else
-    %a.chip_button_container_clickable{href: @url}= @text
+    %a.chip_button_container_clickable{@html_options}= @text
diff --git a/app/components/chips_component.rb b/app/components/chips_component.rb
@@ -1,9 +1,12 @@
 class ChipsComponent < ViewComponent::Base
-    def initialize(id: '', name:, value:, checked: false)
+
+    renders_one :count
+    def initialize(id: '', name:,  label: nil, value:, checked: false)
         @id = id || name
         @name = name
         @value = value
         @checked = checked
+        @label = label || @value
     end
 
     def checked?

diff --git a/app/components/chips_component/chips_component.html.haml b/app/components/chips_component/chips_component.html.haml
@@ -5,4 +5,6 @@
       %span
         %svg.chips-check-icon{:fill => "none", :height => "8", :viewbox => "0 0 10 8", :width => "10", :xmlns => "http://www.w3.org/2000/svg"}
           %path{:d => "M9.76764 0.232287C9.45824 -0.0775267 8.95582 -0.0773313 8.646 0.232287L3.59787 5.28062L1.35419 3.03696C1.04438 2.72714 0.542174 2.72714 0.23236 3.03696C-0.0774534 3.34677 -0.0774534 3.84897 0.23236 4.15879L3.03684 6.96326C3.19165 7.11807 3.39464 7.19567 3.59765 7.19567C3.80067 7.19567 4.00386 7.11827 4.15867 6.96326L9.76764 1.3541C10.0775 1.0445 10.0775 0.542081 9.76764 0.232287Z"}
-        = @value
+        %div.ml-1
+          = @label
+        = count
diff --git a/app/components/date_time_field_component.rb b/app/components/date_time_field_component.rb
@@ -9,7 +9,7 @@ def initialize(value: , format: :monthfull_day_year)
   end
 
   def call
-    l(Date.parse(@value), format: @format.to_sym)
+    l(Date.parse(@value), format: @format.to_sym) if @value
   end
 
 end
diff --git a/app/components/tabs_container_component/tabs_container_component.html.haml b/app/components/tabs_container_component/tabs_container_component.html.haml
@@ -1,13 +1,14 @@
 %div{data: {controller:'tabs-container'}, class: container_class}
-  .tab-items.nav
-    - items.each do |item|
-      %div{data:  tabs_container_data(item), class: item.active_class + ' nav-item'}
-        = item
-        - unless @pill
-          %hr
-  - if pinned_right?
-    %div.d-flex.mx-1
-      = pinned_right
+  %div
+    .tab-items.nav
+      - items.each do |item|
+        %div{data:  tabs_container_data(item), class: item.active_class + ' nav-item'}
+          = item
+          - unless @type.eql?('pill')
+            %hr
+    - if pinned_right?
+      %div.d-flex.mx-1
+        = pinned_right
 
 .tab-content
   - item_contents.each_with_index do |item_content, index|

diff --git a/app/views/layouts/_ontology_viewer.html.haml b/app/views/layouts/_ontology_viewer.html.haml
@@ -42,7 +42,7 @@
   = render partial: 'kgcl_dialogs'
 
   %div.pt-md-3.pb-md-2.p-2
-    %div
+    %div.d-flex.w-100.justify-content-center
       = render partial: 'layouts/ontology_viewer/header'
 
   %div.pb-4.p-2.bg-white{data: {controller: 'ontology-viewer-tabs', 'ontology-viewer-tabs-language-sections-value': ontology_data_sections }}

diff --git a/app/views/ontologies/concepts_browsers/_concepts_tree.html.haml b/app/views/ontologies/concepts_browsers/_concepts_tree.html.haml
@@ -15,7 +15,7 @@
                        data: {action: 'changed->skos-collection-colors#updateCollectionTags' ,
                         'chosen-enable-colors-value': 'true'}}
   -# Class tree
-  %div#sd_content.card.p-1.py-3{style: 'overflow-y: scroll; height: 60vh;'}
+  %div#sd_content.py-3{style: 'overflow-y: scroll; height: 60vh;'}
     = render TurboFrameComponent.new(id: 'concepts_tree_view',
                                      src: "/ajax/classes/treeview?ontology=#{@ontology.acronym}&conceptid=#{escape(@concept.id)}&concept_schemes=#{params[:concept_schemes]}&auto_click=false&language=#{request_lang}",
                                      data: {'turbo-frame-target': 'frame'})
diff --git a/app/views/ontologies/sections/visualize.html.haml b/app/views/ontologies/sections/visualize.html.haml
@@ -5,9 +5,9 @@
     - @enable_ontolobridge = !$NEW_TERM_REQUEST_ONTOLOGIES.nil? && $NEW_TERM_REQUEST_ONTOLOGIES.include?(@ontology.acronym)
     %div.tooltip
     %div#bd_content.bd_content.explore{data:{controller: 'container-splitter'}}
-      %div.sidebar.d-flex.flex-column.p-1.mr-1{data:{'container-splitter-target': 'container'}}
+      %div.sidebar{data:{'container-splitter-target': 'container'}}
         = render partial: 'ontologies/concepts_browsers/concepts_browser'
-      %div#concept_content.d-flex.flex-column.p-1.ml-1{data:{'container-splitter-target': 'container'}}
+      %div#concept_content.d-flex.flex-column{data:{'container-splitter-target': 'container'}}
         = render partial: 'concepts/show'
 
     - form_for(:search, :url => {:controller =>'search',:action=>'fetch_results'},:html=>{:id=>'search_form'}) do |f|