added showrooms pages, made page-title color

config/sync/views.view.showrooms.yml

@@ -0,0 +1,1034 @@
+uuid: b58b767a-9068-44df-bba6-75253ccbb7e6
+langcode: en
+status: true
+dependencies:
+  config:
+    - field.storage.taxonomy_term.field_public_address
+    - field.storage.taxonomy_term.field_public_email
+    - field.storage.taxonomy_term.field_public_phone
+    - field.storage.taxonomy_term.field_visuels
+    - image.style.card_big
+    - image.style.home_showroom
+    - system.menu.header
+    - taxonomy.vocabulary.showroom
+  module:
+    - address
+    - image
+    - rest
+    - serialization
+    - taxonomy
+    - telephone_formatter
+    - text
+    - user
+    - workflow
+id: showrooms
+label: Showrooms
+module: views
+description: ''
+tag: ''
+base_table: taxonomy_term_field_data
+base_field: tid
+core: 8.x
+display:
+  default:
+    display_plugin: default
+    id: default
+    display_title: Master
+    position: 0
+    display_options:
+      access:
+        type: perm
+        options:
+          perm: 'access content'
+      cache:
+        type: tag
+        options: {  }
+      query:
+        type: views_query
+        options:
+          disable_sql_rewrite: false
+          distinct: false
+          replica: false
+          query_comment: ''
+          query_tags: {  }
+      exposed_form:
+        type: basic
+        options:
+          submit_button: Apply
+          reset_button: false
+          reset_button_label: Reset
+          exposed_sorts_label: 'Sort by'
+          expose_sort_order: true
+          sort_asc_label: Asc
+          sort_desc_label: Desc
+      pager:
+        type: none
+        options:
+          offset: 0
+      style:
+        type: default
+      row:
+        type: fields
+      fields:
+        name:
+          id: name
+          table: taxonomy_term_field_data
+          field: name
+          entity_type: taxonomy_term
+          entity_field: name
+          label: ''
+          alter:
+            alter_text: false
+            make_link: false
+            absolute: false
+            trim: false
+            word_boundary: false
+            ellipsis: false
+            strip_tags: false
+            html: false
+          hide_empty: false
+          empty_zero: false
+          type: string
+          settings:
+            link_to_entity: true
+          plugin_id: term_name
+          relationship: none
+          group_type: group
+          admin_label: ''
+          exclude: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: true
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_alter_empty: true
+          click_sort_column: value
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          convert_spaces: false
+      filters:
+        status:
+          value: '1'
+          table: taxonomy_term_field_data
+          field: status
+          plugin_id: boolean
+          entity_type: taxonomy_term
+          entity_field: status
+          id: status
+          expose:
+            operator: ''
+          group: 1
+        vid:
+          id: vid
+          table: taxonomy_term_field_data
+          field: vid
+          value:
+            showroom: showroom
+          entity_type: taxonomy_term
+          entity_field: vid
+          plugin_id: bundle
+        field_workflow_value:
+          id: field_workflow_value
+          table: taxonomy_term__field_workflow
+          field: field_workflow_value
+          relationship: none
+          group_type: group
+          admin_label: ''
+          operator: or
+          value:
+            workflow_visible: workflow_visible
+          group: 1
+          exposed: false
+          expose:
+            operator_id: ''
+            label: ''
+            description: ''
+            use_operator: false
+            operator: ''
+            identifier: ''
+            required: false
+            remember: false
+            multiple: false
+            remember_roles:
+              authenticated: authenticated
+            reduce: false
+          is_grouped: false
+          group_info:
+            label: ''
+            description: ''
+            identifier: ''
+            optional: true
+            widget: select
+            multiple: false
+            remember: false
+            default_group: All
+            default_group_multiple: {  }
+            group_items: {  }
+          reduce_duplicates: false
+          plugin_id: workflow_state
+      sorts: {  }
+      title: Showrooms
+      header: {  }
+      footer: {  }
+      empty: {  }
+      relationships: {  }
+      arguments: {  }
+      display_extenders: {  }
+    cache_metadata:
+      max-age: -1
+      contexts:
+        - 'languages:language_content'
+        - 'languages:language_interface'
+        - user.permissions
+      tags: {  }
+  page_1:
+    display_plugin: page
+    id: page_1
+    display_title: Page
+    position: 1
+    display_options:
+      display_extenders:
+        views_ef_fieldset: {  }
+      path: showrooms
+      menu:
+        type: normal
+        title: Showrooms
+        description: ''
+        expanded: false
+        parent: ''
+        weight: 1
+        context: '0'
+        menu_name: header
+      fields:
+        name:
+          id: name
+          table: taxonomy_term_field_data
+          field: name
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: false
+            ellipsis: false
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: string
+          settings:
+            link_to_entity: false
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          convert_spaces: false
+          entity_type: taxonomy_term
+          entity_field: name
+          plugin_id: term_name
+        field_public_address:
+          id: field_public_address
+          table: taxonomy_term__field_public_address
+          field: field_public_address
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: langcode
+          type: address_default
+          settings: {  }
+          group_column: ''
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        field_public_email:
+          id: field_public_email
+          table: taxonomy_term__field_public_email
+          field: field_public_email
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: basic_string
+          settings: {  }
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        field_public_phone:
+          id: field_public_phone
+          table: taxonomy_term__field_public_phone
+          field: field_public_phone
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: telephone_formatter
+          settings:
+            format: 1
+            link: false
+            default_country: ''
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        field_visuels:
+          id: field_visuels
+          table: taxonomy_term__field_visuels
+          field: field_visuels
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: target_id
+          type: image
+          settings:
+            image_style: home_showroom
+            image_link: ''
+          group_column: ''
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 5
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+      defaults:
+        fields: false
+    cache_metadata:
+      max-age: -1
+      contexts:
+        - 'languages:language_content'
+        - 'languages:language_interface'
+        - user.permissions
+      tags:
+        - 'config:field.storage.taxonomy_term.field_public_address'
+        - 'config:field.storage.taxonomy_term.field_public_email'
+        - 'config:field.storage.taxonomy_term.field_public_phone'
+        - 'config:field.storage.taxonomy_term.field_visuels'
+  rest_export_1:
+    display_plugin: rest_export
+    id: rest_export_1
+    display_title: 'REST export'
+    position: 2
+    display_options:
+      display_extenders:
+        views_ef_fieldset: {  }
+      path: showrooms_rest
+      style:
+        type: serializer
+      defaults:
+        style: false
+        row: false
+        fields: false
+      row:
+        type: data_field
+        options:
+          field_options:
+            name:
+              alias: ''
+              raw_output: false
+      pager:
+        type: some
+        options:
+          items_per_page: 10
+          offset: 0
+      fields:
+        name:
+          id: name
+          table: taxonomy_term_field_data
+          field: name
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: false
+            ellipsis: false
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: string
+          settings:
+            link_to_entity: false
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          convert_spaces: false
+          entity_type: taxonomy_term
+          entity_field: name
+          plugin_id: term_name
+        uuid:
+          id: uuid
+          table: taxonomy_term_data
+          field: uuid
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: string
+          settings:
+            link_to_entity: false
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          entity_type: taxonomy_term
+          entity_field: uuid
+          plugin_id: field
+        field_public_address:
+          id: field_public_address
+          table: taxonomy_term__field_public_address
+          field: field_public_address
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: langcode
+          type: address_default
+          settings: {  }
+          group_column: ''
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        description__value:
+          id: description__value
+          table: taxonomy_term_field_data
+          field: description__value
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: text_default
+          settings: {  }
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          entity_type: taxonomy_term
+          entity_field: description
+          plugin_id: field
+        field_public_email:
+          id: field_public_email
+          table: taxonomy_term__field_public_email
+          field: field_public_email
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: basic_string
+          settings: {  }
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        field_public_phone:
+          id: field_public_phone
+          table: taxonomy_term__field_public_phone
+          field: field_public_phone
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: telephone_formatter
+          settings:
+            format: 1
+            link: false
+            default_country: ''
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+        field_visuels:
+          id: field_visuels
+          table: taxonomy_term__field_visuels
+          field: field_visuels
+          relationship: none
+          group_type: group
+          admin_label: ''
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: target_id
+          type: image
+          settings:
+            image_style: card_big
+            image_link: ''
+          group_column: ''
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 5
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+          plugin_id: field
+    cache_metadata:
+      max-age: -1
+      contexts:
+        - 'languages:language_content'
+        - 'languages:language_interface'
+        - request_format
+        - user.permissions
+      tags:
+        - 'config:field.storage.taxonomy_term.field_public_address'
+        - 'config:field.storage.taxonomy_term.field_public_email'
+        - 'config:field.storage.taxonomy_term.field_public_phone'
+        - 'config:field.storage.taxonomy_term.field_visuels'

