spree_backend 4.2.4 → 4.3.0.rc3

data/app/assets/stylesheets/spree/backend/plugins/_sweetalert2_custom.scss

@@ -0,0 +1,100 @@
+// Custom SCSS Standard SweetAlerts
+body.swal2-shown {
+  .swal2-popup {
+    border-radius:$border-radius;
+  }
+  .swal2-html-container {
+    text-align: left;
+    font-size: 0.9em;
+
+    .alert-link {
+      font-weight: 400;
+    }
+  }
+    .swal2-content {
+      padding: 0 !important;
+    }
+  .swal2-header {
+    .swal2-icon {
+      width: 2.5em;
+      height: 2.5em;
+
+      .swal2-icon-content {
+        font-size: 2.15em;
+      }
+    }
+
+    .swal2-close {
+      top: 3px;
+      right: 3px;
+      padding-bottom: 3px;
+
+      &:hover {
+        color:grey;
+      }
+    }
+  }
+}
+
+// Custom SCSS Toast SweetAlerts
+body.swal2-toast-shown .swal2-container.swal2-bottom {
+  right: -50% !important;
+  max-width: 500px;
+
+  .swal2-popup.swal2-toast {
+    border-width: 3px;
+    border-style: solid;
+    box-shadow: none !important;
+    margin-bottom: 50px;
+
+    .swal2-icon {
+      display: none !important;
+    }
+
+    button.swal2-close {
+        min-width: .8em;
+        padding-bottom: 0.1em;
+        &:hover {
+        opacity: 0.75;
+      }
+    }
+  }
+}
+
+@include media-breakpoint-down(sm) {
+  body.swal2-toast-shown .swal2-container.swal2-bottom {
+    .swal2-popup.swal2-toast {
+      button.swal2-close {
+        padding-bottom: 0;
+      }
+    }
+  }
+}
+
+.swal2-popup.swal2-toast.swal2-icon-success {
+  @extend .alert-success;
+  h2, button {
+    @extend .alert-success;
+  }
+}
+
+.swal2-popup.swal2-toast.swal2-icon-error {
+  @extend .alert-danger;
+  h2, button {
+    @extend .alert-danger;
+  }
+}
+
+.swal2-popup.swal2-toast.swal2-icon-info {
+  @extend .alert-info;
+  h2, button {
+    @extend .alert-info;
+  }
+}
+
+.swal2-popup.swal2-toast.swal2-icon-question {
+  @extend .alert-warning;
+  h2, button {
+    @extend .alert-warning;
+  }
+}

data/app/assets/stylesheets/spree/backend/plugins/_tinymce_custom.scss

@@ -0,0 +1,4 @@
+// Removes Tiny MCE branding
+.tox-statusbar__branding {
+  display: none;
+}

data/app/assets/stylesheets/spree/backend/shared/_base.scss

@@ -15,14 +15,65 @@
   z-index: $zindex-dropdown;
 }
 
