sean/manja_ui_dev
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

v1.0.0

Browse Source
This commit is contained in:
Łukasz Holeczek
2017-09-28 12:44:26 +02:00
parent 5271e28c36
commit 0a00ed0646
518 changed files with 492 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Vue_Starter/scss/core/_animate.scss
+1 -18
View File
@@ -1,33 +1,17 @@
// scss-lint:disable all
@charset "UTF-8";
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
// animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
@@ -39,6 +23,5 @@
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
Vue_Starter/scss/core/_layout.scss
+7 -8
View File
@@ -11,8 +11,8 @@
app-dashboard,
app-root {
display: flex;
min-height: 100vh;
flex-direction: column;
min-height: 100vh;
}
.app-header {
@@ -26,12 +26,12 @@ app-root {
.app-body {
display: flex;
flex-direction: row;
overflow-x: hidden;
flex-grow: 1;
overflow-x: hidden;
.main {
min-width: 0;
flex: 1;
min-width: 0;
}
.sidebar {
@@ -134,11 +134,6 @@ app-root {
.sidebar-minimized {
.sidebar {
flex: 0 0 $sidebar-minimized-width;
.sidebar-header,
.sidebar-form,
.sidebar-footer {
display: none;
}
}
&.sidebar-hidden {
@@ -344,6 +339,10 @@ app-root {
.nav {
width: $mobile-sidebar-width !important;
}
.sidebar-minimizer {
display: none;
}
}
.main, .app-footer {
Vue_Starter/scss/core/_navbar.scss
+12 -1
View File
@@ -1,7 +1,7 @@
.app-header.navbar {
position: relative;
height: $navbar-height;
flex-direction: row;
height: $navbar-height;
padding: 0;
margin: 0;
background-color: $navbar-bg;
@@ -101,3 +101,14 @@
.navbar-divider {
background-color: rgba(0,0,0,.075);
}
.brand-minimized {
.app-header.navbar {
.navbar-brand {
width: $navbar-brand-minimized-width;
background-color: $navbar-brand-minimized-bg;
background-image: $navbar-brand-minimized-logo;
background-size: $navbar-brand-minimized-logo-size;
}
}
}
Vue_Starter/scss/core/_sidebar.scss
+57 -3
View File
@@ -78,7 +78,8 @@
.nav {
@include sidebar-width($sidebar-borders, $sidebar-width);
flex-direction: column !important;
flex-direction: column;
min-height: 100%;
}
.nav-title {
@@ -148,8 +149,8 @@
}
&:hover {
color: $sidebar-nav-link-hover-color !important;
background: $sidebar-nav-link-hover-bg !important;
color: $sidebar-nav-link-hover-color;
background: $sidebar-nav-link-hover-bg;
@include borders($sidebar-nav-link-hover-borders);
i {
@@ -160,6 +161,21 @@
background-image: $sidebar-nav-dropdown-indicator-hover;
}
}
@each $color, $value in $theme-colors {
&.nav-link-#{$color} {
background: $value;
i {
color: rgba(255,255,255,.7);
}
&:hover {
background: darken($value,5%) !important;
i {
color: #fff;
}
}
}
}
}
// ex. <a class="nav-link nav-dropdown-toggle" href="#">Components</a>
@@ -239,6 +255,39 @@
padding: $sidebar-footer-padding-y $sidebar-footer-padding-x;
background: $sidebar-footer-bg;
}
.sidebar-minimizer {
position: relative;
flex: 0 0 $sidebar-minimizer-height;
background-color: $sidebar-minimizer-bg;
border: 0;
&::before {
position: absolute;
top: 0;
right: 0;
width: $sidebar-minimizer-height;
height: $sidebar-minimizer-height;
content: "";
background-image: $sidebar-minimizer-indicator;
background-repeat: no-repeat;
background-position: center;
background-size: $sidebar-minimizer-height / 4;
transition: .3s;
}
&:focus,
&.focus {
outline: 0;
}
&:hover {
background-color: $sidebar-minimizer-hover-bg;
&::before {
background-image: $sidebar-minimizer-hover-indicator;
}
}
}
}
@include media-breakpoint-up(lg) {
@@ -312,6 +361,11 @@
display: none;
}
.sidebar-minimizer::before {
width: 100%;
transform: rotate(-180deg);
}
.nav-item {
width: $sidebar-minimized-width;
overflow: hidden;
Vue_Starter/scss/core/_variables.scss
+17
View File
@@ -1,3 +1,4 @@
// scss-lint:disable all
// Core Admin Variables
$enable-sidebar-nav-rounded: false !default;
@@ -57,6 +58,11 @@ $navbar-brand-border: (
)
) !default;
$navbar-brand-minimized-width: 50px !default
$navbar-brand-minimized-bg: #fff !default;
$navbar-brand-minimized-logo: url('../img/logo-symbol.png') !default;
$navbar-brand-minimized-logo-size: 24px !default;
$navbar-color: $gray-600 !default;
$navbar-hover-color: $gray-800 !default;
$navbar-active-color: $gray-800 !default;
@@ -127,6 +133,17 @@ $sidebar-footer-bg: rgba(0,0,0,.2) !default;
$sidebar-footer-padding-y: .75rem !default;
$sidebar-footer-padding-x: 1rem !default;
// Sidebar Minimizer
$sidebar-minimizer-height: 50px !default;
$sidebar-minimizer-bg: rgba(0,0,0,.2) !default;
$sidebar-minimizer-indicator-color: $gray-600 !default;
$sidebar-minimizer-indicator: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-minimizer-indicator-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E"), "#", "%23") !default;
$sidebar-minimizer-hover-bg: rgba(0,0,0,.3) !default;
$sidebar-minimizer-hover-indicator-color:$sidebar-nav-link-hover-color !default;
$sidebar-minimizer-hover-indicator: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-minimizer-hover-indicator-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E"), "#", "%23") !default;
// Top Navigation
$top-nav-bg: #fff !default;