keppler 2.1.17 → 2.1.18

data/testing-with-2.1.18/app/assets/stylesheets/admin/pages/_listing.scss

@@ -0,0 +1,40 @@
+.objects-container {
+  .icon-delete {
+    color: $keppler-color;
+    font-size: 14px;
+  }
+
+  .material-icons {
+    color: $grey;
+  }
+
+  .show-row {
+    img {
+      border-radius: 2px;
+      cursor: zoom-in;
+      height: 25px;
+      object-fit: cover;
+      width: 25px;
+    }
+
+    a {
+      display: block;
+      height: 20px;
+      position: absolute;
+      width: 20%;
+    }
+  }
+
+  .ui-sortable-handle {
+    width: 50px;
+  }
+
+  .ui-sortable-helper {
+    background-color: $almost-white;
+    display: table;
+  }
+
+  .open {
+    position: relative;
+  }
+}

data/testing-with-2.1.18/app/assets/stylesheets/admin/pages/_preloader.scss

@@ -0,0 +1,224 @@
+.spinner {
+  // background-color: #000000bd;
+  bottom: 0;
+  display: none;
+  left: 0;
+  position: fixed;
+  right: 0;
+  top: 0;
+  z-index: 999999;
+}
+
+.loader-message {
+  text-align: center;
+
+  p {
+    font-size: 1.2rem;
+  }
+}
+
+.preloader {
+  animation: moveback 20s infinite linear;
+  background: $white;
+  display: table;
+  height: 100vh;
+  transition: .3s ease-in-out;
+  width: 100%;
+
+  .container {
+    display: table-cell;
+    vertical-align: middle;
+
+    .loader {
+      border-radius: 50%;
+      height: 200px;
+      margin: 20px auto;
+      perspective: 780px;
+      position: relative;
+      width: 200px;
+    }
+
+    .keppler-k {
+      animation: opacity 2s infinite;
+      color: $keppler-color;
+      font-family: "Patua One", cursive;
+      font-size: 6rem;
+      padding: 6rem 0;
+      text-align: center;
+    }
+  }
+
+  .loader-inner {
+    border-radius: 50%;
+    box-sizing: border-box;
+    height: 100%;
+    position: absolute;
+    width: 100%;
+
+    &.box1 {
+      animation: cssload-rotate-one 1.15s linear infinite;
+      border-bottom: 3px solid $medium-grey;
+      left: 0%;
+      top: 0%;
+    }
+
+    &.box2 {
+      animation: cssload-rotate-two 1.15s linear infinite;
+      border-right: 3px solid $coco-grey;
+      right: 0%;
+      top: 0%;
+    }
+
+    &.box3 {
+      animation: cssload-rotate-three 1.15s linear infinite;
+      border-top: 3px solid $dark-white;
+      bottom: 0%;
+      right: 0%;
+    }
+  }
+}
+
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  50% {
+    transform: rotate(20deg);
+  }
+
+  100% {
+    transform: rotate(0deg);
+  }
+}
+
+@keyframes moveback {
+  0% {
+    background-position: center center;
+  }
+
+  50% {
+    background-position: center 100%;
+  }
+
+  100% {
+    background-position: center center;
+  }
+}
+
+@keyframes opacity {
+  0% {
+    opacity: .5;
+  }
+
+  50% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: .5;
+  }
+}
+
+@keyframes cssload-rotate-one {
+  0% {
+    -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
+    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
+  }
+
+  100% {
+    -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
+    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
+  }
+}
+
+@keyframes cssload-rotate-two {
+  0% {
+    -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
+    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
+  }
+
+  100% {
+    -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
+    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
+  }
+}
+
+@keyframes cssload-rotate-three {
+  0% {
+    -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
+    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
+  }
+
+  100% {
+    -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
+    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
+  }
+}
+
+.spinner2 {
+  display: none;
+  position: absolute;
+  top: 42%;
+  transition: .1s;
+  width: 100%;
+
+  .spinner {
+    animation: rotator 1.4s linear infinite;
+  }
+
+  @keyframes rotator {
+    0% {
+      transform: rotate(0deg);
+    }
+
+    100% {
+      transform: rotate(270deg);
+    }
+  }
+
+  .path {
+    animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
+    stroke-dasharray: 187;
+    stroke-dashoffset: 0;
+    transform-origin: center;
+  }
+
+  @keyframes colors {
+    0% {
+      stroke: $keppler-color;
+    }
+
+    25% {
+      stroke: $keppler-color;
+    }
+
+    50% {
+      stroke: $keppler-color;
+    }
+
+    75% {
+      stroke: $keppler-color;
+    }
+
+    100% {
+      stroke: $keppler-color;
+    }
+  }
+
+  @keyframes dash {
+    0% {
+      stroke-dashoffset: 187;
+    }
+
+    50% {
+      stroke-dashoffset: 46.75;
+      transform: rotate(135deg);
+    }
+
+    100% {
+      stroke-dashoffset: 187;
+      transform: rotate(450deg);
+    }
+  }
+}

data/testing-with-2.1.18/app/assets/stylesheets/admin/pages/_rockets.scss

@@ -0,0 +1,13 @@
+.create-rocket {
+  background: $keppler-color;
+  border-radius: 15px;
+  color: $white;
+  padding: 5px 10px;
+  transition: .3s ease-in-out;
+
+  &:hover {
+    color: $white;
+    filter: brightness(110%);
+    transition: .3s ease-in-out;
+  }
+}

data/testing-with-2.1.18/app/assets/stylesheets/admin/pages/_roles.scss

