sf_mobile_base: improve detail card title cusomization

Allows to set a class on the detail card title. And one is added to the css to have smaller font.
OCA · Nov 15, 2023 · 8abeb09 · 8abeb09
1 parent 70cd014
commit 8abeb09
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/shopfloor_mobile_base/static/wms/src/components/detail/detail_card.js b/shopfloor_mobile_base/static/wms/src/components/detail/detail_card.js
@@ -12,7 +12,7 @@ Vue.component("item-detail-card", {
     template: `
     <div :class="wrapper_klass">
         <v-card :color="card_color" tile :class="{'theme--dark': opts.theme_dark, 'main': opts.main, 'no-outline': opts.no_outline}" v-if="!_.isEmpty(record)">
-            <v-card-title v-if="!opts.no_title">
+            <v-card-title v-if="!opts.no_title" :class="opts.title_class">
                 <slot name="title">
                     <v-icon v-if="opts.title_icon" v-text="opts.title_icon" class="mr-2" />
                     <span v-text="_.result(record, opts.key_title)" />

diff --git a/shopfloor_mobile_base/static/wms/src/css/main.css b/shopfloor_mobile_base/static/wms/src/css/main.css
@@ -457,6 +457,10 @@ main.v-content > .v-content__wrap > .header .container {
     line-height: 1.1rem;
 }
 
+.v-card .v-card__title-smaller {
+    font-size: 0.9rem;
+}
+
 /* TODO: likely to be applied to all */
 .list .v-list-item {
     border-bottom: 1px solid #ccc;