lato_core 1.1.5 → 2.1

data/app/assets/stylesheets/lato_core/cells/widgets/_widgets.scss

@@ -0,0 +1 @@
+@import "index";

data/app/assets/stylesheets/lato_core/layouts/_admin.scss

@@ -0,0 +1,352 @@
+.layout-admin {
+  position: relative;
+  width: 100%;
+  min-height: 100vh;
+  padding-left: 160px;
+  background: $layout_admin_background;
+}
+
+// Sidebar section:
+
+.layout-admin__sidebar-container {
+  z-index: 99;
+  width: 160px;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  background: $layout_admin_sidebar_background;
+}
+
+.layout-admin__logo-container {
+  text-align: center;
+  padding: 15px 0;
+  background: darken($layout_admin_sidebar_background, 10);
+
+  img {
+    max-width: 50%;
+  }
+}
+
+.layout-admin__menu-container {
+  
+}
+
+.layout-admin__menu-list {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  margin-top: 7.5px;
+
+  li {
+    margin: 0;
+  }
+}
+
+.layout-admin__menu-item {
+  border-bottom: solid 1px lighten($layout_admin_sidebar_background, 2);
+  position: relative;
+
+  &:hover {
+    background: darken($layout_admin_sidebar_background, 5);
+
+    .layout-admin__menu-sublist {
+      display: block;
+    }
+  }
+}
+
+.layout-admin__menu-item-link {
+  display: block;
+  padding: 10px 10px;
+  text-decoration: none;
+  color: $layout_admin_sidebar_color_text;
+  outline: 0;
+  cursor: pointer;
+
+  i {
+    display: inline-block;
+    margin-right: 3px;
+  }
+
+  &:focus {
+    background: darken($layout_admin_sidebar_background, 5);
+  }
+
+  &:hover {
+    background: darken($layout_admin_sidebar_background, 5);
+  }
+}
+
+.layout-admin__menu-item-link--active {
+  position: relative;
+  background: darken($layout_admin_sidebar_background, 3);
+
+  &:before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 2px;
+    background-color: $layout_admin_sidebar_color_text;
+  }
+}
+
+.layout-admin__menu-sublist {
+  display: none;
+  position: absolute;
+  top: 0;
+  left: 100%;
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  background: darken($layout_admin_sidebar_background, 5);
+  width: 140px;
+  overflow: hidden;
+}
+
+.layout-admin__menu-subitem {
+  border-bottom: solid 1px darken($layout_admin_sidebar_background, 3);
+}
+
+.layout-admin__menu-subitem-link {
+  display: block;
+  padding: 10px 10px;
+  text-decoration: none;
+  color: $layout_admin_sidebar_color_text;
+  outline: 0;
+  cursor: pointer;
+
+  &:hover {
+    background: darken($layout_admin_sidebar_background, 2);
+  }
+}
+
+// Header section:
+
+.layout-admin__header-container {
+  background: $layout_admin_header_background;
+  height: 55px;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+}
+
+.layout-admin__title-container {
+  display: inline-block;
+  margin-left: 5px;
+  margin-top: 16px;
+  max-width: 30%;
+
+  h1 {
+    color: $layout_admin_header_color_title;
+    font-size: 20px;
+    margin: 0;
+    padding-right: 30px;
+    width: 100%;
+    @include oneLineText;
+  }
+}
+
+.layout-admin__back-container {
+  display: inline-block;
+  margin-left: 15px;
+  margin-top: 8px;
+  float: left;
+
+  .button {
+    color: $layout_admin_header_color_back_text;
+    background-color: $layout_admin_header_color_back_background;
+
+    &:hover {
+      background-color: $layout_admin_header_color_back_background_hover;
+    }
+  }
+}
+
+.layout-admin__profile-container {
+  max-width: 200px;
+  height: 55px;
+  float: right;
+  padding: 10px;
+  position: relative;
+  cursor: pointer;
+  background-color: $layout_admin_header_background;
+}
+
+.layout-admin__profile-image {
+  width: 35px;
+  height: 35px;
+  background-position: center;
+  background-size: cover;
+  background-repeat: no-repeat;
+  border-radius: 50%;
+  display: inline-block;
+  float: left;
+}
+
+.layout-admin__profile-info {
+  padding: 4px 10px;
+  padding-left: 45px;
+  color: $layout_admin_header_color_text;
+
+  span:last-child {
+    font-size: 0.8em;
+    position: relative;
+    top: -3px;
+  }
+}
+
+.layout-admin__profile-menu-list {
+  display: none;
+  position: absolute;
+  top: 100%;
+  right: 0;
+  background: $layout_admin_header_background;
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+  width: 100%;
+  min-width: 160px;
+  overflow: hidden;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  z-index: 99;
+}
+
+.layout-admin__profile-menu-list--active {
+  display: block;
+}
+
+.layout-admin__profile-menu-item {
+  margin: 0;
+}
+
+.layout-admin__profile-menu-link {
+  text-decoration: none;
+  display: block;
+  padding: 10px 10px;
+  font-size: 0.8em;
+  color: $layout_admin_header_color_profile_menu_text;
+  background-color: $layout_admin_header_color_profile_menu_background;
+  border-top: solid 1px darken($layout_admin_header_color_profile_menu_background, 10);
+
+  &:hover {
+    background-color: $layout_admin_header_color_profile_menu_background_hover;
+  }
+}
+
+.layout-admin__widgets-container {
+  display: inline-block;
+  float: right;
+  margin-top: 16px;
+  margin-right: 10px;
+}
+
+.layout-admin__widget-container {
+  position: relative;
+  display: inline-block;
+  margin: 0 2px;
+}
+
+.layout-admin__widget-container--active {
+
+  .layout-admin__widget-button {
+    background-color: $layout_admin_header_color_widget_icon_background_hover;
+  }
+
+  .layout-admin__widget-content {
+    display: block;
+  }
+}
+
+.layout-admin__widget-button {
+  font-size: 1em;
+  color: $layout_admin_header_color_widget_icon;
+  display: block;
+  background-color: $layout_admin_header_color_widget_icon_background;
+  width: 25px;
+  height: 25px;
+  border-radius: 50%;
+  position: relative;
+
+  i {
+    @include centerElement(xy);
+  }
+
+  &:hover, &:active, &:focus {
+    outline: 0;
+    background-color: $layout_admin_header_color_widget_icon_background_hover;
+  }
+}
+
+.layout-admin__widget-content {
+  display: none;
+  background-color: $layout_admin_header_background;
+  position: absolute;
+  top: calc(100% + 5px);
+  right: -30px;
+  padding: 10px;
+  width: 400px;
+  min-height: 50px;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+  border: solid 2px darken($color_white, 3);
+  border-radius: 15px;
+  z-index: 99;
+  font-size: 0.8em;
+}
+
+// Main section:
+
+.layout-admin__container {
+  min-height: 100vh;
+  padding: 15px;
+}
+
+// Partials:
+
+.layout-admin__partials-container {
+
+}
+
+// *********************************************************************
+// Responsive layout:
+
+@media(max-width:767px) {
+  .layout-admin {
+    padding-left: 60px;
+  }
+
+  .layout-admin__logo-container {
+    padding: 0;
+    height: 55px; 
+    img {
+      display: none;
+    }
+  }
+
+  .layout-admin__sidebar-container {
+    width: 60px;
+  }
+
+  .layout-admin__menu-item-link {
+    text-align: center;
+
+    span {
+      display: none;
+    }
+
+    i {
+      margin-right: 0;
+    }
+  }
+
+  .layout-admin__profile-info {
+    display: none;
+  }
+
+  .layout-admin__widget-content {
+    position: fixed;
+    top: 50px;
+    right: 0;
+    width: calc(100% - 60px);
+  }
+}

