Initial commit

client/css/cropper.css

@@ -0,0 +1,276 @@
+/*!
+ * Cropper v0.7.4-beta
+ * https://github.com/fengyuanchen/cropper
+ *
+ * Copyright 2014 Fengyuan Chen
+ * Released under the MIT license
+ */
+
+.cropper-container {
+  position: relative;
+  overflow: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+
+  -webkit-tap-highlight-color: transparent;
+  -webkit-touch-callout: none;
+}
+
+.cropper-container img {
+  width: 100%;
+  max-width: none !important;
+  height: 100%;
+  max-height: none !important;
+}
+
+.cropper-modal,
+.cropper-canvas {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+.cropper-canvas {
+  background-color: #fff;
+  filter: alpha(opacity=0);
+  opacity: 0;
+}
+
+.cropper-modal {
+  background-color: #000;
+  filter: alpha(opacity=50);
+  opacity: .5;
+}
+
+.cropper-dragger {
+  position: absolute;
+  top: 10%;
+  left: 10%;
+  width: 80%;
+  height: 80%;
+}
+
+.cropper-viewer {
+  display: block;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  outline-width: 1px;
+  outline-style: solid;
+  outline-color: #69f;
+  outline-color: rgba(51, 102, 255, .75);
+}
+
+.cropper-dashed {
+  position: absolute;
+  display: block;
+  filter: alpha(opacity=50);
+  border: 0 dashed #fff;
+  opacity: .5;
+}
+
+.cropper-dashed.dashed-h {
+  top: 33.3%;
+  left: 0;
+  width: 100%;
+  height: 33.3%;
+  border-top-width: 1px;
+  border-bottom-width: 1px;
+}
+
+.cropper-dashed.dashed-v {
+  top: 0;
+  left: 33.3%;
+  width: 33.3%;
+  height: 100%;
+  border-right-width: 1px;
+  border-left-width: 1px;
+}
+
+.cropper-face,
+.cropper-line,
+.cropper-point {
+  position: absolute;
+  display: block;
+  width: 100%;
+  height: 100%;
+  filter: alpha(opacity=10);
+  opacity: .1;
+}
+
+.cropper-face {
+  top: 0;
+  left: 0;
+  cursor: move;
+  background-color: #fff;
+}
+
+.cropper-line {
+  background-color: #69f;
+}
+
+.cropper-line.line-e {
+  top: 0;
+  right: -3px;
+  width: 5px;
+  cursor: e-resize;
+}
+
+.cropper-line.line-n {
+  top: -3px;
+  left: 0;
+  height: 5px;
+  cursor: n-resize;
+}
+
+.cropper-line.line-w {
+  top: 0;
+  left: -3px;
+  width: 5px;
+  cursor: w-resize;
+}
+
+.cropper-line.line-s {
+  bottom: -3px;
+  left: 0;
+  height: 5px;
+  cursor: s-resize;
+}
+
+.cropper-point {
+  width: 5px;
+  height: 5px;
+  background-color: #69f;
+  filter: alpha(opacity=75);
+  opacity: .75;
+}
+
+.cropper-point.point-e {
+  top: 50%;
+  right: -3px;
+  margin-top: -3px;
+  cursor: e-resize;
+}
+
+.cropper-point.point-n {
+  top: -3px;
+  left: 50%;
+  margin-left: -3px;
+  cursor: n-resize;
+}
+
+.cropper-point.point-w {
+  top: 50%;
+  left: -3px;
+  margin-top: -3px;
+  cursor: w-resize;
+}
+
+.cropper-point.point-s {
+  bottom: -3px;
+  left: 50%;
+  margin-left: -3px;
+  cursor: s-resize;
+}
+
+.cropper-point.point-ne {
+  top: -3px;
+  right: -3px;
+  cursor: ne-resize;
+}
+
+.cropper-point.point-nw {
+  top: -3px;
+  left: -3px;
+  cursor: nw-resize;
+}
+
+.cropper-point.point-sw {
+  bottom: -3px;
+  left: -3px;
+  cursor: sw-resize;
+}
+
+.cropper-point.point-se {
+  right: -3px;
+  bottom: -3px;
+  width: 20px;
+  height: 20px;
+  cursor: se-resize;
+  filter: alpha(opacity=100);
+  opacity: 1;
+}
+
+.cropper-point.point-se:before {
+  position: absolute;
+  right: -50%;
+  bottom: -50%;
+  display: block;
+  width: 200%;
+  height: 200%;
+  content: " ";
+  background-color: #69f;
+  filter: alpha(opacity=0);
+  opacity: 0;
+}
+
+@media (min-width: 768px) {
+  .cropper-point.point-se {
+    width: 15px;
+    height: 15px;
+  }
+}
+
+@media (min-width: 992px) {
+  .cropper-point.point-se {
+    width: 10px;
+    height: 10px;
+  }
+}
+
+@media (min-width: 1200px) {
+  .cropper-point.point-se {
+    width: 5px;
+    height: 5px;
+    filter: alpha(opacity=75);
+    opacity: .75;
+  }
+}
+
+/* Helper classes for JavaScript */
+
+.cropper-hidden {
+  display: none !important;
+}
+
+.cropper-invisible {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: -1;
+  width: auto !important;
+  max-width: none !important;
+  height: auto !important;
+  max-height: none !important;
+  filter: alpha(opacity=0);
+  opacity: 0;
+}
+
+.cropper-move {
+  cursor: move;
+}
+
+.cropper-crop {
+  cursor: crosshair;
+}
+
+.cropper-disabled .cropper-canvas,
+.cropper-disabled .cropper-face,
+.cropper-disabled .cropper-line,
+.cropper-disabled .cropper-point {
+  cursor: not-allowed;
+}

client/css/misc/layout-manager-grid.css

@@ -0,0 +1,210 @@
+#layout ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+}
+
+#layout ul > li {
+    background-color: var(--select-item-bg);
+    border-radius: var(--border-radius);
+}
+
+#layout ul.panels > li {
+    padding: var(--5px) var(--10px);
+    margin-bottom: var(--14px);
+    min-height: var(--80px);
+    border: var(--1px) solid var(--select-item-border);
+    border-radius: var(--border-radius);
+    background-color: var(--panel-bg);
+    list-style: none;
+}
+
+#layout ul.panels > li .panel-label {
+    margin-left: var(--4px);
+}
+
+#layout ul.panels > li[data-tab-break="true"] {
+    margin-top: var(--28px);
+}
+
+#layout ul.panels > li[data-tab-break="true"]:before {
+    content: " ";
+    display: block;
+    height: var(--1px);
+    background-color: var(--gray-light);
+    position: relative;
+    top: calc(var(--20px) * -1);
+    width: 50%;
+    margin: 0 auto;
+}
+
+#layout ul.rows {
+    min-height: var(--20px);
+}
+
+#layout ul.rows > li  {
+    list-style: none;
+    border: var(--1px) solid var(--select-item-border);
+    background-color: var(--panel-bg);
+    border-radius: var(--border-radius);
+    margin: var(--8px) 0;
+    padding: var(--5px);
+    height: calc(var(--70px) + var(--2px));
+}
+
+#layout ul.cells  {
+    min-height: var(--30px);
+    margin-top: var(--12px);
+
+    width: calc(100% - var(--20px));
+}
+
+#layout ul.panels ul.cells > li {
+    width: calc(50% - var(--10px));
+    float: left;
+}
+
+#layout {
+    .cells {
+        .cell {
+            user-select: none;
+        }
+    }
+}
+
+#layout ul.panels ul.cells > li[data-full-width="true"] {
+    width: calc(100% - var(--10px));
+}
+
+#layout ul.panels ul.cells[data-cell-count="1"] > li {
+    width: calc(100% - var(--10px));
+}
+
+#layout ul.panels ul.cells[data-cell-count="2"] > li {
+    width: calc(50% - var(--10px));
+}
+
+#layout ul.panels ul.cells[data-cell-count="3"] > li {
+    width: calc(33.3% - var(--10px));
+}
+
+#layout ul.panels ul.cells[data-cell-count="4"] > li {
+    width: calc(25% - var(--10px));
+}
+
+#layout ul.cells > li {
+    list-style: none;
+    border: var(--1px) solid var(--select-item-border);
+    margin: var(--5px);
+    padding: var(--5px);
+    height: var(--34px);
+}
+
+#layout ul.cells > li.ui-state-hover {
+    border-color: var(--brand-primary);
+}
+
+#layout  ul.cells.disabled > li {
+    margin: var(--5px) 0;
+}
+
+#layout ul.rows > li > div {
+
+}
+
+#layout ul.disabled {
+    min-height: var(--200px);
+    width: 100%;
+}
+
+#layout ul.disabled > li a {
+    display: none;
+}
+
+#layout header {
+    font-weight: 600;
+    margin-bottom: var(--10px);
+}
+
+#layout ul.panels > li label {
+    display: inline;
+}
+
+#layout ul.panels > li header a {
+    font-weight: normal;
+}
+
+#layout ul.panels > li > div {
+    width: auto;
+    text-align: left;
+    margin-left: var(--5px);
+}
+
+ul.cells li.cell a.remove-field {
+    display: none;
+}
+
+ul.cells li.cell:hover a.remove-field {
+    display: block;
+}
+
+ul.cells[data-cell-count="1"] li.cell:hover a.remove-field[data-action="minusCell"] {
+    display: none;
+}
+
+ul.panels > li a.remove-panel {
+    display: none;
+}
+
+ul.panels > li:hover a.remove-panel {
+    display: block;
+}
+
+ul.rows > li a.remove-row {
+    display: none;
+    width: var(--5px);
+    height: var(--5px);
+}
+
+ul.rows > li:hover a.remove-row {
+    display: block;
+}
+
+ul.rows > li a.add-cell {
+    display: none;
+    position: relative;
+    width: var(--5px);
+    height: var(--5px);
+    top: var(--19px);
+    right: var(--7px);
+}
+
+ul.rows > li:hover a.add-cell {
+    display: block;
+}
+
+ul.rows > li[data-cell-count="4"]:hover a.add-cell {
+    display: none;
+}
+
+ul.panels > li a.edit-panel-label {
+    visibility: hidden;
+}
+
+ul.panels > li:hover a.edit-panel-label {
+    visibility: visible;
+}
+
+div.row-actions {
+    float: right;
+    height: var(--50px);
+    width: var(--12px);
+}
+
+.cell.ui-draggable-dragging {
+    opacity: 0.7;
+}
+
+#layout .well:focus-visible {
+    outline: 0;
+}

