comand-component-library 4.0.20 → 4.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/comand-component-library.js +705 -705
- package/dist/comand-component-library.umd.cjs +3 -3
- package/dist/media/images/logos/logo-darkmode.svg +29 -44
- package/dist/media/images/logos/logo-dating-darkmode.svg +29 -0
- package/dist/media/images/logos/logo-dating.svg +27 -0
- package/dist/media/images/logos/logo.svg +27 -209
- package/dist/style.css +1 -1
- package/package.json +3 -2
- package/src/ComponentLibrary.vue +99 -28
- package/src/assets/data/social-networks-page-by-json.json +1 -1
- package/src/assets/data/social-networks-page-by-property.json +1 -1
- package/src/assets/data/tabs.json +3 -3
- package/src/components/CmdBox.vue +22 -1
- package/src/components/CmdFancyBox.vue +6 -0
- package/src/components/CmdListOfLinks.vue +1 -1
- package/src/components/CmdPagination.vue +4 -0
- package/src/components/CmdProgressBar.vue +1 -0
- package/src/components/CmdSiteHeader.vue +1 -1
- package/src/components/CmdSlideButton.vue +0 -2
- package/src/components/CmdTable.vue +3 -0
- package/src/components/CmdTabs.vue +1 -1
- package/src/components/CmdThumbnailScroller.vue +6 -0
- package/src/components/CmdUploadForm.vue +1 -0
- package/src/pages/ContactInformation.vue +4 -4
- package/src/pages/PageOverview.vue +5 -5
|
@@ -4,20 +4,20 @@
|
|
|
4
4
|
"headlineText": "Tab 1 Headline",
|
|
5
5
|
"headlineLevel": 4,
|
|
6
6
|
"iconClass": "icomoon-free:airplane",
|
|
7
|
-
"htmlContent": "<p>
|
|
7
|
+
"htmlContent": "<p>Content for Tab 1</p>"
|
|
8
8
|
},
|
|
9
9
|
{
|
|
10
10
|
"name": "Tab 2",
|
|
11
11
|
"headlineText": "Tab 2 Headline",
|
|
12
12
|
"headlineLevel": 4,
|
|
13
13
|
"iconClass": "icomoon-free:blocked",
|
|
14
|
-
"htmlContent": "<p>
|
|
14
|
+
"htmlContent": "<p>Content for Tab 2</p>"
|
|
15
15
|
},
|
|
16
16
|
{
|
|
17
17
|
"name": "Tab 3",
|
|
18
18
|
"headlineText": "Tab 3 Headline",
|
|
19
19
|
"headlineLevel": 4,
|
|
20
20
|
"iconClass": "cmd:linkedin",
|
|
21
|
-
"htmlContent": "<p>
|
|
21
|
+
"htmlContent": "<p>Content for Tab 3</p>"
|
|
22
22
|
}
|
|
23
23
|
]
|
|
@@ -827,6 +827,21 @@ export default {
|
|
|
827
827
|
li {
|
|
828
828
|
flex: 1;
|
|
829
829
|
border-radius: var(--box-border-radius);
|
|
830
|
+
border-top-left-radius: 0;
|
|
831
|
+
border-top-right-radius: 0;
|
|
832
|
+
|
|
833
|
+
&:not(:only-child) {
|
|
834
|
+
border-bottom-left-radius: 0;
|
|
835
|
+
border-bottom-right-radius: 0;
|
|
836
|
+
|
|
837
|
+
&:first-child {
|
|
838
|
+
border-bottom-left-radius: var(--box-border-radius);
|
|
839
|
+
}
|
|
840
|
+
|
|
841
|
+
&:last-child {
|
|
842
|
+
border-bottom-right-radius: var(--box-border-radius);
|
|
843
|
+
}
|
|
844
|
+
}
|
|
830
845
|
|
|
831
846
|
a {
|
|
832
847
|
flex: 1;
|
|
@@ -834,7 +849,8 @@ export default {
|
|
|
834
849
|
text-align: center;
|
|
835
850
|
background: var(--color-scheme-background);
|
|
836
851
|
border-left: var(--box-border);
|
|
837
|
-
border-radius:
|
|
852
|
+
border-radius: inherit;
|
|
853
|
+
line-height: 100%;
|
|
838
854
|
}
|
|
839
855
|
|
|
840
856
|
&:hover, &:active, &:focus {
|
|
@@ -878,6 +894,11 @@ export default {
|
|
|
878
894
|
.cmd-list-of-links {
|
|
879
895
|
background: none;
|
|
880
896
|
|
|
897
|
+
ul li {
|
|
898
|
+
aspect-ratio: 1/1;
|
|
899
|
+
border-radius: var(--box-border-radius) !important; /* overwrite settings from default-/column-view */
|
|
900
|
+
}
|
|
901
|
+
|
|
881
902
|
ul, ul * {
|
|
882
903
|
border: 0;
|
|
883
904
|
background: inherit;
|
|
@@ -292,7 +292,7 @@ export default {
|
|
|
292
292
|
&.has-navigation {
|
|
293
293
|
grid-template-rows: 1fr;
|
|
294
294
|
grid-template-areas: "company-logo main-navigation";
|
|
295
|
-
padding-bottom:
|
|
295
|
+
padding-bottom: var(--default-padding);
|
|
296
296
|
}
|
|
297
297
|
|
|
298
298
|
.cmd-company-logo {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<div class="cmd-tabs">
|
|
3
3
|
<ul :class="{'stretch-tabs' : stretchTabs}" role="tablist">
|
|
4
4
|
<li v-for="(tab, index) in tabs" :class="{active : showTab === index}" :key="index" role="tab">
|
|
5
|
-
<a
|
|
5
|
+
<a href="#" @click.prevent="setActiveTab(index)" :title="!tab.name ? tab.tooltip : undefined">
|
|
6
6
|
<!-- begin CmdIcon -->
|
|
7
7
|
<CmdIcon v-if="tab.iconClass" :iconClass="tab.iconClass" :type="tab.iconType" />
|
|
8
8
|
<!-- end CmdIcon -->
|
|
@@ -387,6 +387,12 @@ export default {
|
|
|
387
387
|
}
|
|
388
388
|
}
|
|
389
389
|
|
|
390
|
+
.cmd-slide-button {
|
|
391
|
+
top: 50% !important;
|
|
392
|
+
height: auto;
|
|
393
|
+
transform: translateY(-50%);
|
|
394
|
+
}
|
|
395
|
+
|
|
390
396
|
> .inner-thumbnail-wrapper {
|
|
391
397
|
border-radius: var(--default-border-radius);
|
|
392
398
|
padding: calc(var(--default-padding) * 2);
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<!-- begin basicForm -->
|
|
3
|
-
<
|
|
3
|
+
<CmdBasicForm v-if="contactFormOnly" v-bind="basicForm" />
|
|
4
4
|
<!-- end basicForm -->
|
|
5
5
|
|
|
6
6
|
<div v-else class="flex-container">
|
|
7
7
|
<!-- begin basicForm -->
|
|
8
|
-
<
|
|
8
|
+
<CmdBasicForm v-bind="basicForm" />
|
|
9
9
|
<!-- end basicForm -->
|
|
10
10
|
|
|
11
11
|
<!-- begin additional-columns -->
|
|
@@ -31,9 +31,9 @@ export default {
|
|
|
31
31
|
name: "ContactInformation",
|
|
32
32
|
props: {
|
|
33
33
|
/**
|
|
34
|
-
* properties for
|
|
34
|
+
* properties for CmdBasicForm-component
|
|
35
35
|
*/
|
|
36
|
-
|
|
36
|
+
cmdBasicForm: {
|
|
37
37
|
type: Object,
|
|
38
38
|
default: null
|
|
39
39
|
},
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
<span>Contact Information</span>
|
|
7
7
|
</h2>
|
|
8
8
|
<ContactInformation
|
|
9
|
-
:
|
|
9
|
+
:cmdBasicForm="basicForm"
|
|
10
10
|
:cmdAddressData="{}"
|
|
11
11
|
:cmdGoogleMaps="{}">
|
|
12
12
|
<template v-slot:additional-info>
|
|
@@ -21,10 +21,10 @@
|
|
|
21
21
|
<h2 class="headline-demopage" id="section-multiple-lists-of-links-downloads">
|
|
22
22
|
<span>Multiple Lists of links</span>
|
|
23
23
|
</h2>
|
|
24
|
-
<h3>Downloads</h3>
|
|
24
|
+
<h3 id="section-multiple-lists-of-links-downloads">Downloads</h3>
|
|
25
25
|
<MultipleListsOfLinks :segments="listOfDownloadsData" />
|
|
26
26
|
<hr />
|
|
27
|
-
<h3>SiteMap</h3>
|
|
27
|
+
<h3 id="section-multiple-lists-of-links-sitemap">SiteMap</h3>
|
|
28
28
|
<MultipleListsOfLinks :segments="listOfSiteLinksData" />
|
|
29
29
|
</CmdWidthLimitationWrapper>
|
|
30
30
|
<!-- end multiple-lists-of-links ------------------------------------------------------------------------------------------------------------------------------------------------------->
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
<h2 class="headline-demopage" id="section-multiple-box-wrapper">
|
|
35
35
|
<span>Multiple Box Wrapper</span>
|
|
36
36
|
</h2>
|
|
37
|
-
<h3>FAQs</h3>
|
|
37
|
+
<h3 id="section-multiple-box-wrapper-faqs">FAQs</h3>
|
|
38
38
|
<MultipleBoxWrapper :segments="faqsData" />
|
|
39
39
|
<hr />
|
|
40
|
-
<h3>Team Overview</h3>
|
|
40
|
+
<h3 id="section-multiple-box-wrapper-team-overview">Team Overview</h3>
|
|
41
41
|
<MultipleBoxWrapper :segments="boxesTeamOverviewData" />
|
|
42
42
|
</CmdWidthLimitationWrapper>
|
|
43
43
|
<!-- end multiple-box-wrapper ------------------------------------------------------------------------------------------------------------------------------------------------------->
|