data/app/assets/stylesheets/lato_core/layouts/_authentication.scss

@@ -0,0 +1,10 @@
+.layout-authentication {
+  position: relative;
+  width: 100%;
+  min-height: 100vh;
+  background: $layout_authentication_background;
+}
+
+.layout-authentication__container {
+  @include centerElement(xy);
+}

data/app/assets/stylesheets/lato_core/layouts/_layouts.scss

@@ -0,0 +1,2 @@
+@import "authentication";
+@import "admin";

data/app/assets/stylesheets/lato_core/pages/_dashboard.scss

@@ -0,0 +1,35 @@
+.dashboard__button {
+  display: block;
+  border: solid 1px transparent;
+  text-align: center;
+  text-decoration: none;
+  padding: 10px;
+  border-radius: 10px;
+
+  .icon {
+    font-size: 40px;
+    padding-top: 10px;
+    padding-bottom: 20px;
+    transition: transform 0.25s;
+  }
+
+  .title {
+    font-size: 20px;
+    color: $color_black;
+  }
+
+  &:hover {
+    .icon { transform: scale(1.2) }
+  }
+
+  &:focus, &:active {
+    outline: 0;
+    background-color: $color_main;
+    color: $color_white;
+
+    .title {
+      color: $color_white;
+    }
+  }
+
+}

data/app/assets/stylesheets/lato_core/pages/_login.scss

@@ -0,0 +1,7 @@
+.login__container {
+  background: $color_white;
+  padding: 15px;
+  min-width: 400px;
+  border-radius: 15px;
+  box-shadow: 0px 11px 20px rgba(41,59,90,0.08);
+}