web/themes/custom/materiotheme/assets/dist/main.css

@@ -1174,7 +1174,10 @@ header[role="banner"] {
     header[role="banner"] #block-header ul.menu {
       margin: 0; }
       header[role="banner"] #block-header ul.menu li {
-        padding: 0; }
+        padding: 0;
+        display: inline-block; }
+        header[role="banner"] #block-header ul.menu li:not(:first-of-type) {
+          margin-left: 0.5em; }
   header[role="banner"] #block-languageswitcher {
     text-align: right; }
     header[role="banner"] #block-languageswitcher h2 {
@@ -1221,6 +1224,17 @@ header[role="banner"] {
       font-size: 1.512em;
       text-transform: capitalize;
       font-weight: 300; }
+      body:not(.path-home) header[role="banner"] #block-pagetitle h2 {
+        padding: 0.5em 1em; }
+      body.path-blabla header[role="banner"] #block-pagetitle h2 {
+        color: #fff;
+        background-color: #9458aa; }
+      body.path-showrooms header[role="banner"] #block-pagetitle h2 {
+        color: #fff;
+        background-color: #50aa3c; }
+      body.path-base header[role="banner"] #block-pagetitle h2 {
+        color: #fff;
+        background-color: #69cdcf; }
   header[role="banner"] #block-materiosapisearchblock {
     float: right;
     display: inline-block;
