@colijnit/inphoto 300.1.8 → 301.1.0

package/lib/component/image-enhancer/style/_layout.scss

@@ -1,37 +1,37 @@
-@use '../../../style' as cfg;
-
-@include cfg.export-module('co-image-enhancer-layout') {
-  .co-image-enhancer {
-    .enhancer-container {
-      height: var(--co-inphoto-image-enhancer-container-height);
-      position: var(--co-inphoto-image-enhancer-position-relative);
-      display: flex;
-      flex-direction: column;
-
-
-      .enhancer-scroll-container {
-        flex: 1 1 auto;
-        min-height: 0;
-        overflow-y: auto;
-        scroll-behavior: smooth;
-        scrollbar-width: none;
-        -ms-overflow-style: none;
-        padding-bottom: var(--co-inphoto-image-enhancer-scroll-padding-bottom);
-        &::-webkit-scrollbar {
-          display: none;
-        }
-
-        .enhancer-body {
-
-          .tabs {
-            align-items: center;
-            display: grid;
-            grid-template-columns: repeat(2, 1fr);
-            height: var(--co-inphoto-image-enhancer-tab-height);
-            align-content: end;
-          }
-        }
-      }
-    }
-  }
-}
+@use '../../../style' as cfg;
+
+@include cfg.export-module('co-image-enhancer-layout') {
+  .co-image-enhancer {
+    .enhancer-container {
+      height: var(--co-inphoto-image-enhancer-container-height);
+      position: var(--co-inphoto-image-enhancer-position-relative);
+      display: flex;
+      flex-direction: column;
+
+
+      .enhancer-scroll-container {
+        flex: 1 1 auto;
+        min-height: 0;
+        overflow-y: auto;
+        scroll-behavior: smooth;
+        scrollbar-width: none;
+        -ms-overflow-style: none;
+        padding-bottom: var(--co-inphoto-image-enhancer-scroll-padding-bottom);
+        &::-webkit-scrollbar {
+          display: none;
+        }
+
+        .enhancer-body {
+
+          .tabs {
+            align-items: center;
+            display: grid;
+            grid-template-columns: repeat(2, 1fr);
+            height: var(--co-inphoto-image-enhancer-tab-height);
+            align-content: end;
+          }
+        }
+      }
+    }
+  }
+}

package/lib/component/image-enhancer/style/_material-definition.scss

@@ -1,13 +1,13 @@
-.co-image-enhancer {
-  --co-inphoto-image-enhancer-font-size-text: var(--co-inphoto-font-size-text);
-  --co-inphoto-image-enhancer-font-family: var(--co-inphoto-font-family);
-  --co-inphoto-image-enhancer-tab-height: 60px;
-  --co-inphoto-image-enhancer-tab-button-padding: 10px;
-  --co-inphoto-image-enhancer-tab-button-border-width: 2px;
-  --co-inphoto-image-enhancer-container-height: 100vh;
-  --co-inphoto-image-enhancer-position-relative: relative;
-  --co-inphoto-image-enhancer-scroll-padding-bottom: 30px;
-  --co-inphoto-image-enhancer-container-padding: 35px 25px;
-  --co-inphoto-image-enhancer-tab-button-radius: 0;
-  --co-inphoto-image-enhancer-tab-button-height: 100%;
-}
+.co-image-enhancer {
+  --co-inphoto-image-enhancer-font-size-text: var(--co-inphoto-font-size-text);
+  --co-inphoto-image-enhancer-font-family: var(--co-inphoto-font-family);
+  --co-inphoto-image-enhancer-tab-height: 60px;
+  --co-inphoto-image-enhancer-tab-button-padding: 10px;
+  --co-inphoto-image-enhancer-tab-button-border-width: 2px;
+  --co-inphoto-image-enhancer-container-height: 100vh;
+  --co-inphoto-image-enhancer-position-relative: relative;
+  --co-inphoto-image-enhancer-scroll-padding-bottom: 30px;
+  --co-inphoto-image-enhancer-container-padding: 35px 25px;
+  --co-inphoto-image-enhancer-tab-button-radius: 0;
+  --co-inphoto-image-enhancer-tab-button-height: 100%;
+}

