update font weight

src/BIMDataComponents/BIMDataBreadcrumb/BIMDataBreadcrumb.vue

@@ -119,7 +119,7 @@ export default {
         cursor: pointer;
       }
       &:hover:not(.bimdata-breadcrumb__step--last) {
-        font-weight: bold;
+        font-weight: 700;
         text-decoration: underline;
       }
       &::before {
@@ -128,7 +128,7 @@ export default {
         height: 0;
         overflow: hidden;
         visibility: hidden;
-        font-weight: bold;
+        font-weight: 700;
         text-decoration: underline;
       }
     }

src/BIMDataComponents/BIMDataNavigation/_BIMDataNavigation.scss

@@ -18,7 +18,7 @@
 
     &.active {
       .bimdata-btn {
-        font-weight: bold;
+        font-weight: 700;
       }
     }
   }

src/BIMDataComponents/BIMDataPagination/_BIMDataPagination.scss

@@ -9,7 +9,7 @@
 
     &.active {
       .bimdata-btn {
-        font-weight: bold;
+        font-weight: 700;
       }
     }
   }

src/BIMDataComponents/BIMDataSelect/_BIMDataSelect.scss

@@ -101,7 +101,7 @@
 
       &.option-group {
         color: var(--color-granite);
-        font-weight: bold;
+        font-weight: 700;
         &:hover {
           background-color: transparent;
           cursor: default;

src/BIMDataComponents/BIMDataTable/_BIMDataTable.scss

@@ -24,7 +24,7 @@
       }
 
       th {
-        font-weight: bold;
+        font-weight: 700;
         color: var(--color-primary);
       }
 
@@ -39,7 +39,7 @@
       align-items: center;
       padding: var(--spacing-unit);
       font-size: 1rem;
-      font-weight: bold;
+      font-weight: 700;
       background-color: var(--color-silver-light);
     }
   }

src/BIMDataComponents/BIMDataText/BIMDataText.vue

