added theme for aem corecomponents.dev (#931)

Co-authored-by: Gulshan Mishra <[email protected]>

examples/ui.apps/src/main/content/jcr_root/apps/forms-components-examples/clientlibs/forms-clientlib-site/styles/components/adaptive-form/common.less

@@ -10,6 +10,8 @@
 @silver: #ccc;
 @panel-bg-color: #efefef;
 @wizard-bg-color: #fafafa;
+@chinese-silver: #ccc;
+@dark-blue: #2196f3;
 
 // ====== font size======
 @font-xlg: 1.5rem;
@@ -182,4 +184,4 @@
   padding-right: 1rem;
   font-size: .875rem;
   overflow: auto
-}
+}

examples/ui.apps/src/main/content/jcr_root/apps/forms-components-examples/clientlibs/forms-clientlib-site/styles/components/adaptive-form/switch.less

@@ -0,0 +1,81 @@
+.cmp-adaptiveform-switch {
+  .containerMixin();
+  .descriptionMixin();
+  .validInvalidMixin();
+  &__help-container {
+    flex-direction: row-reverse;
+    display: flex
+  }
+  &__widget-container {
+    flex-direction: row;
+    align-items: baseline;
+    display: flex
+  }
+  &__container {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+  }
+  &__widget {
+    opacity: 0;
+    width: 0;
+    height: 0;
+    display: block;
+  }
+  &__widget-slider {
+    cursor: pointer;
+    background-color: @chinese-silver;
+    border-radius: 34px;
+    transition: all .4s;
+    width: 60px;
+    height: 32px;
+    position: relative;
+  }
+  input:checked + &__widget-slider {
+    background-color: @dark-blue;
+  }
+
+  input:focus + &__widget-slider {
+    box-shadow: 0 0 1px @dark-blue;
+  }
+  [dir="rtl"] &--filled  &__circle-indicator {
+    -webkit-transform: translateX(-26px);
+    -ms-transform: translateX(-26px);
+    transform: translateX(-26px);
+    inset-block-end: 4px;
+    inset-block-start: unset;
+    -webkit-transition: .4s;
+  }
+  &--filled  &__circle-indicator {
+    -webkit-transform: translateX(26px);
+    -ms-transform: translateX(26px);
+    transform: translateX(26px);
+    inset-block-end: 4px;
+    inset-block-start: unset;
+    -webkit-transition: .4s;
+  }
+
+  &__circle-indicator{
+    height: 24px;
+    width: 24px;
+    background-color: @white;
+    border-radius: 50%;
+    transition: all .4s;
+    position: absolute;
+    inset-block-start: 4px;
+    inset-inline-start: 4px;
+  }
+  &__hide-labels &__option--on {
+    display: none;
+  }
+  &__hide-labels &__option--off {
+    display: none;
+  }
+  &__unhide-labels &__option--on {
+    display:block
+  }
+  &__unhide-labels &__option--off {
+    display:block
+  }
+
+}

examples/ui.apps/src/main/content/jcr_root/apps/forms-components-examples/clientlibs/forms-clientlib-site/styles/components/index.less

@@ -39,3 +39,4 @@
 @import 'adaptive-form/verticaltabs.less';
 @import 'adaptive-form/checkbox.less';
 @import 'adaptive-form/termsandconditions.less';
+@import 'adaptive-form/switch.less';

examples/ui.content/src/main/content/jcr_root/content/core-components-examples/library/adaptive-form/switch/.content.xml

@@ -102,7 +102,8 @@
                                 <switch_demo
                                   jcr:title="Switch"
                                   fieldType="checkbox"
-                                  type="string"
+                                  enum="[1,0]"
+                                  enumNames="[ON,OFF]"
                                   jcr:created="{Date}2019-03-06T14:11:01.819+01:00"
                                   jcr:createdBy="admin"
                                   jcr:lastModified="{Date}2019-05-21T18:59:35.605+03:00"