package/lib/component/image-enhancer/style/_theme.scss

@@ -1,45 +1,45 @@
-@use '../../../style' as cfg;
-
-@include cfg.export-module('co-image-enhancer-theme') {
-  .co-image-enhancer {
-    font-family: var(--co-inphoto-image-enhancer-font-family);
-    font-size: var(--co-inphoto-image-enhancer-font-size-text);
-
-    .enhancer-container {
-
-      background: var(--co-inphoto-dialog-background-color);
-      padding: var(--co-inphoto-image-enhancer-container-padding);
-
-      .enhancer-scroll-container {
-
-        .enhancer-body {
-          .instruction-dialog {
-            font-size: var(--co-inphoto-font-size-label);
-          }
-
-          .tabs {
-
-            .tab-button {
-              padding: var(--co-inphoto-image-enhancer-tab-button-padding);
-              cursor: pointer;
-              height: var(--co-inphoto-image-enhancer-tab-button-height);
-              text-align: center;
-              background: none;
-              border-radius: var(--co-inphoto-image-enhancer-tab-button-radius);
-              @include cfg.sub-header-text();
-              border-bottom: var(--co-inphoto-image-enhancer-tab-button-border-width) solid transparent;
-
-              &:hover {
-                border-bottom-color: var(--co-inphoto-accent-color);
-              }
-
-              &.active {
-                border-bottom-color: var(--co-inphoto-accent-color);
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
+@use '../../../style' as cfg;
+
+@include cfg.export-module('co-image-enhancer-theme') {
+  .co-image-enhancer {
+    font-family: var(--co-inphoto-image-enhancer-font-family);
+    font-size: var(--co-inphoto-image-enhancer-font-size-text);
+
+    .enhancer-container {
+
+      background: var(--co-inphoto-dialog-background-color);
+      padding: var(--co-inphoto-image-enhancer-container-padding);
+
+      .enhancer-scroll-container {
+
+        .enhancer-body {
+          .instruction-dialog {
+            font-size: var(--co-inphoto-font-size-label);
+          }
+
+          .tabs {
+
+            .tab-button {
+              padding: var(--co-inphoto-image-enhancer-tab-button-padding);
+              cursor: pointer;
+              height: var(--co-inphoto-image-enhancer-tab-button-height);
+              text-align: center;
+              background: none;
+              border-radius: var(--co-inphoto-image-enhancer-tab-button-radius);
+              @include cfg.sub-header-text();
+              border-bottom: var(--co-inphoto-image-enhancer-tab-button-border-width) solid transparent;
+
+              &:hover {
+                border-bottom-color: var(--co-inphoto-accent-color);
+              }
+
+              &.active {
+                border-bottom-color: var(--co-inphoto-accent-color);
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/lib/component/image-enhancer-style/style/_layout.scss

@@ -1,65 +1,65 @@
-@use '../../../style' as cfg;
-
-@include cfg.export-module('co-image-enhancer-style-layout') {
-  .co-image-enhancer-style {
-    .form-part-container {
-      margin: var(--co-inphoto-image-enhancer-style-form-margin);
-
-      .co-list-of-values {
-        height: var(--co-inphoto-image-enhancer-style-field-height);
-        overflow: hidden;
-
-        .co-input-text {
-          .input-text-clear-button {
-            display: none;
-          }
-
-          &:not(.no-style) {
-            input {
-              padding-bottom: var(--co-inphoto-image-enhancer-style-field-padding-bottom);
-            }
-
-            &:not(.custom-height) {
-              height: var(--co-inphoto-image-enhancer-style-field-height);
-            }
-
-            &.has-own-label {
-              &.hasvalue {
-                label {
-                  transform: var(--co-inphoto-image-enhancer-style-label-transform-none);
-                  top: var(--co-inphoto-image-enhancer-style-label-top);
-                }
-              }
-            }
-
-            &.has-right-icon {
-              .input-text-right-icon {
-                svg {
-                  width: var(--co-inphoto-image-enhancer-style-right-icon-size);
-                  height: var(--co-inphoto-image-enhancer-style-right-icon-size);
-                }
-              }
-            }
-
-            .input-text-left-icon,
-            .input-text-right-icon {
-              max-height: var(--co-inphoto-image-enhancer-style-field-height);
-            }
-          }
-        }
-      }
-    }
-
-
-    .tool-explainer {
-      .header-with-icon {
-        display: flex;
-        align-items: center;
-      }
-    }
-
-    .button-container {
-      margin-top: var(--co-inphoto-image-enhancer-style-button-container-margin-top);
-    }
-  }
-}
+@use '../../../style' as cfg;
+
+@include cfg.export-module('co-image-enhancer-style-layout') {
+  .co-image-enhancer-style {
+    .form-part-container {
+      margin: var(--co-inphoto-image-enhancer-style-form-margin);
+
+      .co-list-of-values {
+        height: var(--co-inphoto-image-enhancer-style-field-height);
+        overflow: hidden;
+
+        .co-input-text {
+          .input-text-clear-button {
+            display: none;
+          }
+
+          &:not(.no-style) {
+            input {
+              padding-bottom: var(--co-inphoto-image-enhancer-style-field-padding-bottom);
+            }
+
+            &:not(.custom-height) {
+              height: var(--co-inphoto-image-enhancer-style-field-height);
+            }
+
+            &.has-own-label {
+              &.hasvalue {
+                label {
+                  transform: var(--co-inphoto-image-enhancer-style-label-transform-none);
+                  top: var(--co-inphoto-image-enhancer-style-label-top);
+                }
+              }
+            }
+
+            &.has-right-icon {
+              .input-text-right-icon {
+                svg {
+                  width: var(--co-inphoto-image-enhancer-style-right-icon-size);
+                  height: var(--co-inphoto-image-enhancer-style-right-icon-size);
+                }
+              }
+            }
+
+            .input-text-left-icon,
+            .input-text-right-icon {
+              max-height: var(--co-inphoto-image-enhancer-style-field-height);
+            }
+          }
+        }
+      }
+    }
+
+
+    .tool-explainer {
+      .header-with-icon {
+        display: flex;
+        align-items: center;
+      }
+    }
+
+    .button-container {
+      margin-top: var(--co-inphoto-image-enhancer-style-button-container-margin-top);
+    }
+  }
+}

package/lib/component/image-enhancer-style/style/_material-definition.scss

@@ -1,16 +1,16 @@
-.co-image-enhancer-style {
-  --co-inphoto-image-enhancer-style-font-size-text: var(--co-inphoto-font-size-text);
-  --co-inphoto-image-enhancer-style-font-family: var(--co-inphoto-font-family);
-  --co-inphoto-image-enhancer-style-padding: 15px;
-  --co-inphoto-image-enhancer-style-form-margin: 20px auto;
-  --co-inphoto-image-enhancer-style-field-height: 60px;
-  --co-inphoto-image-enhancer-style-field-padding-bottom: 10px;
-  --co-inphoto-image-enhancer-style-label-transform-none: none;
-  --co-inphoto-image-enhancer-style-label-top: 10px;
-  --co-inphoto-image-enhancer-style-right-icon-size: 15px;
-  --co-inphoto-image-enhancer-style-header-icon-margin: 15px;
-  --co-inphoto-image-enhancer-style-button-container-margin-top: 20px;
-  --co-inphoto-image-enhancer-style-generate-button-margin-bottom: 30px;
-  --co-inphoto-image-enhancer-style-button-label-margin-left: 15px;
-  --co-inphoto-image-enhancer-style-button-label-font-weight: bold;
-}
+.co-image-enhancer-style {
+  --co-inphoto-image-enhancer-style-font-size-text: var(--co-inphoto-font-size-text);
+  --co-inphoto-image-enhancer-style-font-family: var(--co-inphoto-font-family);
+  --co-inphoto-image-enhancer-style-padding: 15px;
+  --co-inphoto-image-enhancer-style-form-margin: 20px auto;
+  --co-inphoto-image-enhancer-style-field-height: 60px;
+  --co-inphoto-image-enhancer-style-field-padding-bottom: 10px;
+  --co-inphoto-image-enhancer-style-label-transform-none: none;
+  --co-inphoto-image-enhancer-style-label-top: 10px;
+  --co-inphoto-image-enhancer-style-right-icon-size: 15px;
+  --co-inphoto-image-enhancer-style-header-icon-margin: 15px;
+  --co-inphoto-image-enhancer-style-button-container-margin-top: 20px;
+  --co-inphoto-image-enhancer-style-generate-button-margin-bottom: 30px;
+  --co-inphoto-image-enhancer-style-button-label-margin-left: 15px;
+  --co-inphoto-image-enhancer-style-button-label-font-weight: bold;
+}

package/lib/component/image-enhancer-style/style/_theme.scss

@@ -1,120 +1,120 @@
-@use '../../../style' as cfg;
-
-@include cfg.export-module('co-image-enhancer-style-theme') {
-  .co-image-enhancer-style {
-    font-family: var(--co-inphoto-image-enhancer-style-font-family);
-    font-size: var(--co-inphoto-image-enhancer-style-font-size-text);
-
-    .form-part-container {
-      .co-list-of-values {
-        border-radius: var(--co-inphoto-border-radius);
-
-        &:before, &:hover {
-          box-shadow: none;
-          border: none;
-        }
-
-        &:not(.read-only):hover {
-          border: none;
-
-          &:before {
-            box-shadow: none;
-          }
-        }
-
-        &.cc-input-focused:not(.no-focus-line) {
-          border: none;
-
-          &:before {
-            box-shadow: none;
-          }
-        }
-
-        .co-input-text {
-          &:before {
-            box-shadow: none;
-          }
-
-          &:hover, &:not(.read-only):hover {
-            &:before {
-              box-shadow: none;
-            }
-          }
-
-          &:not(.no-style) {
-            &:not(.custom-height) {
-              border-radius: var(--co-inphoto-border-radius);
-            }
-          }
-
-          .input-text-wrapper {
-            .input-wrapper {
-              border-radius: var(--co-inphoto-border-radius);
-            }
-          }
-        }
-      }
-    }
-
-    .tool-explainer, .explainer-text {
-      background: var(--co-inphoto-background-white);
-      border-radius: var(--co-inphoto-border-radius);
-      padding: var(--co-inphoto-image-enhancer-style-padding);
-
-      .header-with-icon {
-        @include cfg.default-icon(var(--co-inphoto-icon-size), var(--co-inphoto-icon-size), var(--co-inphoto-icon-color));
-        .co-icon {
-          margin-right: var(--co-inphoto-image-enhancer-style-header-icon-margin);
-        }
-        .tool-explainer-header {
-          @include cfg.sub-header-text();
-        }
-      }
-    }
-
-    .tool-explainer-text {
-      @include cfg.text();
-    }
-
-    .button-container {
-      .generate-button {
-        margin-bottom: var(--co-inphoto-image-enhancer-style-generate-button-margin-bottom);
-        @include cfg.action-button(
-                var(--co-inphoto-active-button-background),
-                var(--co-inphoto-active-button-background),
-                var(--co-inphoto-active-button-color),
-                var(--co-inphoto-button-font-size),
-                var(--co-inphoto-button-icon-size),
-                var(--co-inphoto-active-button-color),
-                var(--co-inphoto-button-border),
-                var(--co-inphoto-button-radius),
-                var(--co-inphoto-button-padding)
-        );
-
-        .label {
-          margin-left: var(--co-inphoto-image-enhancer-style-button-label-margin-left);
-          font-weight: var(--co-inphoto-image-enhancer-style-button-label-font-weight);
-        }
-      }
-
-      .restart-button {
-        @include cfg.action-button(
-                var(--co-inphoto-button-background),
-                var(--co-inphoto-button-background),
-                var(--co-inphoto-button-color),
-                var(--co-inphoto-button-font-size),
-                var(--co-inphoto-button-icon-size),
-                var(--co-inphoto-button-icon-color),
-                var(--co-inphoto-button-border),
-                var(--co-inphoto-button-radius),
-                var(--co-inphoto-button-padding)
-        );
-
-        .label {
-          margin-left: var(--co-inphoto-image-enhancer-style-button-label-margin-left);
-          font-weight: var(--co-inphoto-image-enhancer-style-button-label-font-weight);
-        }
-      }
-    }
-  }
-}
+@use '../../../style' as cfg;
+
+@include cfg.export-module('co-image-enhancer-style-theme') {
+  .co-image-enhancer-style {
+    font-family: var(--co-inphoto-image-enhancer-style-font-family);
+    font-size: var(--co-inphoto-image-enhancer-style-font-size-text);
+
+    .form-part-container {
+      .co-list-of-values {
+        border-radius: var(--co-inphoto-border-radius);
+
+        &:before, &:hover {
+          box-shadow: none;
+          border: none;
+        }
+
+        &:not(.read-only):hover {
+          border: none;
+
+          &:before {
+            box-shadow: none;
+          }
+        }
+
+        &.cc-input-focused:not(.no-focus-line) {
+          border: none;
+
+          &:before {
+            box-shadow: none;
+          }
+        }
+
+        .co-input-text {
+          &:before {
+            box-shadow: none;
+          }
+
+          &:hover, &:not(.read-only):hover {
+            &:before {
+              box-shadow: none;
+            }
+          }
+
+          &:not(.no-style) {
+            &:not(.custom-height) {
+              border-radius: var(--co-inphoto-border-radius);
+            }
+          }
+
+          .input-text-wrapper {
+            .input-wrapper {
+              border-radius: var(--co-inphoto-border-radius);
+            }
+          }
+        }
+      }
+    }
+
+    .tool-explainer, .explainer-text {
+      background: var(--co-inphoto-background-white);
+      border-radius: var(--co-inphoto-border-radius);
+      padding: var(--co-inphoto-image-enhancer-style-padding);
+
+      .header-with-icon {
+        @include cfg.default-icon(var(--co-inphoto-icon-size), var(--co-inphoto-icon-size), var(--co-inphoto-icon-color));
+        .co-icon {
+          margin-right: var(--co-inphoto-image-enhancer-style-header-icon-margin);
+        }
+        .tool-explainer-header {
+          @include cfg.sub-header-text();
+        }
+      }
+    }
+
+    .tool-explainer-text {
+      @include cfg.text();
+    }
+
+    .button-container {
+      .generate-button {
+        margin-bottom: var(--co-inphoto-image-enhancer-style-generate-button-margin-bottom);
+        @include cfg.action-button(
+                var(--co-inphoto-active-button-background),
+                var(--co-inphoto-active-button-background),
+                var(--co-inphoto-active-button-color),
+                var(--co-inphoto-button-font-size),
+                var(--co-inphoto-button-icon-size),
+                var(--co-inphoto-active-button-color),
+                var(--co-inphoto-button-border),
+                var(--co-inphoto-button-radius),
+                var(--co-inphoto-button-padding)
+        );
+
+        .label {
+          margin-left: var(--co-inphoto-image-enhancer-style-button-label-margin-left);
+          font-weight: var(--co-inphoto-image-enhancer-style-button-label-font-weight);
+        }
+      }
+
+      .restart-button {
+        @include cfg.action-button(
+                var(--co-inphoto-button-background),
+                var(--co-inphoto-button-background),
+                var(--co-inphoto-button-color),
+                var(--co-inphoto-button-font-size),
+                var(--co-inphoto-button-icon-size),
+                var(--co-inphoto-button-icon-color),
+                var(--co-inphoto-button-border),
+                var(--co-inphoto-button-radius),
+                var(--co-inphoto-button-padding)
+        );
+
+        .label {
+          margin-left: var(--co-inphoto-image-enhancer-style-button-label-margin-left);
+          font-weight: var(--co-inphoto-image-enhancer-style-button-label-font-weight);
+        }
+      }
+    }
+  }
+}