@@ -1390,6 +1404,23 @@ article.node--type-frontpage .node__content > section.home-blabla {
             font-size: 0.756em;
             line-height: 0.9; }
 
+#showrooms {
+  width: calc(100% + 15px); }
+  #showrooms article.showroom {
+    width: 435px;
+    display: inline-block;
+    vertical-align: top;
+    margin: 0 15px 15px 0; }
+    #showrooms article.showroom h1 {
+      margin: 0;
+      font-weight: 4; }
+    #showrooms article.showroom p {
+      margin: 0; }
+    #showrooms article.showroom figure {
+      margin: 0; }
+      #showrooms article.showroom figure img {
+        max-width: 100%; }
+
 .infinite-loading-container .infinite-status-prompt i[class^="loading-"] {
   width: 15px;
   height: 15px; }

web/themes/custom/materiotheme/assets/scripts/main.js

@@ -55,9 +55,40 @@ import 'theme/assets/styles/main.scss'
     }
 
     function initVRouter(){
-      // we need this to update the title while using history nav
+      // we need this to update the title and body classes while using history nav
       router.beforeEach((to, from, next) => {
+        // console.log('router beforeEach to ', to);
+        // commit new title to store
         store.commit('Common/setPagetitle', to.name != 'home' ? to.name : null)
+
+        // remove all path related body classes
+        let body_classes = document.querySelector('body').classList;
+        let classes_to_rm = [];
+        for (var i = 0; i < body_classes.length; i++) {
+          if(body_classes[i].startsWith('path-')){
+            classes_to_rm.push(body_classes[i]);
+          }
+        }
+        document.querySelector('body').classList.remove(...classes_to_rm);
+        // add new path classes to body
+        let classes = [];
+        if(to.path == '/'){
+          classes.push('path-home');
+        }else{
+          let path_parts = to.path.replace(/^\//, '').split('/');
+          for (var i = 0; i < path_parts.length; i++) {
+            if(i == 0){
+              var c = "path-" + path_parts[i];
+            }else if (path_parts[i] !== ''){
+              var c = classes[i-1] +'-'+ path_parts[i];
+            }
+            classes.push(c)
+          }
+
+        }
+        document.querySelector('body').classList.add(...classes);
+
+        // trigger router
         next();
       })
     }
@@ -157,7 +188,7 @@ import 'theme/assets/styles/main.scss'
           onclick(event){
             // console.log("Clicked on header menu link", event);
             let href = event.target.getAttribute('href');
-            let title = event.target.innerText;
+            // let title = event.target.innerText;
             // console.log("Clicked on header menu link : href", href);
             this.$router.push(href)
             // replaced by router.beforeEach

web/themes/custom/materiotheme/assets/styles/base/_colors.scss

@@ -1 +1,5 @@
 $transparent-bg: rgba(255,255,255, 0.95);
+
+$color-base:#69cdcf;
+$color-showrooms:#50aa3c;
+$color-blabla:#9458aa;

web/themes/custom/materiotheme/assets/styles/main.scss

@@ -134,6 +134,10 @@ header[role="banner"]{
       margin:0;
       li{
         padding:0;
+        display: inline-block;
+        &:not(:first-of-type){
+          margin-left: 0.5em;
+        }
         a{
           @extend %header-fs;
         }
@@ -204,6 +208,24 @@ header[role="banner"]{
       font-size: 1.512em;
       text-transform: capitalize;
       font-weight: 300;
+
+
+
+      body:not(.path-home) & {
+        padding:0.5em 1em;
+      }
+      body.path-blabla & {
+        color: #fff;
+        background-color: $color-blabla;
+      }
+      body.path-showrooms & {
+        color: #fff;
+        background-color: $color-showrooms;
+      }
+      body.path-base & {
+        color: #fff;
+        background-color: $color-base;
+      }
     }
   }
 
@@ -320,7 +342,7 @@ article.node--type-frontpage{
         @extend %part-centered-layout;
       }
       &.home-database{
-        background-color: #69cdcf;
+        background-color: $color-base;
         @extend %part-columned-layout;
         .field--name-field-a-database{}
         .cards-list-home{
@@ -357,7 +379,7 @@ article.node--type-frontpage{
         }
       }
       &.home-showrooms{
-        background-color: #50aa3c;
+        background-color: $color-showrooms;
         @extend %part-columned-layout;
         .field--name-field-showrooms{
         }
@@ -408,7 +430,7 @@ article.node--type-frontpage{
                 width:100%;
                 box-sizing:border-box;
                 padding:1em 0;
-                background-color:#50aa3c;
+                background-color:$color-showrooms;
                 color: #fff;
                 >*{
                   // display: inline-block;
@@ -424,7 +446,7 @@ article.node--type-frontpage{
         }
       }
       &.home-blabla{
-        background-color: #9458aa;
+        background-color: $color-blabla;
         @extend %part-columned-layout;
 
         .cards-list-home{
@@ -477,6 +499,34 @@ article.node--type-frontpage{
 }
 
 
+
+ //  ___ _
+ // / __| |_  _____ __ ___ _ ___  ___ _ __  ___
+ // \__ \ ' \/ _ \ V  V / '_/ _ \/ _ \ '  \(_-<
+ // |___/_||_\___/\_/\_/|_| \___/\___/_|_|_/__/
+#showrooms{
+  width: calc(100% + #{$column_goutiere});
+  article.showroom{
+    width: $column_width * 2 + $column_goutiere;
+    display: inline-block;
+    vertical-align: top;
+    margin: 0 $column_goutiere $column_goutiere 0;
+
+    h1{
+      margin:0;
+      font-weight: 4;
+    }
+    p{ margin:0; }
+    figure{
+      margin:0;
+      img{
+        max-width: 100%;
+      }
+    }
+  }
+
+}
+
  //   ___             _
  //  / __|__ _ _ _ __| |___
  // | (__/ _` | '_/ _` (_-<

web/themes/custom/materiotheme/materiotheme.info.yml

@@ -11,7 +11,6 @@ libraries:
 regions:
   header: Header
   header_left: 'Header left'
-  header_middle: 'Header middle'
   header_right: 'Header right'
   header_bottom: 'Header bottom'
   content_top: 'Content Top'

web/themes/custom/materiotheme/templates/layout/page.html.twig

@@ -46,12 +46,7 @@
           {{ page.header_left}}
         {% endif %}
       </div>
-      <div class="header-block header-middle col-4">
-        {% if page.header_middle %}
-          {{ page.header_middle}}
-        {% endif %}
-      </div>
-      <div class="header-block header-right col-4">
+      <div class="header-block header-right col-8">
         {% if page.header_right %}
           {{ page.header_right}}
         {% endif %}

web/themes/custom/materiotheme/vuejs/components/Content/Showroom.vue

@@ -0,0 +1,37 @@
+<template>
+  <article class="showroom">
+    <header>
+      <h1 v-html="item.name" />
+    </header>
+    <section class="images">
+      <figure v-html="item.field_visuels"></figure>
+    </section>
+    <section class="content">
+      <address v-html="item.field_public_address" />
+      <div class="phone" v-html="item.field_public_phone" />
+      <div class="email" v-html="item.field_public_email" />
+    </section>
+  </article>
+</template>
+
+<script>
+import { JSONAPI } from 'vuejs/api/json-axios'
+import router from 'vuejs/route'
+
+let basePath = drupalSettings.path.baseUrl + drupalSettings.path.pathPrefix;
+
+export default {
+  name: "Showroom",
+  router,
+  props: ['item'],
+  // data(){
+  //   return {
+  //     alias: this.item.view_node.replace(/^.?\/showroom\//g, '')
+  //   }
+  // },
+  // methods:{}
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

web/themes/custom/materiotheme/vuejs/components/Content/Article.vue → web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue

@@ -155,25 +155,27 @@ export default {
         obj.data.forEach((e) => {
           // get the included values
           let included = inc.find((i) => { return i.id == e.id })
-          // fill the values
-          switch (key) {
-            case 'field_visuel':
-              field = e.meta
-              field.id = e.id
-              field.src = included.links.card_medium.href
-              break;
-            case 'field_linked_materials':
-            case 'field_thesaurus':
-            case 'field_tags':
-              field = included.attributes
-              field.id = included.id
-              break;
-            // case 'field_showroom':
-            //   field = included.attributes
-            //   break
-            default:
+          if(typeof included != 'undefined'){
+            // fill the values
+            switch (key) {
+              case 'field_visuel':
+                field = e.meta
+                field.id = e.id
+                field.src = included.links.card_medium.href
+                break;
+              case 'field_linked_materials':
+              case 'field_thesaurus':
+              case 'field_tags':
+                field = included.attributes
+                field.id = included.id
+                break;
+              // case 'field_showroom':
+              //   field = included.attributes
+              //   break
+              default:
+            }
+            this.content[key].push(field)
           }
-          this.content[key].push(field)
         })
       }
 

web/themes/custom/materiotheme/vuejs/components/Pages/Showrooms.vue

@@ -0,0 +1,48 @@
+<template>
+  <div id="showrooms">
+    <div class="loading" v-if="!items.length">
+      <span>Loading ...</span>
+    </div>
+    <Showroom
+      v-else
+      v-for="item in items"
+      v-bind:key="item.uuid"
+      :item="item"
+    />
+  </div>
+</template>
+
+<script>
+
+import Showroom from 'vuejs/components/Content/Showroom'
+import { mapState, mapActions } from 'vuex'
+
+export default {
+  name: "Showrooms",
+  // data() {
+  //   return {
+  //     items:[],
+  //     page:0
+  //   }
+  // },
+  computed: {
+    ...mapState({
+      items: state => state.Showrooms.items
+    })
+  },
+  created(){
+    if(!this.items.length)
+      this.getItems()
+  },
+  methods: {
+    ...mapActions({
+      getItems: 'Showrooms/getItems'
+    })
+  },
+  components: {
+    Showroom
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

web/themes/custom/materiotheme/vuejs/route/index.js

@@ -1,10 +1,11 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
 
-import Home from 'vuejs/components/Content/Home'
-import Base from 'vuejs/components/Content/Base'
-import Blabla from 'vuejs/components/Content/Blabla'
-import Article from 'vuejs/components/Content/Article'
+import Home from 'vuejs/components/Pages/Home'
+import Base from 'vuejs/components/Pages/Base'
+import Blabla from 'vuejs/components/Pages/Blabla'
+import Article from 'vuejs/components/Pages/Article'
+import Showrooms from 'vuejs/components/Pages/Showrooms'
 
 Vue.use(VueRouter)
 
@@ -59,6 +60,12 @@ const routes = [
     path: `${basePath}blabla/:alias`,
     component: Article,
     // meta: { uuid:null }
+  },
+  {
+    name:'showrooms',
+    path: `${basePath}showrooms`,
+    component: Showrooms,
+    // meta: { uuid:null }
   }
   // {
   //   path: '*',

web/themes/custom/materiotheme/vuejs/store/index.js

@@ -4,6 +4,7 @@ import Common from './modules/common'
 import User from './modules/user'
 import Search from './modules/search'
 import Blabla from './modules/blabla'
+import Showrooms from './modules/showrooms'
 
 // https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart
 
@@ -13,6 +14,7 @@ export default new Vuex.Store({
     Common,
     User,
     Search,
-    Blabla
+    Blabla,
+    Showrooms
   }
 })

web/themes/custom/materiotheme/vuejs/store/modules/common.js

@@ -16,7 +16,7 @@ export default {
   // mutations
   mutations : {
     setPagetitle (state, title) {
-      console.log('Common, setPagetitle', title);
+      // console.log('Common, setPagetitle', title);
       state.pagetitle = title
     }
   },

web/themes/custom/materiotheme/vuejs/store/modules/showrooms.js

@@ -0,0 +1,38 @@
+import { JSONAPI } from 'vuejs/api/json-axios'
+import { REST } from 'vuejs/api/rest-axios'
+import { MA } from 'vuejs/api/ma-axios'
+import qs from 'querystring'
+
+export default {
+  namespaced: true,
+
+  // initial state
+  state : {
+    items: [],
+  },
+
+  // getters
+  getters : {},
+
+  // mutations
+  mutations : {
+    setItems (state, items) {
+      state.items = state.items.concat(items)
+    }
+  },
+
+  // actions
+  actions : {
+    getItems({ dispatch, commit, state }){
+      REST.get(`/showrooms_rest?_format=json`, {})
+        .then(({ data }) => {
+          console.log('showrooms REST: data', data)
+          commit('setItems',data)
+        })
+        .catch(( error ) => {
+            console.warn('Issue with showrooms', error)
+            Promise.reject(error)
+        })
+    }
+  }
+}