data/app/assets/stylesheets/lato_core/pages/_pages.scss

@@ -0,0 +1,2 @@
+@import "login";
+@import "dashboard";

data/app/assets/stylesheets/lato_core/partials/_dynamic_data_to_js.scss

@@ -0,0 +1,3 @@
+.partials__dynamic-data-to-js {
+  display: none;
+}

data/app/assets/stylesheets/lato_core/partials/_partials.scss

@@ -0,0 +1 @@
+@import "dynamic_data_to_js";

data/app/assets/stylesheets/lato_core/theme.scss.erb

@@ -0,0 +1,127 @@
+<%
+  colors = core__get_colors
+%>
+
+$color_white: <%= colors[:white] %>;
+$color_black: <%= colors[:black] %>;
+$color_grey: <%= colors[:grey] %>;
+$color_main: <%= colors[:main] %>;
+$color_active: <%= colors[:active] %>;
+$color_danger: <%= colors[:danger] %>;
+$color_warning: <%= colors[:warning] %>;
+$color_success: <%= colors[:success] %>;
+
+// BASE STYLE -> do not edit variables after this line.
+// ///////////////////////////////////////////////////////////
+
+// Body main configurations:
+
+$body_background: $color_white;
+
+$body_font_family: 'latoregular';
+$body_font_size: 14px;
+
+// Layouts configurations:
+
+$layout_authentication_background: $color_grey;
+$layout_admin_background: $color_grey;
+
+$layout_admin_sidebar_background: $color_main;
+$layout_admin_sidebar_color_text: $color_white;
+
+$layout_admin_header_background: $color_white;
+$layout_admin_header_color_title: darken($color_grey, 20);
+$layout_admin_header_color_text: $color_black;
+
+$layout_admin_header_color_back_background: $color_main;
+$layout_admin_header_color_back_background_hover: darken($color_main, 10);
+$layout_admin_header_color_back_text: $color_white;
+
+$layout_admin_header_color_widget_icon_background: $color_main;
+$layout_admin_header_color_widget_icon: $color_white;
+$layout_admin_header_color_widget_icon_background_hover: darken($color_main, 10);
+
+$layout_admin_header_color_profile_menu_background: $color_white;
+$layout_admin_header_color_profile_menu_background_hover: $color_grey;
+$layout_admin_header_color_profile_menu_text: $color_black;
+
+// CELLS STYLE
+// ///////////////////////////////////////////////////////////
+
+// Inputs configurations:
+
+$input_color_background: $color_white;
+$input_color_border: $color_grey;
+$input_color_border_error: $color_danger;
+$input_color_text: $color_black;
+$input_color_label: $color_black;
+$input_font_weight_label: 700;
+
+// Dropzone configurations:
+
+$dropzone_color_border: $color_grey;
+$dropzone_color_icon: $color_grey;
+
+// Button configurations:
+
+$button_color_background: $color_main;
+$button_color_text: $color_white;
+$button_font_weight: 500;
+
+$button_info_background: $color_active;
+$button_info_color_text: $color_white;
+$button_success_background: $color_success;
+$button_success_color_text: $color_white;
+$button_danger_background: $color_danger;
+$button_danger_color_text: $color_white;
+$button_warning_background: $color_warning;
+$button_warning_color_text: $color_white;
+
+// Flash configurations:
+
+$flash_color_background: $color_main;
+$flash_color_text: $color_white;
+
+$flash_info_background: $color_active;
+$flash_info_color_text: $color_white;
+$flash_success_background: $color_success;
+$flash_success_color_text: $color_white;
+$flash_danger_background: $color_danger;
+$flash_danger_color_text: $color_white;
+$flash_warning_background: $color_warning;
+$flash_warning_color_text: $color_white;
+
+// Block configurations:
+
+$block_color_background: $color_white;
+
+// Title configurations:
+
+$title_color_text: $color_black;
+$title_color_border: $color_grey;
+
+// Table configurations:
+
+$table_head_color_background: $color_main;
+$table_head_color_text: $color_white;
+$table_row_color_background_hover: $color_grey;
+$table_row_color_boolean_true: $color_success;
+$table_row_color_boolean_false: $color_danger;
+
+// Code configurations:
+
+$code_color_background: $color_grey;
+
+// Pagination configurations:
+
+$pagination_color_text: $color_main;
+$pagination_color_text_disabled: darken($color_white, 20);
+$pagination_color_background_hover: $color_grey;
+
+// Modal configurations:
+
+$modal_color_transarent_background: $color_main;
+$modal_color_background: $color_white;
+$modal_color_title: $color_main;
+$modal_color_header_border: $color_grey;
+