@syncfusion/ej2-form-renderer 34.2.8 → 35.1.42

package/styles/form-renderer/fluent2.css

@@ -1,681 +0,0 @@
-
-
-
-
-
-
-
-
-/* Font Family */
-/* Font Sizes */
-/* Radius */
-/* 1px */
-/* 2px */
-/* 3px */
-/* 4px */
-/* 5px */
-/* 6px */
-/* 7px */
-/* 8px */
-/* 9px */
-/* 10px */
-/* 11px */
-/* 12px */
-/* 13px */
-/* 14px */
-/* 15px */
-/* 16px */
-/* 17px */
-/* 18px */
-/* 19px */
-/* 20px */
-/* 21px */
-/* 22px */
-/* 23px */
-/* 24px */
-/* 25px */
-/* 26px */
-/* 27px */
-/* 28px */
-/* 29px */
-/* 30px */
-/* 31px */
-/* 32px */
-/* 33px */
-/* 34px */
-/* 35px */
-/* 36px */
-/* 37px */
-/* 38px */
-/* 39px */
-/* 40px */
-/* 41px */
-/* 42px */
-/* 43px */
-/* 44px */
-/* 45px */
-/* 46px */
-/* 47px */
-/* 48px */
-/* 49px */
-/* 50px */
-/* 5em */
-/* 65% */
-/* border */
-/* 0px */
-/* 1px */
-/* 1.5px */
-/* 2px */
-/* 3px */
-/* 4px */
-/* 5px */
-/* 6px */
-/* 7px */
-/* 8px */
-/* 9px */
-/* 10px */
-/* 11px */
-/* 12px */
-/* 13px */
-/* 14px */
-/* 15px */
-/* 16px */
-
-
-
-
-.form-renderer-container {
-  padding: 2rem;
-}
-
-.form-renderer-container hr {
-  border: none;
-  height: 0.5px;
-  margin: 0;
-}
-
-.form-renderer {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 1.5rem;
-  /* stylelint-disable-next-line property-no-unknown */
-  container-type: inline-size;
-}
-
-.form-renderer.twolayout {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 1.5rem;
-}
-
-.form-renderer.threelayout {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 1.5rem;
-}
-
-.form-renderer.fourlayout {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 1.5rem;
-}
-
-.form-renderer.twolayout > .form-group:has(.e-btn),
-.form-renderer.threelayout > .form-group:has(.e-btn),
-.form-renderer.fourlayout > .form-group:has(.e-btn) {
-  -ms-flex-item-align: end;
-      align-self: flex-end;
-}
-
-.form-renderer.twolayout > .form-group:has(.e-message),
-.form-renderer.threelayout > .form-group:has(.e-message),
-.form-renderer.fourlayout > .form-group:has(.e-message) {
-  -ms-flex-item-align: end;
-      align-self: flex-end;
-}
-
-.form-renderer.twolayout > .form-group:has(.e-checkbox),
-.form-renderer.threelayout > .form-group:has(.e-checkbox),
-.form-renderer.fourlayout > .form-group:has(.e-checkbox) {
-  -ms-flex-item-align: end;
-      align-self: flex-end;
-}
-
-.form-renderer.twolayout > .form-group:has(.e-switch),
-.form-renderer.threelayout > .form-group:has(.e-switch),
-.form-renderer.fourlayout > .form-group:has(.e-switch) {
-  -ms-flex-item-align: end;
-      align-self: flex-end;
-}
-
-.form-renderer.twolayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)),
-.form-renderer.threelayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)),
-.form-renderer.fourlayout > .form-group:last-child:has(.form-submit-type):not(:has(.form-reset-type)) {
-  grid-column: 1/-1;
-}
-
-.form-renderer.twolayout > .form-group:nth-last-child(2):has(.form-reset-type),
-.form-renderer.twolayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type),
-.form-renderer.threelayout > .form-group:nth-last-child(2):has(.form-reset-type),
-.form-renderer.threelayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type),
-.form-renderer.fourlayout > .form-group:nth-last-child(2):has(.form-reset-type),
-.form-renderer.fourlayout > .form-group:nth-last-child(2):has(.form-reset-type) ~ .form-group:last-child:has(.form-submit-type) {
-  grid-column: auto;
-}
-
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 768px) {
-  .form-renderer.fourlayout {
-    grid-template-columns: repeat(2, 1fr);
-  }
-  .form-renderer.threelayout {
-    grid-template-columns: repeat(2, 1fr);
-  }
-}
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 480px) {
-  .form-renderer.twolayout,
-  .form-renderer.threelayout,
-  .form-renderer.fourlayout {
-    grid-template-columns: 1fr;
-  }
-}
-.e-form-renderer .form-group {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 0.5rem;
-}
-
-.e-form-renderer .field-wrapper {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  width: 100%;
-}
-
-.e-form-renderer .field-wrapper.label-top {
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 0.5rem;
-}
-
-.e-form-renderer .field-wrapper.label-bottom {
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: reverse;
-      -ms-flex-direction: column-reverse;
-          flex-direction: column-reverse;
-  gap: 0.5rem;
-}
-
-.e-form-renderer .field-wrapper.label-left {
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-          flex-direction: row;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  gap: 1rem;
-}
-
-.e-form-renderer .field-wrapper.label-right {
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: reverse;
-      -ms-flex-direction: row-reverse;
-          flex-direction: row-reverse;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  gap: 1rem;
-  -webkit-box-pack: end;
-      -ms-flex-pack: end;
-          justify-content: flex-end;
-}
-
-.e-form-renderer .field-wrapper.label-left .field-input,
-.e-form-renderer .field-wrapper.label-right .field-input {
-  -webkit-box-flex: 1;
-      -ms-flex: 1;
-          flex: 1;
-  min-width: 0;
-}
-
-.e-form-renderer .field-wrapper:has(.e-small) .field-label {
-  font-size: 0.75rem;
-}
-
-.e-form-renderer .form-group .field-description {
-  font-size: 0.75rem;
-}
-
-.e-form-renderer .form-group:has(.e-small) .field-description {
-  font-size: 0.625rem;
-}
-
-.e-form-renderer .field-wrapper:has(.e-bigger) .field-label {
-  font-size: 1rem;
-}
-
-.e-form-renderer .form-group:has(.e-bigger) .field-description {
-  font-size: 0.875rem;
-}
-
-.e-form-renderer .field-label {
-  font-size: 0.875rem;
-  font-weight: 500;
-  margin: 0;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  gap: 4px;
-  -ms-flex-negative: 0;
-      flex-shrink: 0;
-}
-
-.e-form-renderer .field-label .required-asterisk {
-  margin-left: 2px;
-}
-
-.e-form-renderer .field-label .tooltip-icon {
-  cursor: help;
-  font-size: 0.875rem;
-}
-
-.e-form-renderer .field-input {
-  width: 100%;
-}
-
-.e-form-renderer .field-input .e-image-editor {
-  min-height: 250px;
-}
-
-.e-form-renderer .field-input .e-switch-wrapper,
-.e-form-renderer .field-input .e-checkbox-wrapper {
-  margin: 5px 0;
-}
-
-.e-form-renderer .field-error {
-  font-size: 0.75rem;
-  margin-top: 0.25rem;
-  display: block;
-}
-
-.form-renderer-container .e-radio-group {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-}
-
-.form-renderer-container .e-radio-group .e-radio + label {
-  margin-left: 0.5rem;
-}
-
-.e-form-renderer .form-panel-renderer {
-  border: none;
-  border-radius: 8px;
-  padding: 0;
-}
-
-.e-form-renderer .form-panel-renderer:has(.panel-legend) {
-  padding: 1.5rem;
-}
-
-.e-form-renderer .form-panel-renderer legend {
-  font-size: 1.5rem;
-  font-weight: 600;
-  padding-bottom: 1.5rem;
-}
-
-.e-form-renderer .form-panel-renderer .panel-legend {
-  font-size: 1.5rem;
-  font-weight: 600;
-  padding: 0 0.5rem;
-  margin-bottom: 0;
-  border-bottom: none;
-  width: unset;
-}
-
-.e-form-renderer .panel-content {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 1rem;
-  width: 100%;
-}
-
-.e-form-renderer .card-content {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 1rem;
-}
-
-.e-form-renderer .form-table-renderer {
-  width: 100%;
-  border-radius: 8px;
-  overflow: hidden;
-}
-
-.e-form-renderer .form-table-renderer {
-  display: table;
-  width: 100%;
-  border-collapse: separate;
-  border-spacing: 0;
-  overflow-x: auto;
-  overflow-y: hidden;
-}
-
-.e-form-renderer .form-table-renderer .e-form-table-row {
-  display: table-row;
-  background: transparent;
-}
-
-.e-form-renderer .form-table-renderer .e-form-table-cell {
-  display: table-cell;
-  padding: 12px;
-  vertical-align: top;
-}
-
-.e-form-renderer .e-form-table-cell:last-child {
-  border-right: none;
-}
-
-.e-form-renderer .form-table-renderer .e-form-table-row:last-child .e-form-table-cell {
-  border-bottom: none;
-}
-
-.e-form-renderer .e-form-table-cell > .form-table-renderer,
-.e-form-renderer .e-form-table-cell > .form-tabs-renderer,
-.e-form-renderer .e-form-table-cell > .form-card-renderer,
-.e-form-renderer .e-form-table-cell > .form-panel-renderer,
-.e-form-renderer .e-form-table-cell > .form-group {
-  margin-bottom: 1.5rem;
-}
-
-.e-form-renderer .e-form-table-cell > .form-table-renderer:last-child,
-.e-form-renderer .e-form-table-cell > .form-tabs-renderer:last-child,
-.e-form-renderer .e-form-table-cell > .form-card-renderer:last-child,
-.e-form-renderer .e-form-table-cell > .form-panel-renderer:last-child,
-.e-form-renderer .e-form-table-cell > .form-group:last-child {
-  margin-bottom: 0;
-}
-
-.e-form-renderer .form-table-renderer .col,
-.e-form-renderer .form-table-renderer [class^=col-] {
-  min-height: 100%;
-  vertical-align: top;
-}
-
-.e-form-renderer .form-table-renderer .col {
-  width: auto;
-}
-
-.e-form-renderer .form-table-renderer .col-1 {
-  width: 8.33333333%;
-}
-
-.e-form-renderer .form-table-renderer .col-2 {
-  width: 16.66666667%;
-}
-
-.e-form-renderer .form-table-renderer .col-3 {
-  width: 25%;
-}
-
-.e-form-renderer .form-table-renderer .col-4 {
-  width: 33.33333333%;
-}
-
-.e-form-renderer .form-table-renderer .col-5 {
-  width: 41.66666667%;
-}
-
-.e-form-renderer .form-table-renderer .col-6 {
-  width: 50%;
-}
-
-.e-form-renderer .form-table-renderer .col-7 {
-  width: 58.33333333%;
-}
-
-.e-form-renderer .form-table-renderer .col-8 {
-  width: 66.66666667%;
-}
-
-.e-form-renderer .form-table-renderer .col-9 {
-  width: 75%;
-}
-
-.e-form-renderer .form-table-renderer .col-10 {
-  width: 83.33333333%;
-}
-
-.e-form-renderer .form-table-renderer .col-11 {
-  width: 91.66666667%;
-}
-
-.e-form-renderer .form-table-renderer .col-12 {
-  width: auto;
-}
-
-/* Tabs Layout */
-.e-form-renderer .form-tabs-renderer {
-  width: 100%;
-}
-
-.e-form-renderer .tab-content-renderer {
-  padding: 10px;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: 1rem;
-}
-
-.e-form-renderer .form-submit-button {
-  margin-top: 1.5rem;
-  -ms-flex-item-align: start;
-      align-self: flex-start;
-}
-
-.e-form-renderer .field-input .e-input-group,
-.e-form-renderer .field-input .e-control-wrapper {
-  width: 100%;
-}
-
-.e-form-renderer .field-input .e-float-input {
-  width: 100%;
-}
-
-.e-form-renderer .unsupported-component {
-  padding: 1rem;
-  border-radius: 4px;
-  font-size: 0.875rem;
-}
-
-.form-renderer-container .e-tooltip.e-msg-icon::before {
-  font-family: "e-icons";
-  font-size: 16px;
-  height: 16px;
-  margin: 3px 4px;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  line-height: 16px;
-}
-
-.e-form-renderer .form-title h1 {
-  margin-top: 0;
-}
-
-.e-form-renderer .form-title {
-  text-align: center;
-}
-
-.form-renderer-container .e-card .e-card-content {
-  padding: 12px 18px;
-}
-
-/* Responsive */
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 480px) {
-  .e-form-renderer .form-table-renderer .table-grid {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-direction: column;
-            flex-direction: column;
-    border-spacing: 0;
-    gap: 0.75rem;
-  }
-  .e-form-renderer .form-table-renderer .row {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-wrap: wrap;
-        flex-wrap: wrap;
-    gap: 0.75rem;
-    width: 100%;
-  }
-  .e-form-renderer .form-table-renderer .e-form-table-cell {
-    display: block;
-    -webkit-box-flex: 1;
-        -ms-flex: 1 1 auto;
-            flex: 1 1 auto;
-    padding: 12px;
-  }
-  /* Override column width classes on mobile - let content flow naturally */
-  .e-form-renderer .form-table-renderer .col,
-  .e-form-renderer .form-table-renderer [class^=col-] {
-    /* stylelint-disable-next-line declaration-no-important */
-    width: auto !important;
-    min-width: 250px;
-    -webkit-box-flex: 1;
-        -ms-flex: 1 1 auto;
-            flex: 1 1 auto;
-  }
-  .e-form-renderer .table-border .e-form-table-cell {
-    border-right: none;
-    border-radius: 4px;
-  }
-  .e-form-renderer .form-table-renderer .row:last-child .e-form-table-cell {
-    border-bottom: none;
-  }
-}
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 480px) {
-  .e-form-renderer .form-table-renderer .e-form-table-row {
-    /* stylelint-disable-next-line declaration-no-important */
-    -webkit-box-orient: vertical !important;
-    -webkit-box-direction: normal !important;
-        -ms-flex-direction: column !important;
-            flex-direction: column !important;
-    /* stylelint-disable-next-line declaration-no-important */
-    gap: 1rem !important;
-  }
-  .e-form-renderer .form-table-renderer .e-form-table-cell {
-    /* stylelint-disable-next-line declaration-no-important */
-    width: 100% !important;
-  }
-  .form-renderer-container {
-    padding: 1rem;
-  }
-}
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 400px) {
-  .e-form-renderer .field-wrapper.label-left,
-  .e-form-renderer .field-wrapper.label-right {
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-direction: column;
-            flex-direction: column;
-    -webkit-box-align: stretch;
-        -ms-flex-align: stretch;
-            align-items: stretch;
-  }
-  .e-form-renderer .field-wrapper.label-left .field-input,
-  .e-form-renderer .field-wrapper.label-right .field-input {
-    width: 100%;
-  }
-}
-.form-renderer-container hr {
-  background-color: var(--color-sf-border-light);
-}
-
-.e-form-renderer .field-label {
-  color: var(--color-sf-content-text-color);
-  font-family: var(--e-font-family);
-}
-
-.e-form-renderer .form-panel-renderer .panel-legend {
-  color: var(--color-sf-content-text-color);
-  font-family: var(--e-font-family);
-}
-
-.e-form-renderer .field-label .required-asterisk {
-  color: var(--color-sf-danger);
-}
-
-.e-form-renderer .field-label .tooltip-icon {
-  color: var(--color-sf-icon-color);
-}
-
-.e-form-renderer .field-error {
-  color: var(--color-sf-danger);
-}
-
-.e-form-renderer .form-panel-renderer:has(.panel-legend) {
-  border: 1px solid var(--color-sf-border-light);
-  font-family: var(--e-font-family);
-}
-
-.e-form-renderer .form-table-renderer.table-border {
-  border: 1px solid var(--color-sf-border-light);
-}
-
-.e-form-renderer .table-border .e-form-table-cell {
-  border-bottom: 1px solid var(--color-sf-border-light);
-  border-right: 1px solid var(--color-sf-border-light);
-}
-
-/* stylelint-disable-next-line at-rule-no-unknown */
-@container (max-width: 480px) {
-  .e-form-renderer .table-border .e-form-table-cell {
-    border-bottom: 1px solid var(--color-sf-border-light);
-  }
-  .e-form-renderer .form-table-renderer .e-form-table-cell:last-child {
-    border-bottom: 1px solid var(--color-sf-border-light);
-  }
-}

package/styles/form-renderer/fluent2.scss

@@ -1,2 +0,0 @@
-@use 'fluent2-definition' as *;
-@use 'all' as *;