comand-component-library 4.0.61 → 4.0.62
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/package.json
CHANGED
package/src/ComponentLibrary.vue
CHANGED
|
@@ -1273,12 +1273,13 @@
|
|
|
1273
1273
|
<a href="#" class="icon-cog" title="Open Component Settings"
|
|
1274
1274
|
@click.prevent="openSettingsSidebar('CmdContainer')"></a>
|
|
1275
1275
|
</h2>
|
|
1276
|
+
<h3>Default Container</h3>
|
|
1276
1277
|
<CmdContainer
|
|
1277
1278
|
style="border: 1px dotted gray"
|
|
1278
1279
|
ref="CmdContainer"
|
|
1279
1280
|
v-bind="cmdContainerSettingsData"
|
|
1280
1281
|
/>
|
|
1281
|
-
|
|
1282
|
+
<h3>Container with vertical slots</h3>
|
|
1282
1283
|
<CmdContainer
|
|
1283
1284
|
style="border: 1px dotted gray"
|
|
1284
1285
|
ref="CmdContainer"
|
|
@@ -1288,6 +1289,16 @@
|
|
|
1288
1289
|
<p>Slot-content</p>
|
|
1289
1290
|
<p>Slot-content</p>
|
|
1290
1291
|
</CmdContainer>
|
|
1292
|
+
<h3>Container with horizontal slots</h3>
|
|
1293
|
+
<CmdContainer
|
|
1294
|
+
style="border: 1px dotted gray"
|
|
1295
|
+
ref="CmdContainer"
|
|
1296
|
+
v-bind="cmdContainerSettingsData"
|
|
1297
|
+
contentOrientation="horizontal"
|
|
1298
|
+
>
|
|
1299
|
+
<div>Slot-Content</div>
|
|
1300
|
+
<div>Slot-Content</div>
|
|
1301
|
+
</CmdContainer>
|
|
1291
1302
|
</CmdWidthLimitationWrapper>
|
|
1292
1303
|
<!-- end container ------------------------------------------------------------------------------------------------------------------------------------------------------->
|
|
1293
1304
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="cmd-container"
|
|
2
|
+
<div class="cmd-container">
|
|
3
3
|
<!-- begin cmd-headline -->
|
|
4
4
|
<CmdHeadline
|
|
5
5
|
v-if="cmdHeadline"
|
|
@@ -101,6 +101,9 @@ export default {
|
|
|
101
101
|
},
|
|
102
102
|
computed: {
|
|
103
103
|
containerClass() {
|
|
104
|
+
|
|
105
|
+
},
|
|
106
|
+
setInnerClass() {
|
|
104
107
|
let htmlClass = null
|
|
105
108
|
switch (this.containerType) {
|
|
106
109
|
case "grid":
|
|
@@ -118,20 +121,6 @@ export default {
|
|
|
118
121
|
break
|
|
119
122
|
}
|
|
120
123
|
return htmlClass
|
|
121
|
-
},
|
|
122
|
-
setInnerClass() {
|
|
123
|
-
if(this.containerType === "grid") {
|
|
124
|
-
return "grid-container-create-columns"
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
if(this.containerType === "flex") {
|
|
128
|
-
if(this.contentOrientation === "horizontal") {
|
|
129
|
-
return "flex-container"
|
|
130
|
-
} else if(this.contentOrientation === "vertical") {
|
|
131
|
-
return "flex-container vertical"
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
return ""
|
|
135
124
|
}
|
|
136
125
|
}
|
|
137
126
|
}
|