client/css/misc/layout-manager-rows.css

@@ -0,0 +1,61 @@
+#layout ul {
+    width: 100%;
+    min-height: var(--100px);
+    padding: 0;
+    list-style-type: none;
+    margin: 0;
+}
+
+#layout ul li {
+    list-style: none;
+    border: var(--1px) solid var(--select-item-border);
+    margin: var(--5px) 0;
+    padding: var(--5px);
+    height: var(--34px);
+}
+
+#layout header {
+    font-weight: 600;
+}
+
+#layout ul > li .left {
+    float: left;
+}
+
+#layout ul > li {
+    background-color: var(--select-item-bg);
+    color: var(--select-item-text-color);
+    border-radius: var(--border-radius);
+}
+
+#layout ul.enabled > li .right {
+    float: right;
+}
+
+#layout ul.disabled > li .right {
+    display: none;
+}
+
+#layout ul > li .width {
+    font-size: var(--font-size-small);
+}
+
+#layout ul.disabled > li .width {
+    display: none;
+}
+
+#layout label {
+    font-weight: normal;
+}
+
+.enabled li a.edit-field {
+    display: none;
+}
+
+.enabled li:hover a.edit-field {
+    display: block;
+}
+
+#layout .well:focus-visible {
+    outline: 0;
+}