comand-component-library 4.0.9 → 4.0.11

package/src/assets/data/pages/boxes-team-overview.json

@@ -0,0 +1,302 @@
+[
+  {
+    "boxesPerRow": 4,
+    "useRowViewAsDefault": true,
+    "useGap": true,
+    "cmdHeadline": {
+      "headlineText": "Team 1",
+      "headlineLevel": 3
+    },
+    "boxes": [
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 1",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-1.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User profile with image",
+          "tag": [
+            "Tagname",
+            "Long tag",
+            "One more tag"
+          ],
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 2",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-2.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 3",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-3.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User with a long text as description that wraps over multiple lines",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 4",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-4.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 5",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-5.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      }
+    ]
+  },
+  {
+    "boxesPerRow": 4,
+    "useRowViewAsDefault": true,
+    "useGap": true,
+    "cmdHeadline": {
+      "headlineText": "Team 1",
+      "headlineLevel": 3
+    },
+    "boxes": [
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 1",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-1.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User profile with image",
+          "tag": [
+            "Tagname",
+            "Long tag",
+            "One more tag"
+          ],
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 2",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-2.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 3",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-3.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User with a long text as description that wraps over multiple lines",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 4",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-4.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      },
+      {
+        "boxType": "user",
+        "user": {
+          "name": "User name 5",
+          "age": 35,
+          "gender": "m",
+          "imageSrc": "/media/images/user-images/fake-user-5.jpg",
+          "profession": "User profession",
+          "position": "User position",
+          "description": "User description",
+          "links": [
+            {
+              "path": "mailto:",
+              "iconClass": "icon-mail",
+              "tooltip": "Send mail"
+            },
+            {
+              "path": "https://www.comand-cms.com",
+              "target": "comand",
+              "iconClass": "icon-globe",
+              "tooltip": "Visit website"
+            },
+            {
+              "path": "tel:",
+              "iconClass": "icon-phone",
+              "tooltip": "Make call"
+            }
+          ]
+        }
+      }
+    ]
+  }
+]

package/src/assets/data/pages/list-of-downloads.json