@@ -0,0 +1,3 @@
+.table-data {
+  padding: 5px 8px;
+}

data/testing-with-2.1.18/app/assets/stylesheets/admin/pages/_search.scss

@@ -0,0 +1,244 @@
+.search {
+  // animation: .5s ease-out 1s grow_width forwards;
+  float: left;
+  margin: 8px 0;
+  max-width: 0;
+  transition: .3s ease-in-out;
+  width: 50%;
+
+  @include respond-to(xs) {
+    animation: none;
+  }
+
+  @include respond-to(sm) {
+    animation: none;
+  }
+
+  .search-bar {
+    // animation: .5s cubic-bezier(0.4, 0, 0.2, 1) 1s change_input forwards;
+    border: 0;
+    border-radius: 0;
+    // border-radius: 15px 0 0 15px;
+    padding: 0;
+    transition: .3s ease-in-out;
+
+    @include respond-to(xs) {
+      animation: none;
+    }
+
+    @include respond-to(sm) {
+      animation: none;
+    }
+
+    &:focus {
+      border-color: $keppler-color;
+      transition: .3s ease-in-out;
+    }
+  }
+
+  .search-button {
+    // animation: .3s ease-in-out .5s change_button forwards;
+    background-color: transparent;
+    transition: .3s ease-in-out;
+
+    @include respond-to(xs) {
+      animation: none;
+      border-radius: 1px;
+    }
+
+    @include respond-to(sm) {
+      animation: none;
+      border-radius: 1px;
+    }
+
+    &:active {
+      box-shadow: none;
+      outline: none;
+    }
+
+    .search-icon {
+      // animation: .3s ease-in-out .5s change_color forwards;
+      color: $grey;
+      transition: .3s ease-in-out;
+
+      @include respond-to(xs) {
+        animation: none;
+      }
+
+      @include respond-to(sm) {
+        animation: none;
+      }
+    }
+  }
+
+  &.display-search {
+    animation: .5s ease-in-out .5s grow_width forwards;
+
+    .search-bar {
+      animation: .5s cubic-bezier(.4, 0, .2, 1) .5s change_input forwards;
+      // border-radius: 15px 0 0 15px;
+    }
+
+    .search-button {
+      animation: .3s ease-in-out change_button forwards;
+    }
+
+    .search-icon {
+      animation: .3s ease-in-out change_color forwards;
+    }
+  }
+
+  &.hidding-search {
+    animation: .3s ease-out .5s width_down forwards;
+    max-width: 300px;
+
+    .search-bar {
+      animation: .5s cubic-bezier(.4, 0, .2, 1) .5s hide_input forwards;
+      padding: 6px 12px;
+    }
+
+    .search-button {
+      animation: .3s ease-in-out hide_button forwards;
+    }
+
+    .search-icon {
+      animation: .3s ease-in-out hide_color forwards;
+    }
+  }
+}
+
+.hide-search {
+  // border-radius: 50%;
+  color: $grey;
+  cursor: pointer;
+  display: inline-table;
+  height: 34px;
+  margin: 8px 0;
+  opacity: 0;
+  padding: 5px 0;
+  transition: .3s ease-in-out;
+  width: 34px;
+
+  &:hover {
+    background: $dark-white;
+    border-radius: 50%;
+    transition: .3s ease-in-out;
+  }
+
+  i {
+    display: table-cell;
+    padding: 0;
+    text-align: center;
+    vertical-align: middle;
+  }
+
+  &.appear {
+    opacity: 1;
+    transition: .3s .5s ease-in-out;
+  }
+}
+
+.navbar-custom-menu {
+  transition: .2s .5s ease-in-out;
+
+  &.translate {
+    transform: translateX(100%);
+    transition: .2s .5s ease-in-out;
+  }
+}
+
+@keyframes change_input {
+  from {
+    border: 0;
+    padding: 6px 0;
+  }
+
+  to {
+    border-bottom: solid .5px $gray-hover;
+    padding: 6px 12px;
+  }
+}
+
+@keyframes grow_width {
+  from {
+    margin: 8px 0;
+    max-width: 0;
+  }
+
+  to {
+    margin: 8px 10px;
+    max-width: 300px;
+  }
+}
+
+@keyframes change_button {
+  from {
+    // background-color: transparent;
+    // border-radius: 0 15px 15px 0;
+    padding: 6px 9px;
+  }
+
+  to {
+    // background-color: $keppler-color;
+    // border-radius: 0 15px 15px 0;
+    // padding: 6px 12px;
+  }
+}
+
+@keyframes change_color {
+  from {
+    color: $grey;
+  }
+
+  to {
+    color: $keppler-color;
+  }
+}
+
+@keyframes hide_input {
+  from {
+    border-bottom: solid .5px $gray-hover;
+    padding: 6px 9px;
+  }
+
+  to {
+    border: 0;
+    padding: 6px 0;
+  }
+}
+
+@keyframes width_down {
+  from {
+    margin: 8px 10px;
+    max-width: 300px;
+  }
+
+  to {
+    margin: 8px 0;
+    max-width: 0;
+  }
+}
+
+// @keyframes hide_button {
+//   from {
+//     background-color: $keppler-color;
+//     border-radius: 1px;
+//     padding: 6px 12px;
+//   }
+
+//   to {
+//     background-color: transparent;
+//     border-radius: 50%;
+//     padding: 6px 9px;
+//   }
+// }
+
+@keyframes hide_color {
+  from {
+    color: $white;
+  }
+
+  to {
+    color: $grey;
+  }
+}