-// No-margin and no-padding helper classes
-@each $side in top bottom left right {
-  .no-margin-#{$side}  { margin-#{side}: 0; }
-  .no-padding-#{$side} { padding-#{side}: 0; }
+figure.admin-img-holder {
+  max-width: 275px;
+  border: 2px dashed grey;
+  border-radius: $border-radius;
+  overflow: hidden;
+  display: inline-block;
+
+  img {
+    max-width: 100%;
+    height: auto;
+  }
 }
 
-.alert-error {
-  @extend .alert-danger;
+div.admin-product-image-container {
+  border: 1px solid $gray-500;
+  background-color: #fefefe;
+  border-radius: $border-radius;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  margin: auto;
+
+  img {
+    max-width: 100%;
+    height: auto;
+    align-self: center;
+    transform: scale(1.6);
+  }
+
+  svg {
+    color: $gray-600;
+    align-self: center;
+  }
+
+  &.mini-img {
+    border-radius: $border-radius / 2;
+    width: 24px;
+    height: 24px;
+  }
+
+  &.small-img {
+    border-radius: $border-radius;
+    width: 50px;
+    height: 50px;
+  }
+
+  &.product-img {
+    border-width: 2px;
+    border-radius: $border-radius * 2;
+    width: 100px;
+    height: 100px;
+  }
+
+  &.large-img {
+    border-width: 3px;
+    border-radius: $border-radius * 3;
+    width: 300px;
+    height: 300px;
+  }
 }
 
 .js-remove-promo-rule-option-value {
@@ -32,30 +83,29 @@
   }
 }
 
-.flash-alert {
-  z-index: 0;
-  opacity: 0;
-  bottom: -50px;
-  left:0;
-  right:0;
+.button_to {
+  display: inline-block;
+}
+
+.move-handle {
+  cursor: grab;
+}
 
-  .alert {
-    z-index: 500;
-    opacity: 0.98;
-    border-width: 3px;
-    margin-bottom: 0;
-  }
+.badge-light-muted-text {
+  color: rgba(0, 0, 0, 0.50);
 }
 
-.flash-alert.animate__animated {
-  opacity: 1;
-  bottom: 30px;
+.truncate {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
-.resize-animation-stopper * {
-  transition: none !important;
+[data-show-info] {
+  color:  $primary;
+  cursor: pointer;
 }
 
-.button_to {
-  display: inline-block;
+#contentHeaderRow {
+  min-height: 51px;
 }

data/app/assets/stylesheets/spree/backend/shared/_forms.scss

@@ -37,6 +37,14 @@ input[type=number].hide-number-toggle {
   -moz-appearance: textfield;
 }
 
+input[type="file"] {
+  width: fit-content;
+  max-width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 
 // Remove the default 5px outlines and box-shadows
 // from all inputs on focus.

data/app/assets/stylesheets/spree/backend/spree_admin.css.scss

@@ -19,14 +19,19 @@
 @import 'components/progress';
 @import 'components/spinner';
 
+@import 'plugins/sweetalert2_custom';
 @import 'plugins/jquery_ui';
 @import 'plugins/flatpickr';
 @import 'plugins/select2_bootstrap4';
 @import 'plugins/select2_custom';
+@import 'plugins/tinymce_custom';
+@import 'plugins/nav_x';
 
 @import 'shared/base';
 @import 'shared/forms';
 
+@import 'views/menus';
+@import 'views/cms_pages';
 @import 'views/order_payments';
 @import 'views/product_properties';
 @import 'views/prototypes';

data/app/assets/stylesheets/spree/backend/views/_cms_pages.scss

@@ -0,0 +1,148 @@
+#ImageGalleryLayout {
+  #LayoutType {
+    color: rgb(134, 134, 134);
+  }
+
+  .select2-container--bootstrap4 {
+    max-width: 200px;
+    margin: auto;
+  }
+}
+
+#standardPage {
+  .sp-pb-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .sp-card {
+    border-bottom: 0;
+    border-radius: 5px 5px 0 0;
+  }
+}
+
+[aria-expanded="false"] {
+  span.more {
+    display: inline;
+  }
+  span.less {
+    display: none;
+  }
+}
+
+[aria-expanded="true"] {
+  span.more {
+    display: none;
+  }
+  span.less {
+    display: inline;
+  }
+}
+
+button#cmsSectionEditorFullScreen {
+  span.exit {
+    display: none;
+  }
+
+  &.active {
+    span.exit {
+      display: inline;
+    }
+  }
+}
+
+#liveViewCont {
+  height: 100%;
+
+  .embed-responsive {
+    height: 100%;
+  }
+}
+
+#draggableSectionsHolder {
+  max-height: 750px;
+}
+
+#cmsPagesectionsArea {
+  overflow-x: hidden;
+  overflow-y: scroll;
+  max-height: 100%;
+
+  .border {
+    border-color: #9c9c9c !important;
+  }
+
+  // Hide scroll-bar in live preview
+  // sidebar.
+  -ms-overflow-style: none;  /* IE and Edge */
+  scrollbar-width: none;  /* Firefox */
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
+
+@include media-breakpoint-up(md) {
+  body[data-sections-editor-full-screen] {
+    .hide-on-full-screen-mode {
+      display: none;
+    }
+
+    #pageSectionsArea {
+      position: fixed;
+      top: 0;
+      left: 0;
+      z-index: 9999;
+      background: white;
+      padding: 15px 15px 0 15px;
+      height: 100vh;
+
+      #cmsPagesectionsArea {
+        max-height: 90vh;
+      }
+
+      .embed-responsive-4by3 {
+        height: 90vh;
+      }
+    }
+
+    #draggableSectionsHolder {
+      max-width: 350px;
+    }
+   }
+}
+
+#pageLivePreview {
+  transform-origin: top left;
+  background: rgb(62, 62, 62);
+}
+
+.desktopLiveView {
+  #pageLivePreview {
+    width: 200.5%;
+    height:200.5%;
+    inset: 50%;
+    transform: scale(0.5) translate(-50%, -50%);
+    max-width: 2600px;
+  }
+}
+
+.tabletLiveView {
+  #pageLivePreview {
+    width: 85%;
+    height: 133.5%;
+    inset: 50%;
+    transform: scale(0.75) translate(-50%, -50%);
+    max-width: 991px;
+    min-width: 768px;
+  }
+}
+
+.mobileLiveView {
+    #pageLivePreview {
+    width: 60%;
+    height: 133.5%;
+    inset: 50%;
+    transform: scale(0.75) translate(-50%, -50%);
+    max-width: 767px;
+    min-width: 375px;
+  }
+}

data/app/assets/stylesheets/spree/backend/views/_menus.scss

@@ -0,0 +1,61 @@
+#menuItemImgContainer {
+  width: 200px;
+  img {
+    max-width: 100%;
+  }
+}
+
+#menuArea {
+  .space-buttons {
+    box-shadow: -11px 0 16px 6px white;
+    z-index: 9;
+    a {
+      margin: 2px;
+    }
+  }
+  .container-item-row {
+    overflow: hidden;
+    border: 1px solid $border-color;
+    margin: 2px;
+    background-color: white;
+  }
+
+  .menu-container-item {
+    border: solid 1px transparent;
+    padding: 0;
+    background-color: var(--light);
+
+    .menu-container {
+      margin-left: 25px;
+      background-color: var(--light);
+    }
+
+    @include media-breakpoint-up(sm) {
+      .menu-container {
+        margin-left: 50px;
+      }
+    }
+  }
+
+  .sortable-chosen {
+    border: 1px dashed var(--gray);
+    border-radius: 5px;
+  }
+
+  .menu_items_image_holder {
+    position: relative;
+    border: 1px solid $border-color;
+    border-radius: 7px;
+    overflow: hidden;
+    width: 45px;
+    height: 45px;
+    img {
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      height: 100%;
+      width: auto;
+      transform: translate(-50%,-50%);
+    }
+  }
+}