@@ -20,7 +20,7 @@ export default {
     },
     fontWeight: {
       type: String,
-      default: "primary-font",
+      default: "400",
     },
     lineHeight: {
       type: String,
@@ -55,16 +55,14 @@ export default {
   },
   computed: {
     classes() {
-      return {
-        [`${this.color}`]: this.color,
-        [`${this.fontWeight}`]: this.fontWeight,
-      };
+      return `${this.color}`;
     },
     style() {
       return {
-        "font-size": `${this.calcFontSize}`,
-        "line-height": `${this.calcLineHeight}`,
+        fontSize: `${this.calcFontSize}`,
+        lineHeight: `${this.calcLineHeight}`,
         display: `${this.display}`,
+        fontWeight: `${this.fontWeight}`,
         margin: `${this.margin}`,
         padding: `${this.padding}`,
       };

src/BIMDataSmartComponents/BIMDataFileManager/components/FileCard/FileCard.scss

@@ -87,7 +87,7 @@
 
   &__name {
     font-size: 12px;
-    font-weight: bold;
+    font-weight: 700;
     color: $color-granite;
     word-break: break-word;
     -webkit-line-clamp: 2;

src/BIMDataSmartComponents/BIMDataFileManager/components/modals/DeleteModal.vue

@@ -158,7 +158,7 @@ export default {
     max-width: 350px;
 
     &__title {
-      font-weight: bold;
+      font-weight: 700;
       font-size: 120%;
     }
 

src/BIMDataSmartComponents/BIMDataFileManager/components/modals/RenameModal.vue

@@ -172,7 +172,7 @@ export default {
     max-width: 350px;
 
     &__title {
-      font-weight: bold;
+      font-weight: 700;
       font-size: 120%;
     }
 

src/assets/css/_BIMDataFonts.css

@@ -1,14 +1,14 @@
 @font-face {
-  font-family: "robotobold";
+  font-family: "roboto";
   src: url("../fonts/roboto-bold-webfont.woff2") format("woff2"),
     url("../fonts/roboto-bold-webfont.woff2") format("woff");
-  font-weight: 700;
+  font-weight: 600 700;
   font-style: bold;
   font-display: fallback;
 }
 
 @font-face {
-  font-family: "robotomedium";
+  font-family: "robot";
   src: url("../fonts/roboto-medium-webfont.woff2") format("woff2"),
     url("../fonts/roboto-medium-webfont.woff") format("woff");
   font-weight: 500;
@@ -17,10 +17,10 @@
 }
 
 @font-face {
-  font-family: "robotoregular";
+  font-family: "roboto";
   src: url("../fonts/roboto-regular-webfont.woff2") format("woff2"),
     url("../fonts/roboto-regular-webfont.woff") format("woff");
-  font-weight: 400;
+  font-weight: 100 400;
   font-style: normal;
   font-display: fallback;
 }

src/assets/css/_BIMDataVariables.css

@@ -61,7 +61,5 @@ html {
   --size-btn-options: 45px;
 
   /* base FONTS -------------------------------------- */
-  --primary-font: "robotoregular", sans-serif;
-  --primary-font-medium: "robotomedium", sans-serif;
-  --primary-font-bold: "robotobold", sans-serif;
+  --primary-font: "roboto", sans-serif;
 }

src/assets/css/utilities/_text.css

@@ -17,9 +17,3 @@
 .primary-font {
   font-family: var(--primary-font);
 }
-.primary-font-medium {
-  font-family: var(--primary-font-medium);
-}
-.primary-font-bold {
-  font-family: var(--primary-font-bold);
-}

src/assets/scss/BIMData.scss

@@ -1,3 +1,5 @@
+@import "./BIMDataFonts.scss";
+
 // import GLOBAL STYLE
 @import "./BIMDataVariables.scss";
 @import "./BIMDataGlobal.scss";

src/assets/scss/_BIMDataFonts.scss

@@ -1,26 +1,26 @@
 @font-face {
-  font-family: "robotobold";
+  font-family: "roboto";
   src: url("~@/assets/fonts/roboto-bold-webfont.woff2") format("woff2"),
     url("~@/assets/fonts/roboto-bold-webfont.woff2") format("woff");
-  font-weight: 700;
-  font-style: normal;
+  font-weight: 600 700;
+  font-style: bold;
   font-display: fallback;
 }
 
 @font-face {
-  font-family: "robotomedium";
+  font-family: "roboto";
   src: url("~@/assets/fonts/roboto-medium-webfont.woff2") format("woff2"),
     url("~@/assets/fonts/roboto-medium-webfont.woff") format("woff");
   font-weight: 500;
-  font-style: normal;
+  font-style: medium;
   font-display: fallback;
 }
 
 @font-face {
-  font-family: "robotoregular";
+  font-family: "roboto";
   src: url("~@/assets/fonts/roboto-regular-webfont.woff2") format("woff2"),
     url("~@/assets/fonts/roboto-regular-webfont.woff") format("woff");
-  font-weight: 400;
+  font-weight: 100 400;
   font-style: normal;
   font-display: fallback;
 }

src/assets/scss/_BIMDataVariables.scss

@@ -31,9 +31,7 @@ $spacing-unit: 12px;
 $size-btn-options: 45px;
 
 /* base FONTS -------------------------------------- */
-$primary-font: "robotoregular", sans-serif;
-$primary-font-medium: "robotomedium", sans-serif;
-$primary-font-bold: "robotobold", sans-serif;
+$primary-font: "roboto", sans-serif;
 
 html {
   /* base COLORS ------------------------------------------- */
@@ -102,7 +100,5 @@ html {
   --size-btn-options: 45px;
 
   /* base FONTS -------------------------------------- */
-  --primary-font: "robotoregular", sans-serif;
-  --primary-font-medium: "robotomedium", sans-serif;
-  --primary-font-bold: "robotobold", sans-serif;
+  --primary-font: "roboto", sans-serif;
 }

src/assets/scss/utilities/_text.scss

@@ -12,16 +12,10 @@
 .bimdata-link {
   color: var(--color-primary);
   border-bottom: 1px solid var(--color-primary);
-  font-weight: bold;
+  font-weight: 700;
 }
 
 /* BIMDATA FONT WEIGHT */
 .primary-font {
-  font-family: "robotoregular", sans-serif;
-}
-.primary-font-medium {
-  font-family: "robotomedium", sans-serif;
-}
-.primary-font-bold {
-  font-family: "robotobold", sans-serif;
+  font-family: "roboto", sans-serif;
 }

src/web/_DesignSystem-global.scss

@@ -89,5 +89,5 @@ pre[class*="language-"] {
   margin: 0 2px;
   border-radius: 2px;
   color: var(--color-primary);
-  font-weight: bold;
+  font-weight: 700;
 }

src/web/views/Components/ResponsiveGrid/_ResponsiveGrid.scss

@@ -11,7 +11,7 @@
   align-items: center;
   background-color: var(--color-silver-light);
   color: var(--color-primary);
-  font-weight: bold;
+  font-weight: 700;
 }
 
 .demo-parameters {

src/web/views/Components/Table/Table.vue

@@ -350,7 +350,7 @@ export default {
 
   &__label {
     margin-bottom: 12px;
-    font-weight: bold;
+    font-weight: 700;
   }
 }
 

src/web/views/Components/Text/Text.vue

@@ -25,10 +25,7 @@
             eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
             ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
             aliquip ex ea commodo consequat. Duis aute irure dolor in
-            <BIMDataText
-              component="span"
-              color="color-primary"
-              fontWeight="primary-font-bold"
+            <BIMDataText component="span" color="color-primary" fontWeight="700"
               >reprehenderit</BIMDataText
             >
             in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
@@ -180,7 +177,7 @@
             eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
             ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
             aliquip ex ea commodo consequat. Duis aute irure dolor in
-              &lt;BIMDataText component="span" color="color-primary" fontWeight="primary-font-bold"&gt;reprehenderit&lt;/BIMDataText&gt;
+              &lt;BIMDataText component="span" color="color-primary" fontWeight="700"&gt;reprehenderit&lt;/BIMDataText&gt;
             in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
             Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
             officia deserunt mollit anim id est laborum."
@@ -222,18 +219,14 @@ export default {
       placeholder: false,
       disabled: false,
       selectedTextOptionscolor: "color-granite-light",
-      selectedTextFontWeight: "primary-font",
+      selectedTextFontWeight: "400",
       selectedTextComponent: "p",
       displayText: "inline-block",
       fontSizeText: "",
       lineHeightText: "",
       marginText: "",
       paddingText: "",
-      fontWeightText: [
-        "primary-font",
-        "primary-font-medium",
-        "primary-font-bold",
-      ],
+      fontWeightText: ["400", "500", "700"],
       componentsText: ["h1", "h2", "h3", "h4", "h5", "p"],
       textOptions: {
         color: [
@@ -252,54 +245,62 @@ export default {
         ],
       },
       propsData: [
-        ["Props", "Type", "Default value", "Description"],
+        ["Props", "Type", "Default value", "Description", "Example"],
         [
           "component",
           "String",
           "p",
-          "Use this prop to use a particular title / text block. For example: h1, h2, p, span...",
+          "Use this prop to use a particular title / text block.",
+          "h1, h2, p, span...",
         ],
         [
           "display",
           "String",
           "inline-block",
           "Use this prop to customize the display of the text block",
+          "",
         ],
         [
           "fontWeight",
           "String",
-          "primary-font",
-          "Use this prop to customize the font-weight of the text block",
+          "400",
+          "Use this prop to customize the font-weight of the text block.",
+          "400 for regular ; 500 for medium and 700 for bold.",
         ],
         [
           "fontSize",
           "String",
           "14px",
           "Use this prop to customize the font-size of the text block. By default, a font-size is assigned for each h1, h2, h3, h4, h5 and p. But if you use this prop you can override it",
+          "",
         ],
         [
           "lineHeight",
           "String",
           "18px",
           "Use this prop to customize the line-height of the text block. By default, a line-height is assigned for each h1, h2, h3, h4, h5 and p. But if you use this prop you can override it",
+          "",
         ],
         [
           "margin",
           "String",
           "0px",
           "Use this prop to customize the margin of the text block.",
+          "",
         ],
         [
           "padding",
           "String",
           "0px",
           "Use this prop to customize the padding of the text block.",
+          "",
         ],
         [
           "color",
           "String",
           "color-granite-light",
           "Use this prop to customize the color of the text block. To know the authorized values, refer to the 'COLOR UTILITY CLASS' line of the Guidelines & Utilities ; Colors page.",
+          "",
         ],
       ],
     };
@@ -331,7 +332,7 @@ export default {
       }
     },
     getFontWeight() {
-      if (this.selectedTextFontWeight != "primary-font") {
+      if (this.selectedTextFontWeight != "400") {
         return `fontWeight="${this.selectedTextFontWeight}"`;
       }
     },