lato_core 1.1.5 → 2.1

data/app/assets/stylesheets/lato_core/base/_table.scss

@@ -0,0 +1,47 @@
+.table {
+  border-collapse: collapse;
+  text-align: left;
+  background: $color_white;
+  width: 100%;
+
+  thead {
+    border-bottom: solid 1px darken($color_white, 3);
+  }
+
+  tbody:before {
+      content: "-";
+      display: block;
+      line-height: 0em;
+      color: transparent;
+  }
+
+  tr {
+    background: $color_white;
+
+    &:nth-child(2n) {
+      background: darken($color_white, 3);
+    }
+  }
+
+  th {
+
+  }
+
+  td {
+    
+  }
+
+  th, td {
+    padding: 7.5px 5px;
+  }
+
+  &.table-border {
+    
+    tbody {
+      th, td {
+        border: solid 1px lighten($color_black, 90);
+      }
+    }
+  }
+
+}

data/app/assets/stylesheets/lato_core/base/_typography.scss

@@ -0,0 +1,23 @@
+@font-face {
+    font-family: 'latoregular';
+    src: font-url('lato_core/lato-regular-webfont.eot');
+    src: font-url('lato_core/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
+         font-url('lato_core/lato-regular-webfont.woff2') format('woff2'),
+         font-url('lato_core/lato-regular-webfont.woff') format('woff'),
+         font-url('lato_core/lato-regular-webfont.ttf') format('truetype'),
+         font-url('lato_core/lato-regular-webfont.svg#latoregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'latobold';
+    src: font-url('lato_core/lato-bold-webfont.eot');
+    src: font-url('lato_core/lato-bold-webfont.eot?#iefix') format('embedded-opentype'),
+         font-url('lato_core/lato-bold-webfont.woff2') format('woff2'),
+         font-url('lato_core/lato-bold-webfont.woff') format('woff'),
+         font-url('lato_core/lato-bold-webfont.ttf') format('truetype'),
+         font-url('lato_core/lato-bold-webfont.svg#latobold') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}

data/app/assets/stylesheets/lato_core/cells/_cells.scss

@@ -0,0 +1,4 @@
+@import "elements/elements";
+@import "inputs/inputs";
+@import "charts/charts";
+@import "widgets/widgets";

data/app/assets/stylesheets/lato_core/cells/charts/_bar.scss

@@ -0,0 +1,3 @@
+.charts-bar {
+
+}

data/app/assets/stylesheets/lato_core/cells/charts/_charts.scss

@@ -0,0 +1,2 @@
+@import "general";
+@import "bar";

data/app/assets/stylesheets/lato_core/cells/charts/_general.scss

@@ -0,0 +1,7 @@
+.charts {
+  
+}
+
+.charts__metadata {
+  display: none;
+}

data/app/assets/stylesheets/lato_core/cells/elements/_block.scss

@@ -0,0 +1,12 @@
+.elements-block {
+  background-color: $block_color_background;
+  padding: 15px;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  margin-bottom: 15px;
+  margin-left: 7.5px;
+  margin-right: 7.5px;
+}
+
+.elements-block--round {
+  border-radius: 10px;
+}

data/app/assets/stylesheets/lato_core/cells/elements/_button.scss

@@ -0,0 +1,132 @@
+.elements-button {
+  display: inline-block;
+  position: relative;
+}
+
+.elements-button__element {
+  background-color: $button_color_background;
+  color: $button_color_text;
+  font-weight: $button_font_weight;
+
+  &:focus {
+    background-color: darken($button_color_background, 5);
+  }
+
+  &:hover {
+    background-color: darken($button_color_background, 10);
+  }
+
+  .icon-left {
+    display: inline-block;
+    margin-right: 2.5px;
+  }
+
+  .icon-right {
+    display: inline-block;
+    margin-left: 2.5px;
+  }
+}
+
+.elements-button__element--info {
+  background-color: $button_info_background;
+  color: $button_info_color_text;
+
+  &:focus {
+    background-color: darken($button_info_background, 5);
+  }
+
+  &:hover {
+    background-color: darken($button_info_background, 10);
+  }
+}
+
+.elements-button__element--success {
+  background-color: $button_success_background;
+  color: $button_success_color_text;
+
+  &:focus {
+    background-color: darken($button_success_background, 5);
+  }
+
+  &:hover {
+    background-color: darken($button_success_background, 10);
+  }
+}
+
+.elements-button__element--danger {
+  background-color: $button_danger_background;
+  color: $button_danger_color_text;
+
+  &:focus {
+    background-color: darken($button_danger_background, 5);
+  }
+
+  &:hover {
+    background-color: darken($button_danger_background, 10);
+  }
+}
+
+.elements-button__element--warning {
+  background-color: $button_warning_background;
+  color: $button_warning_color_text;
+
+  &:focus {
+    background-color: darken($button_warning_background, 5);
+  }
+
+  &:hover {
+    background-color: darken($button_warning_background, 10);
+  }
+}
+
+.elements-button__link {
+
+}
+
+.elements-button__button {
+  
+}
+
+.elements-button__confirmation {
+  @include centerElement(xy);
+  z-index: 99;
+  background-color: $color_white;
+  min-width: 200px;
+  border-radius: 10px;
+  text-align: center;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  min-height: 50px;
+  padding: 15px;
+  border: solid 1px darken($color_white, 3);
+
+  opacity: 0;
+  transform: scale(0) translateX(-50%) translateY(-50%);
+  transition: opacity 0.25s;
+  
+  .message {
+    display: block;
+    margin-bottom: 10px;
+    font-size: 0.8em;
+  }
+
+  .popup {
+    font-size: 0.8em;
+    padding: 4px 10px;
+    margin: 2.5px;
+  }
+
+  .popup.true {
+    background-color: $button_success_background;
+    color: $button_success_color_text;
+  }
+
+  .popup.false {
+    background-color: $button_danger_background;
+    color: $button_danger_color_text;
+  }
+}
+
+.elements-button__confirmation--active {
+  opacity: 1;
+  transform: scale(1) translateX(-50%) translateY(-50%);
+}

data/app/assets/stylesheets/lato_core/cells/elements/_buttongroup.scss

@@ -0,0 +1,25 @@
+.elements-buttongroup {
+  
+  .elements-button {
+
+    .elements-button__element {
+      border-radius: 0;
+      margin: 0 1px;
+    }
+
+    &:first-child {
+      .elements-button__element {
+        border-top-left-radius: 10px;
+        border-bottom-left-radius: 10px;
+        margin-left: 0;
+      }
+    }
+    &:last-child {
+      .elements-button__element {
+        border-top-right-radius: 10px;
+        border-bottom-right-radius: 10px;
+        margin-right: 0;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/lato_core/cells/elements/_code.scss

@@ -0,0 +1,8 @@
+.elements-code {
+  background-color: $code_color_background;
+  padding: 15px;
+
+  .erb-tag {
+    color: green;
+  }
+}

data/app/assets/stylesheets/lato_core/cells/elements/_elements.scss

@@ -0,0 +1,10 @@
+@import 'button';
+@import 'flash';
+@import 'row';
+@import 'block';
+@import 'title';
+@import 'table';
+@import 'code';
+@import 'buttongroup';
+@import 'pagination';
+@import 'modal';

data/app/assets/stylesheets/lato_core/cells/elements/_flash.scss

@@ -0,0 +1,74 @@
+.elements-flash {
+  display: block;
+  width: 100%;
+  padding: 10px 12px;
+  box-sizing: border-box;
+  border-radius: 10px;
+  margin: 10px 0;
+  position: relative;
+  background-color: rgba($flash_color_background, 0.8);
+  border-color: $flash_color_background;
+  color: $flash_color_text;
+  max-height: 999px;
+  transition: all 0.25s;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  border-width: 2px;
+  border-style: solid;
+}
+
+.elements-flash--info {
+  background-color: rgba($flash_info_background, 0.7);
+  border-color: $flash_info_background;
+  color: $flash_info_color_text;
+
+  .elements-flash__close-button {
+    color: $flash_info_color_text;
+  }
+}
+
+.elements-flash--success {
+  background-color: rgba($flash_success_background, 0.7);
+  border-color: $flash_success_background;
+  color: $flash_success_color_text;
+
+  .elements-flash__close-button {
+    color: $flash_success_color_text;
+  }
+}
+
+.elements-flash--danger {
+  background-color: rgba($flash_danger_background, 0.7);
+  border-color: $flash_danger_background;
+  color: $flash_danger_color_text;
+
+  .elements-flash__close-button {
+    color: $flash_danger_color_text;
+  }
+}
+
+.elements-flash--warning {
+  background-color: rgba($flash_warning_background, 0.7);
+  border-color: $flash_warning_background;
+  color: $flash_warning_color_text;
+  
+  .elements-flash__close-button {
+    color: $flash_warning_color_text;
+  }
+}
+
+.elements-flash--hidden {
+  opacity: 0;
+  max-height: 0px;
+  margin: 0 0;
+  padding: 0 12px;
+  overflow: hidden;
+}
+
+.elements-flash__close-button {
+  color: $flash_info_color_text;
+  position: absolute;
+  top: 3px;
+  right: 5px;
+  cursor: pointer;
+  text-decoration: none;
+}

data/app/assets/stylesheets/lato_core/cells/elements/_modal.scss

@@ -0,0 +1,76 @@
+.elements-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  display: block;
+  background-color: transparent;
+  z-index: 100;
+  transform: scale(0);
+  transition: transform 0.5s;
+}
+
+.elements-modal--active {
+  transform: scale(1);
+  background-color: rgba($modal_color_transarent_background, 0.5);
+  transition: transform 0.25s, background-color 1s;
+}
+
+.elements-modal__modal {
+  @include centerElement(xy);
+  width: 80%;
+  height: 80%;
+  background: $modal_color_background;
+  border-radius: 15px;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  overflow: hidden;
+  opacity: 0;
+  transition: none;
+}
+
+.elements-modal__modal--active {
+  opacity: 1;
+  transition: all 0.25s;
+}
+
+.elements-modal__close-button {
+  outline: 0;
+  border: none;
+  background: transparent;
+  color: $modal_color_title;
+  position: absolute;
+  right: 7px;
+  top: 5px;
+  font-size: 20px;
+  padding: 0;
+}
+
+.elements-modal__content {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.elements-modal__header {
+  padding: 15px;
+  border-bottom: solid 2px $modal_color_header_border;
+}
+
+.elements-modal__title {
+  font-size: 1.5em;
+  color: $modal_color_title;
+  font-weight: bold;
+}
+
+.elements-modal__body {
+  padding: 15px;
+  overflow: scroll;
+  position: absolute;
+  top: 55px;
+  left: 0;
+  height: calc(100% - 55px);
+  width: 100%;
+}

data/app/assets/stylesheets/lato_core/cells/elements/_pagination.scss

@@ -0,0 +1,64 @@
+.elements-pagination {
+  position: relative;
+  height: 23px;
+}
+
+.elements-pagination__arrows {
+  display: inline-block;
+  position: absolute;
+  top: 0;
+
+  a {
+    display: inline-block;
+    font-size: 1.4em;
+    width: 22px;
+    text-align: center;
+    color: $pagination_color_text;
+    border-radius: 50%;
+    transition: all 0.25s;
+    cursor: pointer;
+
+    &:hover {
+      background-color: $pagination_color_background_hover;
+    }
+  }
+}
+
+.elements-pagination__arrows--prev {
+  left: 0;
+}
+
+.elements-pagination__arrows--next {
+  right: 0;
+}
+
+.elements-pagination__arrows--disabled {
+  a {
+    color: $pagination_color_text_disabled;
+    cursor: not-allowed;
+    pointer-events: none;
+
+    &:hover {
+      background-color: transparent;
+    }
+  }
+}
+
+.elements-pagination__pages {
+  text-align: center;
+  padding-top: 2px;
+
+  a {
+    display: inline-block;
+    padding: 2px 6px;
+    color: $pagination_color_text;
+    text-decoration: none;
+    border-radius: 50%;
+    transition: all 0.25s;
+    cursor: pointer;
+
+    &.current {
+      background-color: $pagination_color_background_hover;
+    }
+  }
+}