fcad-core-dragon 2.0.0-beta.0 → 2.0.0-beta.2

package/src/components/AppCompSVG.vue

@@ -0,0 +1,335 @@
+<!--
+  @DESCRIPTION: A component used to define and provide a list of svg icones that can simply be integreted by calling the  <use> attribute of SVG element
+  @TRANSFORM SVG  To obtain an SVG describe by paths; use an online converter as https://thednp.github.io/svg-path-commander/convert.html . Use Illustrator to get the raw SVG (not XD)
+  @INTEGRATION: component is instantiated once in AppBase component by calling <app-icons>.
+    To add new icon simply add it with id{String} and paths{ARRAY OF Object} in the IconList variable
+    ex:{id: 'pause-icon',paths: [{
+        d:'M14.016 5.016h3.984v13.969h-3.984v-13.969zM6 18.984v-13.969h3.984v13.969h-3.984z'}
+    ]}
+  @USAGE: Icons can be use in any component by calling their ID in the svg <use> element
+    ex: <svg><use href="#pause-icon"></svg>
+    ref: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use
+  @STYLING If multiple path, use the id to style a specific path (see the svg width app-icons class at the end of the DOM to see all the ID in the inspector -- but the path fill/stroke can only be modified once per symbol per 'use'; idealy use one path per icon to modified it more easily)
+-->
+<script>
+//import { h } from 'vue'
+
+const IconsList = [
+  {
+    id: 'pause-icon',
+    viewBox: '0 0 21.23 24',
+    paths: [
+      {
+        d: 'm17.08,24c-.74,0-1.44-.29-1.95-.82-.53-.51-.83-1.22-.82-1.95V2.77c0-.74.29-1.44.82-1.95C15.64.29,16.34,0,17.08,0h1.39c.74,0,1.44.29,1.95.82.53.51.83,1.22.82,1.95v18.46c0,.74-.29,1.44-.82,1.95-.51.53-1.22.83-1.95.82h-1.39Zm-14.31,0c-.74,0-1.44-.29-1.95-.82C.29,22.67,0,21.97,0,21.23V2.77c0-.74.29-1.44.82-1.95C1.33.29,2.03,0,2.77,0h1.38c.74,0,1.44.29,1.95.82.53.51.83,1.22.82,1.95v18.46c0,.74-.29,1.44-.82,1.95-.51.53-1.22.83-1.95.82h-1.38Z'
+      }
+    ]
+  },
+  {
+    id: 'replay-icon',
+    viewBox: '0 0 21.06 24',
+    paths: [
+      {
+        d: 'm10.53,24c-1.41.01-2.81-.27-4.11-.83-1.25-.53-2.38-1.3-3.34-2.25-.96-.96-1.72-2.09-2.25-3.34C.27,16.28,0,14.88,0,13.47c0-.25.09-.49.27-.66.17-.18.41-.27.66-.27.25,0,.49.09.66.27.18.17.27.41.27.66-.04,2.31.87,4.54,2.52,6.15,1.61,1.65,3.84,2.57,6.15,2.53,2.31.04,4.54-.87,6.15-2.53,1.65-1.61,2.57-3.84,2.52-6.15.04-2.31-.87-4.54-2.52-6.15-1.61-1.65-3.84-2.57-6.15-2.52h-.33l1.32,1.32c.18.17.28.4.27.65,0,.25-.1.48-.27.66-.17.18-.41.29-.66.3-.25,0-.49-.1-.66-.28l-2.79-2.8c-.22-.2-.34-.49-.34-.78,0-.3.12-.58.34-.78L10.21.27C10.39.09,10.62,0,10.87,0c.25,0,.49.11.67.29.17.17.27.41.28.65,0,.25-.1.49-.28.65l-1.34,1.34h.33c1.41-.01,2.81.27,4.11.83,1.25.53,2.38,1.3,3.34,2.25.96.96,1.72,2.09,2.25,3.34.56,1.3.84,2.7.83,4.11.01,1.41-.27,2.81-.83,4.11-.53,1.25-1.3,2.38-2.25,3.34-.96.96-2.09,1.72-3.34,2.25-1.3.56-2.69.84-4.1.83Z'
+      }
+    ]
+  },
+  {
+    id: 'play-icon',
+    viewBox: '0 0 19.72 24',
+    paths: [
+      {
+        id: 'triangle',
+        d: 'm0,21.97V2.03C-.02,1.48.21.94.61.57.99.2,1.5,0,2.03,0c.18,0,.36.03.53.07.19.05.37.12.53.22l15.7,9.99c.29.19.53.45.69.76.15.3.23.62.23.96,0,.33-.08.66-.23.96-.16.31-.4.56-.69.76L3.1,23.71c-.17.1-.35.17-.53.22-.17.05-.35.07-.53.07-.53,0-1.04-.2-1.42-.57C.21,23.05-.02,22.52,0,21.97H0Z'
+      }
+    ]
+  },
+  {
+    id: 'volume-high-icon',
+    paths: [
+      {
+        viewBox: '0 0 25.86 24',
+        d: 'm23.54,12c.02-2.07-.58-4.1-1.71-5.84-1.11-1.73-2.71-3.1-4.59-3.94-.29-.13-.52-.35-.66-.63-.14-.26-.16-.57-.05-.85.11-.3.36-.54.66-.65.31-.12.66-.11.96.03,2.29,1.02,4.24,2.69,5.61,4.79,1.4,2.1,2.13,4.58,2.1,7.1.02,2.52-.71,5-2.1,7.1-1.37,2.1-3.32,3.76-5.61,4.79-.3.14-.65.15-.96.03-.31-.11-.55-.35-.66-.65-.11-.28-.09-.59.05-.85.14-.28.37-.5.66-.63,1.88-.84,3.48-2.21,4.59-3.94,1.13-1.74,1.73-3.77,1.71-5.84Zm-17.79,3.91H1.4c-.37.01-.74-.13-1-.4C.13,15.25,0,14.88,0,14.51v-4.95c-.01-.37.13-.74.4-1,.26-.27.63-.41,1-.4h4.35l4.64-4.64c.32-.36.85-.47,1.28-.25.46.17.75.61.73,1.1v15.34c.03.49-.27.93-.73,1.09-.44.21-.96.11-1.28-.25l-4.64-4.64Zm13.62-3.87c0,.95-.2,1.88-.6,2.74-.38.83-.93,1.58-1.62,2.18-.2.14-.47.16-.69.04-.23-.1-.37-.33-.36-.58V7.57c-.01-.25.13-.48.36-.58.22-.12.49-.1.69.04.69.62,1.25,1.38,1.62,2.23.4.87.6,1.81.6,2.77h0Z'
+      }
+    ]
+  },
+  {
+    id: 'volume-low-icon',
+    paths: [
+      {
+        viewBox: '0 0 26.19 24',
+        d: 'm7.77,17.23H1.89c-.51.01-1-.18-1.35-.54C.18,16.33-.01,15.84,0,15.34v-6.69c-.01-.51.18-1,.54-1.35.36-.36.85-.55,1.35-.54h5.88L14.04.49c.44-.49,1.14-.63,1.73-.34.62.22,1.02.83.98,1.49v20.74c.04.66-.36,1.26-.98,1.48-.59.29-1.3.14-1.73-.34l-6.27-6.28Zm18.41-5.24c0,1.28-.27,2.55-.81,3.71-.51,1.13-1.26,2.13-2.2,2.95-.27.2-.64.22-.93.06-.31-.13-.51-.45-.49-.79V5.96c-.02-.34.18-.65.49-.79.3-.16.66-.14.93.06.94.84,1.68,1.87,2.2,3.02.54,1.18.81,2.45.81,3.75h0Z'
+      }
+    ]
+  },
+  {
+    id: 'volume-mute-icon',
+    paths: [
+      {
+        viewBox: '0 0 24.35 24',
+        d: 'm18.96,20.37c-.22.14-.44.27-.67.4s-.46.24-.71.34c-.25.11-.53.11-.78,0-.26-.1-.46-.31-.55-.56-.1-.24-.08-.52.04-.74.12-.24.32-.43.57-.54.17-.07.34-.16.51-.25.16-.09.31-.2.46-.31l-5.12-4.59v3.34c.02.42-.23.81-.63.95-.38.18-.83.09-1.11-.22l-4.01-4.01h-3.76c-.32,0-.64-.12-.86-.35-.23-.23-.36-.54-.35-.86v-4.28c0-.32.12-.64.35-.86.23-.23.54-.36.86-.35h2.87L.29,1.7C.1,1.52,0,1.27,0,1,0,.74.09.48.29.29.47.1.73,0,.99,0c.27,0,.52.1.71.29l22,22c.19.19.29.44.28.7,0,.27-.09.53-.28.71-.19.19-.44.3-.71.29-.27,0-.52-.1-.71-.29l-3.33-3.34Zm3.39-3.2l-1.44-1.44c.46-.72.82-1.51,1.07-2.34.25-.84.37-1.72.37-2.6.01-1.79-.5-3.54-1.48-5.04-.96-1.5-2.34-2.69-3.97-3.41-.25-.11-.45-.3-.57-.55-.12-.23-.14-.5-.04-.74.1-.26.31-.47.57-.56.27-.1.57-.1.83.03,1.98.88,3.66,2.32,4.85,4.13,1.21,1.82,1.84,3.96,1.82,6.15,0,1.15-.17,2.29-.52,3.38-.34,1.06-.84,2.07-1.48,2.99h0Zm-4.1-4.1l-2.34-2.34v-3.74c0-.22.12-.42.32-.51.19-.11.42-.09.6.03.64.5,1.14,1.18,1.42,1.94.31.76.48,1.56.49,2.38,0,.39-.04.78-.12,1.16-.08.37-.2.73-.37,1.08h0Zm-5.54-5.53l-2.89-2.9,1.15-1.15c.28-.31.73-.4,1.11-.22.4.14.65.53.63.95v3.33Z'
+      }
+    ]
+  },
+  {
+    id: 'fullscreen-icon',
+    viewBox: '0 0 32 32',
+    paths: [
+      {
+        d: 'm3.43,28.57h6.29c.46-.01.9.17,1.22.49.33.32.5.76.49,1.22.01.46-.17.9-.49,1.22-.32.33-.76.5-1.22.49H2.07c-.55.01-1.08-.2-1.47-.59C.2,31.02-.01,30.49,0,29.93v-7.65c-.01-.46.17-.9.49-1.22.32-.33.76-.5,1.22-.49.46-.01.9.17,1.22.49.33.32.5.76.49,1.22v6.29ZM3.43,3.43v6.29c.01.46-.17.9-.49,1.22-.32.33-.76.5-1.22.49-.46.01-.9-.17-1.22-.49C.17,10.61-.01,10.17,0,9.71V2.07C-.01,1.52.2.98.59.59.98.2,1.52-.01,2.07,0h7.65c.46-.01.9.17,1.22.49.33.32.5.76.49,1.22.01.46-.17.9-.49,1.22-.32.33-.76.5-1.22.49H3.43Zm25.14,25.14v-6.29c-.01-.46.17-.9.49-1.22.32-.33.76-.5,1.22-.49.46-.01.9.17,1.22.49.33.32.5.76.49,1.22v7.65c.01.55-.2,1.08-.59,1.47-.39.39-.92.61-1.47.59h-7.65c-.46.01-.9-.17-1.22-.49-.33-.32-.5-.76-.49-1.22-.01-.46.17-.9.49-1.22.32-.33.76-.5,1.22-.49h6.29Zm0-25.14h-6.29c-.46.01-.9-.17-1.22-.49-.33-.32-.5-.76-.49-1.22-.01-.46.17-.9.49-1.22C21.39.17,21.83-.01,22.29,0h7.65c.55-.01,1.08.2,1.47.59.39.39.61.92.59,1.47v7.65c.01.46-.17.9-.49,1.22-.32.33-.76.5-1.22.49-.46.01-.9-.17-1.22-.49-.33-.32-.5-.76-.49-1.22V3.43Z'
+      }
+    ]
+  },
+  {
+    id: 'fullscreen-exit-icon',
+    viewBox: '0 0 32.02 32',
+    paths: [
+      {
+        d: 'm6.05,25.96H1.41c-.38,0-.74-.14-1.01-.41C.14,25.28,0,24.92,0,24.54c0-.38.14-.74.41-1.01.27-.27.63-.41,1.01-.41h5.76c.45-.01.89.17,1.21.49.32.32.5.76.49,1.21v5.76c0,.38-.14.74-.41,1.01-.26.27-.63.42-1.01.41-.38,0-.74-.14-1.01-.41-.27-.27-.41-.63-.4-1.01v-4.63Zm19.93,0v4.63c0,.38-.14.74-.41,1.01-.26.27-.63.42-1.01.41-.38,0-.74-.14-1.01-.41-.27-.27-.41-.63-.4-1.01v-5.76c-.01-.45.17-.89.49-1.21.32-.32.76-.5,1.21-.49h5.76c.38,0,.74.14,1.01.41.27.26.42.63.41,1.01,0,.38-.14.74-.41,1.01-.27.27-.63.41-1.01.41h-4.63ZM6.05,6.05V1.41c0-.38.14-.74.41-1.01C6.72.14,7.08,0,7.46,0c.38,0,.74.14,1.01.41.27.27.41.63.4,1.01v5.76c.01.45-.17.89-.49,1.21-.32.32-.76.5-1.21.49H1.41c-.38,0-.74-.14-1.01-.41C.14,8.2,0,7.83,0,7.46c0-.38.14-.74.41-1.01.27-.27.63-.41,1.01-.41h4.63Zm19.93,0h4.63c.38,0,.74.14,1.01.41.27.26.42.63.41,1.01,0,.38-.14.74-.41,1.01-.27.27-.63.41-1.01.41h-5.76c-.45.01-.89-.17-1.21-.49-.32-.32-.5-.76-.49-1.21V1.41c0-.38.14-.74.41-1.01C23.82.14,24.19,0,24.56,0c.38,0,.74.14,1.01.41.27.27.41.63.4,1.01v4.63Z'
+      }
+    ]
+  },
+  {
+    id: 'pip-icon',
+    paths: [
+      {
+        d: 'M21 19.031v-14.063h-18v14.063h18zM23.016 18.984q0 0.797-0.609 1.406t-1.406 0.609h-18q-0.797 0-1.406-0.609t-0.609-1.406v-14.016q0-0.797 0.609-1.383t1.406-0.586h18q0.797 0 1.406 0.586t0.609 1.383v14.016zM18.984 11.016v6h-7.969v-6h7.969z'
+      }
+    ]
+  },
+  {
+    id: 'subtitle-off-icon',
+    viewBox: '0 0 40.53 32',
+    paths: [
+      {
+        d: 'm3.86,32c-1.03.02-2.02-.39-2.74-1.12C.39,30.16-.02,29.17,0,28.14V3.86C-.02,2.83.39,1.84,1.12,1.12,1.84.39,2.83-.02,3.86,0h32.82c1.03-.02,2.02.38,2.74,1.12.74.72,1.14,1.71,1.12,2.74v24.29c.02,1.03-.38,2.02-1.12,2.74-.72.73-1.71,1.14-2.74,1.12H3.86Zm0-3.2h32.82c.17,0,.34-.08.45-.21.13-.12.2-.28.21-.45V3.86c0-.17-.08-.34-.21-.45-.12-.13-.28-.2-.45-.21H3.86c-.17,0-.34.08-.45.21-.13.12-.2.28-.21.45v24.29c0,.17.08.34.21.45.12.13.28.2.45.21Zm-.66,0h0Zm6.48-4.88h13.7c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46h-13.7c-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm7.47-8.08h13.7c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46h-13.7c-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm-7.47,0c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm21.17,8.08c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Z'
+      }
+    ]
+  },
+  {
+    id: 'subtitle-on-icon',
+    viewBox: '0 0 40.53 32',
+    paths: [
+      {
+        d: 'm3.86,32c-1.03.02-2.02-.39-2.74-1.12C.39,30.16-.02,29.17,0,28.14V3.86C-.02,2.83.39,1.84,1.12,1.12,1.84.39,2.83-.02,3.86,0h32.82c1.03-.02,2.02.38,2.74,1.12.74.72,1.14,1.71,1.12,2.74v24.29c.02,1.03-.38,2.02-1.12,2.74-.72.73-1.71,1.14-2.74,1.12H3.86Zm5.83-8.08h13.7c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46h-13.7c-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm7.47-8.08h13.7c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46h-13.7c-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm-7.47,0c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Zm21.17,8.08c.43.01.84-.16,1.14-.46.3-.3.47-.71.46-1.14.01-.43-.16-.84-.46-1.14-.3-.3-.71-.47-1.14-.46-.43-.01-.84.16-1.14.46-.3.3-.47.71-.46,1.14-.01.43.16.84.46,1.14.3.3.71.47,1.14.46h0Z'
+      }
+    ]
+  },
+  {
+    id: 'transcript-off-icon',
+    viewBox: '0 0 25.26 32',
+    paths: [
+      {
+        d: 'm7.58,25.68h10.1c.34,0,.66-.12.9-.36.24-.24.37-.56.36-.9,0-.34-.12-.66-.36-.9-.24-.24-.56-.37-.9-.36H7.58c-.34,0-.66.12-.9.36-.24.24-.37.56-.36.9,0,.34.12.66.36.9.24.24.56.37.9.36Zm0-6.74h10.1c.34,0,.66-.12.9-.36.24-.24.37-.56.36-.9,0-.34-.12-.66-.36-.9-.24-.24-.56-.37-.9-.36H7.58c-.34,0-.66.12-.9.36-.24.24-.37.56-.36.9,0,.34.12.66.36.9.24.24.56.37.9.36Zm-4.53,13.05c-.81.02-1.59-.3-2.16-.88C.3,30.55-.02,29.77,0,28.96V3.04C-.02,2.23.3,1.45.88.88,1.45.3,2.23-.02,3.04,0h12.12c.4,0,.8.08,1.17.24.37.15.7.37.98.65l7.07,7.07c.28.28.5.61.65.98.16.37.24.77.24,1.17v18.85c.02.81-.3,1.59-.88,2.16-.57.58-1.35.9-2.16.88H3.04ZM15.16,8.58V2.53H3.04c-.14,0-.26.06-.36.16-.1.09-.16.22-.16.36v25.91c0,.14.06.26.16.36.09.1.22.16.36.16h19.17c.14,0,.26-.06.36-.16.1-.09.16-.22.16-.36V10.1h-6.06c-.41.01-.8-.15-1.09-.44-.29-.29-.45-.68-.43-1.09h0ZM2.53,2.53h0Z'
+      }
+    ]
+  },
+  {
+    id: 'transcript-on-icon',
+    viewBox: '0 0 25.26 32',
+    paths: [
+      {
+        d: 'm7.58,25.68h10.1c.34,0,.66-.12.9-.36.24-.24.37-.56.36-.9,0-.34-.12-.66-.36-.9-.24-.24-.56-.37-.9-.36H7.58c-.34,0-.66.12-.9.36-.24.24-.37.56-.36.9,0,.34.12.66.36.9.24.24.56.37.9.36Zm0-6.74h10.1c.34,0,.66-.12.9-.36.24-.24.37-.56.36-.9,0-.34-.12-.66-.36-.9-.24-.24-.56-.37-.9-.36H7.58c-.34,0-.66.12-.9.36-.24.24-.37.56-.36.9,0,.34.12.66.36.9.24.24.56.37.9.36Zm-4.53,13.05c-.81.02-1.59-.3-2.16-.88C.3,30.55-.02,29.77,0,28.96V3.04C-.02,2.23.3,1.45.88.88,1.45.3,2.23-.02,3.04,0h12.12c.4,0,.8.08,1.17.24.36.15.69.37.97.65l7.07,7.07c.28.28.5.61.65.97.16.37.24.77.24,1.17v18.85c.02.81-.3,1.59-.88,2.16-.57.58-1.35.9-2.16.88H3.04ZM15.16,8.59c-.01.4.15.8.44,1.08.28.29.68.45,1.08.44h6.06l-7.58-7.58v6.06Z'
+      }
+    ]
+  },
+  {
+    id: 'close-square-icon',
+    viewBox: '0 0 16 16',
+    paths: [
+      {
+        d: 'M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z'
+      },
+      {
+        d: 'M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708'
+      }
+    ]
+  },
+  {
+    id: 'branch-crochet-icon',
+    paths: [
+      {
+        id: 'Tracé_3833',
+        'data-name': 'Tracé 3833',
+        d: 'M0,0H24V24H0Z',
+        fill: 'none'
+      },
+
+      {
+        id: 'Tracé_3834',
+        'data-name': 'Tracé 3834',
+        d: 'M9,16.2,4.8,12,3.4,13.4,9,19,21,7,19.6,5.6Z',
+        fill: '#e6f5ff'
+      }
+    ]
+  },
+  {
+    id: 'navigate-next-icon',
+    viewBox: '0 0 7.41 12',
+    paths: [
+      {
+        id: 'Path_3899',
+        'data-name': 'Path 3899',
+        d: 'M0,0H24V24H0Z',
+        fill: 'none'
+      },
+
+      {
+        id: 'Path_3900',
+        'data-name': 'Path 3900',
+        d: 'M10.02,6,8.61,7.41,13.19,12,8.61,16.59,10.02,18l6-6Z',
+        transform: 'translate(-8.61 -6)'
+      }
+    ]
+  },
+  {
+    id: 'navigate-previous-icon',
+    paths: [
+      {
+        id: 'Path_3899',
+        'data-name': 'Path 3899',
+        d: 'M24 24H0V0h24Z',
+        fill: 'none'
+      },
+      {
+        id: 'Path_3900',
+        'data-name': 'Path 3900',
+        d: 'm13.98 18 1.41-1.41L10.81 12l4.58-4.59L13.98 6l-6 6Z'
+      }
+    ]
+  },
+  {
+    id: 'fleche-gauche-icon',
+    paths: [
+      {
+        id: 'arrow_forward_FILL0_wght400_GRAD0_opsz48',
+        d: 'M11.7 23.4c-.3 0-.6-.1-.8-.3L.3 12.5c-.1-.1-.2-.2-.3-.4v-.4c0-.1 0-.3.1-.4.1-.1.2-.3.3-.4L10.9.3c.5-.4 1.1-.4 1.6 0 .4.5.4 1.2 0 1.6l-8.6 8.6h19c.6 0 1.1.5 1.1 1.2 0 .6-.5 1.1-1.2 1.1H3.9l8.6 8.6c.4.5.4 1.1 0 1.6-.2.3-.5.4-.8.4z'
+      }
+    ]
+  },
+  {
+    id: 'fleche-droite-icon',
+    paths: [
+      {
+        id: 'arrow_forward_FILL0_wght400_GRAD0_opsz48',
+        d: 'M11.4 23.1c-.4-.5-.4-1.1 0-1.6l8.6-8.6H1.1c-.6 0-1.2-.5-1.2-1.1 0-.6.5-1.2 1.1-1.2h19L11.4 2c-.4-.5-.4-1.2 0-1.6.5-.4 1.1-.4 1.6 0L23.6 11c.1.1.2.2.3.4.1.1.1.3.1.4 0 .1 0 .3-.1.4-.1.2-.2.3-.3.4L13 23.2c-.2.2-.5.3-.8.3-.3-.1-.6-.2-.8-.4z'
+      }
+    ]
+  },
+  {
+    id: 'fleche-retour-icon',
+    viewBox: '0 0 11.667 11.46',
+    paths: [
+      {
+        'data-name': 'Path 4230',
+        d: 'M433.865,369.022H433.6v-.005h-7.548l2.014-2.171-1.1-1.182-3.9,4.19,3.9,4.191,1.1-1.182-2.014-2.171H433v4.57h-2.5v1.861h3.366a.9.9,0,0,0,.866-.93v-6.346A.811.811,0,0,0,433.865,369.022Z',
+        transform: 'translate(-423.065 -365.664)'
+      }
+    ]
+  },
+  {
+    id: 'fleche-haut-icon',
+    viewBox: '0 0 18.01 10.25',
+    paths: [
+      {
+        d: 'm9.02,0c.15,0,.3.02.44.08.15.06.29.16.4.28l7.85,7.85c.22.23.33.54.3.85,0,.32-.12.62-.34.85-.21.24-.53.37-.85.34-.3-.04-.59-.17-.81-.38l-6.98-6.97-6.98,6.97c-.23.22-.53.35-.85.36-.33.04-.65-.1-.85-.36-.26-.19-.39-.51-.34-.83.03-.32.16-.63.38-.87L8.19.36c.11-.12.25-.21.4-.28C8.73.03,8.87,0,9.02,0Z'
+      }
+    ]
+  },
+  {
+    id: 'fleche-bas-icon',
+    viewBox: '0 0 18.01 10.25',
+    paths: [
+      {
+        d: 'm8.99,10.25c-.15,0-.3-.02-.44-.08-.15-.06-.29-.16-.4-.28L.3,2.05C.09,1.82-.02,1.51,0,1.19,0,.88.12.57.34.34.55.1.87-.03,1.19,0c.3.04.59.17.81.38l6.98,6.97L15.96.38c.23-.22.53-.35.85-.36.33-.04.65.1.85.36.26.19.39.51.34.83-.03.32-.16.63-.38.87l-7.8,7.81c-.11.12-.25.21-.4.28-.14.05-.28.08-.43.08Z'
+      }
+    ]
+  },
+  {
+    id: 'home-icon',
+    viewBox: '0 0 20 17',
+    paths: [
+      {
+        id: 'Path_3912',
+        'data-name': 'Path 3912',
+        d: 'M10,20V14h4v6h5V12h3L12,3,2,12H5v8Z',
+        transform: 'translate(-2 -3)'
+      }
+    ]
+  },
+  {
+    id: 'timeline-icon',
+    viewBox: '0 0 33 18',
+    paths: [
+      {
+        id: 'timeline_FILL0_wght400_GRAD0_opsz48',
+        'data-name': 'timeline FILL0 wght400 GRAD0 opsz48',
+        d: 'M2.93,18.46a2.63,2.63,0,0,1,0-5.25l.39,0a4.21,4.21,0,0,1,.49.09l7.5-7.5a2.73,2.73,0,0,1-.1-.48c0-.13,0-.26,0-.39a2.62,2.62,0,0,1,4.48-1.84A2.51,2.51,0,0,1,16.43,5s0,.33-.11.85L20.45,10a2.73,2.73,0,0,1,.48-.1l.38,0,.37,0a2.66,2.66,0,0,1,.49.1l6-6a4.21,4.21,0,0,1-.09-.49c0-.12,0-.25,0-.38a2.63,2.63,0,1,1,2.63,2.63l-.38,0a3.86,3.86,0,0,1-.49-.09l-6,6a4,4,0,0,1,.09.48,2.55,2.55,0,0,1,0,.39,2.63,2.63,0,0,1-5.25,0c0-.13,0-.26,0-.39a2.73,2.73,0,0,1,.1-.48L14.67,7.47a2.66,2.66,0,0,1-.49.1l-.38,0L13,7.47,5.45,15a4.21,4.21,0,0,1,.09.49c0,.13,0,.25,0,.38A2.63,2.63,0,0,1,2.93,18.46Z',
+        transform: 'translate(-0.31 -0.46)'
+      }
+    ]
+  },
+  {
+    id: 'info-icon',
+    viewBox: '0 0 17.9 17.91',
+    paths: [
+      {
+        d: 'M9.07 13.41a.65.65 0 0 0 .67-.63V8.66a.63.63 0 0 0-.2-.46.67.67 0 0 0-.47-.2.65.65 0 0 0-.67.63v4.08a.59.59 0 0 0 .2.46.67.67 0 0 0 .47.24ZM9 6.34a.69.69 0 0 0 .53-.2.67.67 0 0 0 .21-.52.74.74 0 0 0-.21-.54.73.73 0 0 0-1 0 .74.74 0 0 0-.21.54.67.67 0 0 0 .21.52.69.69 0 0 0 .47.2Zm0 11.57a9 9 0 0 1-3.55-.69 8.68 8.68 0 0 1-4.76-4.76 9.45 9.45 0 0 1 0-7.09 8.79 8.79 0 0 1 1.9-2.85 9.05 9.05 0 0 1 12.8 12.8 8.88 8.88 0 0 1-2.86 1.9 9.1 9.1 0 0 1-3.53.69Z'
+      }
+    ]
+  },
+  {
+    id: 'clock-icon',
+    viewBox: '0 0 18 21.01',
+    paths: [
+      {
+        id: 'Path_3904',
+        d: 'M12 0H6v2h6V0zM8 13h2V7H8v6zm8.03-6.61 1.42-1.42c-.43-.51-.9-.98-1.41-1.41l-1.42 1.42c-3.88-3.1-9.55-2.47-12.65 1.41S-.5 15.94 3.38 19.04s9.55 2.47 12.65-1.41a8.992 8.992 0 0 0 0-11.24zM9 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7c0 3.86-3.13 7-6.99 7H9z'
+      }
+    ]
+  }
+]
+
+export default {
+  props: {
+    viewBox: {
+      type: String,
+      default: '0 0 24 24'
+    }
+  },
+
+  methods: {},
+
+  render(h) {
+    return h('svg', { style: 'display: none', class: 'app-icons' }, [
+      h(
+        'defs',
+        {},
+        IconsList.map((icon) => {
+          return h(
+            'symbol',
+            {
+              attrs: {
+                id: icon.id,
+                viewBox: (() => (icon.viewBox ? icon.viewBox : '0 0 24 24'))()
+              }
+            },
+            icon.paths.map((_p) => {
+              return h('path', { attrs: { ..._p } })
+            })
+          )
+        })
+      )
+    ])
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+svg {
+  width: 28px;
+  height: 28px;
+  fill: #fff;
+  stroke: #fff;
+  cursor: pointer;
+}
+</style>

package/src/components/AppCompSettingsMenu.vue

@@ -31,6 +31,7 @@
       <app-base-button
         v-b-toggle.sidebar-settings
         class="float-right btn-primary"
+        :title="$t('user_settings.close')"
       >
         {{ $t('user_settings.close') }}
       </app-base-button>
@@ -60,28 +61,26 @@ export default {
       'onboardingEnabled'
     ]),
     settingsOptions() {
-      return this.$store.state.isDr
-        ? this.settingsOptionsEL
-        : this.settingsOptionsELPlus
+      return this.settingsOptionsELPlus
     }
   },
   watch: {
     getApplicationSettings: {
       immediate: true,
       handler() {
-        this.getSettingsFromStore()
+        this.getAppSettingsInStore()
       }
     }
   },
   created() {
-    setTimeout(() => this.getSettingsFromStore(), 1700)
+    setTimeout(() => this.getAppSettingsInStore(), 1700)
 
     this.$bus.$on('save-settings', (settings) => {
       this.saveSettings(settings)
     })
   },
   methods: {
-    getSettingsFromStore() {
+    getAppSettingsInStore() {
       this.settingsSelected = { ...this.getApplicationSettings }
     },
 
@@ -133,7 +132,7 @@ export default {
           verb: 'preferred',
           definition: text,
           description: text,
-          extension: [
+          extensions: [
             {
               id: 'application-settings',
               content: {
@@ -152,7 +151,7 @@ export default {
       }
 
       //update sidebar data
-      this.getSettingsFromStore()
+      this.getAppSettingsInStore()
     },
 
     /**