@@ -2,7 +2,7 @@
   {
     "headline": {
       "headlineLevel": 4,
-      "headlineText": "Segment #1 (vertical list)"
+      "headlineText": "List #1 (vertical list)"
     },
     "orientation": "vertical",
     "links": [
@@ -29,7 +29,7 @@
   {
     "headline": {
       "headlineLevel": 4,
-      "headlineText": "Segment #2 (horizontal list)"
+      "headlineText": "List #2 (horizontal list)"
     },
     "orientation": "horizontal",
     "links": [

package/src/assets/data/pages/list-of-site-links.json

@@ -2,7 +2,7 @@
   {
     "headline": {
       "headlineLevel": 4,
-      "headlineText": "Segment #1 (vertical list)"
+      "headlineText": "List #1 (vertical list)"
     },
     "orientation": "vertical",
     "links": [
@@ -42,7 +42,7 @@
   {
     "headline": {
       "headlineLevel": 4,
-      "headlineText": "Segment #2 (horizontal list)"
+      "headlineText": "List #2 (horizontal list)"
     },
     "orientation": "horizontal",
     "links": [

package/src/assets/data/social-networks-page-by-json.json

@@ -1,28 +1,28 @@
 [
   {
     "id": "social-network-facebook",
-    "path": "https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fdevelopment.comand-cms.com%2Fmodule%2Fteam.html",
+    "path": "https://www.facebook.com/sharer/sharer.php?u=",
     "tooltip": "Share this page on facebook",
     "iconClass": "icon-facebook",
     "linkText": "Share"
   },
   {
     "id": "social-network-x",
-    "path": "https://twitter.com/home?status=http%3A%2F%2Fdevelopment.comand-cms.com%2Fmodule%2Fteam.html",
+    "path": "https://twitter.com/home?status=",
     "tooltip": "Share this page on X",
     "iconClass": "icon-twitter",
     "linkText": "Share"
   },
   {
     "id": "social-network-xing",
-    "path": "https://www.xing.com/spi/shares/new?sc_p=b7910_cb&url=http%3A%2F%2Fdevelopment.comand-cms.com%2Fmodule%2Fteam.html",
+    "path": "https://www.xing.com/spi/shares/new?sc_p=b7910_cb&url=",
     "tooltip": "Share this page on xing",
     "iconClass": "icon-xing",
     "linkText": "Share"
   },
   {
     "id": "social-network-linkedin",
-    "path": "https://www.linkedin.com/cws/share?url=http%3A%2F%2Fdevelopment.comand-cms.com%2Fmodule%2Fteam.html",
+    "path": "https://www.linkedin.com/cws/share?url=",
     "tooltip": "Share this page on linkedin",
     "iconClass": "icon-linkedin",
     "linkText": "Share"

package/src/componentSettingsDataAndControls.vue

@@ -367,16 +367,6 @@ data() {
                     text: "Horizontal",
                     value: "horizontal"
                 }
-            ],
-            showListStyleItems: [
-                {
-                    text: "False (default)",
-                    value: false
-                },
-                {
-                    text: "True",
-                    value: true
-                }
             ]
         },
         cmdLoginFormSettingsData: {

package/src/components/CmdBox.vue

@@ -61,7 +61,7 @@
             <div v-if="useSlots?.includes('body')"
                  :class="{'default-padding': useDefaultPadding, 'allow-scroll': allowContentToScroll}"
                  ref="boxBody"
-                 :style="'max-height: ' + calculatedBodyHeight"
+                 :style="allowContentToScroll ? 'max-height: ' + calculatedBodyHeight : null"
             >
                 <!-- begin slot 'body' -->
                 <slot name="body">
@@ -86,7 +86,7 @@
             <template v-else>
                 <img v-if="image" :src="image.src" :alt="image.altText"/>
 
-                <div :class="{'default-padding': useDefaultPadding, 'allow-scroll': allowContentToScroll}">
+                <div v-else :class="{'default-padding': useDefaultPadding, 'allow-scroll': allowContentToScroll}">
                     <!-- begin CmdHeadline -->
                     <CmdHeadline
                         v-if="cmdHeadline?.headlineText && repeatHeadlineInBoxBody"
@@ -261,7 +261,7 @@ export default {
          */
         maxBoxBodyHeight: {
             type: String,
-            default: "100rem"
+            default: "10rem"
         },
         /**
          * activate if box should be collapsible
@@ -438,12 +438,14 @@ export default {
             required: false
         }
     },
+    /*
     mounted() {
+
         if (this.allowContentToScroll && this.$refs.boxBody) {
             const topPosition = this.$refs.boxBody.getBoundingClientRect().top
             this.calculatedBodyHeight = (document.documentElement.clientHeight - topPosition) + "px"
         }
-    },
+    },*/
     computed: {
         toggleTransition() {
             if (this.useTransition) {
@@ -587,9 +589,14 @@ export default {
         }
 
         .box-body {
+            display: flex;
             flex-grow: 1;
             border-top: var(--box-border);
 
+            & > div:only-child {
+                flex-grow: 1;
+            }
+
             p.cutoff-text {
                 padding: var(--default-padding);
                 margin: 0;

package/src/components/CmdCopyrightInformation.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="cmd-copyright-information" role="contentinfo">
-        <a href="http://www.comand-cms.com" target="comand-website" lang="en" title="CoManD-Website">&copy; CoManD</a>
+        <a href="https://www.comand-cms.com" target="comand-website" lang="en" title="CoManD-Website">&copy; CoManD</a>
     </div>
 </template>
 
@@ -13,7 +13,7 @@ export default {
 <style>
 /* begin cmd-copyright-information ---------------------------------------------------------------------------------------- */
 .cmd-copyright-information {
-    background: var(--default-text-color);
+    background: var(--dark-gray);
     border-top: var(--default-border-width) var(--default-border-style) var(--pure-white);
     text-align: center;
     padding: var(--default-padding);

package/src/components/CmdSiteHeader.vue

@@ -117,7 +117,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style>
 /* begin cmd-site-header ---------------------------------------------------------------------------------------- */
 .cmd-site-header {
     grid-area: site-header;
@@ -155,6 +155,13 @@ export default {
         border-bottom: 0;
     }
 
+    & + #main-navigation-wrapper {
+        nav {
+            border-left: 0;
+            border-right: 0;
+        }
+    }
+
     /* use id to ensure high specificity */
     > .cmd-main-navigation#main-navigation-wrapper:last-child {
         border-bottom: 0;

package/src/components/CmdSocialNetworks.vue

@@ -30,6 +30,8 @@
                     :userMustAcceptDataPrivacy="userMustAcceptDataPrivacy"
                     :buttonTextAlign="buttonTextAlign"
                     :dataPrivacyAccepted="dataPrivacyAccepted"
+                    :page="page"
+                    :appendPage="appendPage"
                 />
                 <!-- end cmd-social-networks (default view) -->
 
@@ -201,24 +203,6 @@ export default {
         }
     },
     methods: {
-        getUrl(network) {
-            if (this.userMustAcceptDataPrivacy && this.dataPrivacyAccepted) {
-                // if path is not given completely by json-data
-                if (this.appendPage) {
-                    // if page to share is given by property
-                    if (this.page) {
-                        return network.path + encodeURIComponent(this.page)
-                    }
-
-                    // if current page should be append to url
-                    return network.path + encodeURIComponent(location.href)
-                }
-
-                // if path is given completely by json-data
-                return network.path
-            }
-            return "#"
-        },
         onAddItem() {
             this.editModeContext.content.addContent(
                 buildComponentPath(this, 'props', 'networks', -1),

package/src/components/CmdSocialNetworksItem.vue

@@ -44,6 +44,22 @@ export default {
         userMustAcceptDataPrivacy: {
             type: Boolean
         },
+        /**
+         * page to share (appended to social-bookmark-url)
+         *
+         * appendPage-property must be activated
+         */
+        page: {
+            type: String,
+            required: false
+        },
+        /**
+         * activate if page to share is not given by json-data
+         */
+        appendPage: {
+            type: Boolean,
+            default: true
+        },
         /**
          * alignment for buttons
          *

package/src/index.js

@@ -49,6 +49,12 @@ export { default as CmdUploadForm } from '@/components/CmdUploadForm.vue'
 export { default as CmdWidthLimitationWrapper } from '@/components/CmdWidthLimitationWrapper.vue'
 export { default as EditComponentWrapper } from '@/components/EditComponentWrapper.vue'
 
+// export page-components
+export { default as BasicForm } from '@/pages/BasicForm.vue'
+export { default as ContactInformation } from '@/pages/ContactInformation.vue'
+export { default as MultipleBoxWrapper } from '@/pages/MultipleBoxWrapper.vue'
+export { default as MultipleListsOfLinks } from '@/pages/MultipleListsOfLinks.vue'
+
 // export directives
 export { default as DirFocus } from '@/directives/focus'
 export { default as DirTelephone } from '@/directives/telephone'

package/src/mixins/pages/BasicForm/DefaultMessageProperties.js

@@ -21,6 +21,8 @@ export default {
         "basic_form.placeholder.city": "City:",
         "basic_form.labeltext.additional_address_info": "Additional address information",
         "basic_form.placeholder.additional_address_info": "Additional address information",
+        "basic_form.labeltext.additional_text": "Additional text",
+        "basic_form.placeholder.additional_text": "Additional text",
         "basic_form.labeltext.data_privacy": "I accept handling and saving of my personal data a mentioned in the <a href='/content/data-privacy-en.html' class='fancybox'>private policy</a>."
       }
     }