self/sprint
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

New ui

Browse Source
This commit is contained in:
Administrator
2022-04-18 06:52:24 +00:00
parent 28f29fa610
commit 01c592100d
474 changed files with 48732 additions and 1609 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
Main/static/assets/scss/volt/layout/_footer.scss Normal file
View File

@@ -0,0 +1,105 @@
/**
* = Footers
*/
.footer{
ul{
margin-bottom: 0;
padding: 0;
list-style: none;
li{
display: inline-block;
a {
text-decoration: none;
position: relative;
display: block;
color: $gray-700;
&:hover {
color: $primary;
}
}
.btn {
margin: 0;
}
}
&.links-horizontal{
&:first-child a{
padding-left: 0;
}
&:last-child a{
padding-right: 0;
}
}
&.links-vertical{
li{
display: block;
margin-left: -5px;
margin-right: -5px;
a{
padding: 5px;
&:hover{
color: inherit !important;
}
}
}
}
&.icon-box{
i{
line-height: 1.7
}
}
}
.social-buttons{
a,
.btn{
margin-top: 5px;
margin-bottom: 5px;
padding: $padding-footer-sm $padding-footer;
}
}
.footer-brand{
font-size: $font-size-lg;
font-weight: $font-weight-bold;
img.common {
height: 40px;
}
img {
height: 40px;
width: 40px;
}
&:hover,
&:focus{
color: $black;
}
}
.footer-language-link{
font-size:$font-size-sm;
i{
font-size: 0.75rem;
}
}
.copyright{
font-size: $font-size-sm;
}
.pull-center{
display: inline-block;
float: none;
}
}

414
Main/static/assets/scss/volt/layout/_navbar.scss Normal file
View File

@@ -0,0 +1,414 @@
/**
* = Navigation bars
*/
.navbar-main {
position: absolute;
top: 0;
width: 100%;
z-index: 100;
.navbar-toggler-icon {
background-image: $navbar-dark-toggler-icon-bg;
}
}
.navbar .navbar-nav {
.nav-link {
@include transitions(.8s, $transition-base);
@include media-breakpoint-down(md) {
font-size: 1.2rem;
@include display-flex();
@include justify-content(space-between);
@include align-items(center);
}
}
.nav-item {
.media:not(:last-child){
margin-bottom: 1.5rem;
}
&:focus,
.nav-link:focus {
outline: none !important;
}
}
.dropdown {
.dropdown-menu {
top: 100%;
span{
width: 30px;
}
}
.dropdown-item {
font-size: 0.875rem;
}
}
.dropdown-megamenu,
.dropdown-megamenu-sm,
.dropdown-megamenu-md {
@include media-breakpoint-up(lg) {
min-width: 580px;
}
.megamenu-link {
color: $gray;
font-weight: 400;
font-size: $font-size-sm;
}
.megamenu-item {
position: relative;
&:hover {
.megamenu-link {
color: $primary;
}
}
}
}
.dropdown-megamenu-sm {
@include media-breakpoint-up(lg) {
min-width: 320px;
}
}
.dropdown-megamenu-md {
@include media-breakpoint-up(lg) {
min-width: 960px;
}
}
@include media-breakpoint-up(lg) {
.dropdown-menu {
.dropdown-toggle .nav-link-arrow {
@include transform(rotate(-90deg));
}
}
.dropdown.show > .dropdown-toggle .nav-link-arrow {
@include transform(rotate(180deg));
}
.dropdown-toggle:hover .nav-link-arrow {
@include transform(rotate(0deg));
}
}
.dropdown-submenu {
position: relative;
.dropdown-menu {
top: 0;
left: calc(100% - 2px);
margin-left: .1rem;
margin-right: .1rem;
opacity: 0;
display: none;
&.show {
opacity: 1;
pointer-events: all;
display: block;
}
}
}
.nav-link-arrow {
transition: $transition-transform;
}
}
.navbar-brand {
font-size: $font-size-sm;
font-weight: $font-weight-bold;
text-transform: uppercase;
img {
height: 40px;
}
}
// Navbar text and logo dark & light
.navbar-dark {
.navbar-brand-light {
display: none;
}
.navbar-brand {
color: $white;
}
& > .nav-item:hover > .nav-link {
color: $primary;
}
}
.navbar-light {
&:not(.headroom--not-top) {
.btn-outline-soft {
border-color: $dark;
color: $dark;
&:hover {
background: $dark;
color: $white;
}
}
}
.navbar-toggler-icon {
background-image: $navbar-light-toggler-icon-bg;
}
.navbar-brand-dark {
display: none;
}
.navbar-brand {
color: $gray-800;
}
}
.dropdown-menu {
top: 100%;
span{
width: 30px;
}
}
.navbar-transparent {
background-color: transparent;
border: 0;
box-shadow: none;
}
@include media-breakpoint-up(lg) {
.navbar-nav {
.nav-item {
[data-toggle="dropdown"]::after {
transition: $transition-base;
}
&.show {
[data-toggle="dropdown"]::after {
@include transform(rotate(180deg));
}
}
}
.nav-link {
i {
margin-right: .3rem;
font-size: $font-size-xs;
}
}
.nav-link-icon {
padding-left: .5rem;
padding-right: .5rem;
font-size: 1rem;
i {
margin-right: 0;
}
}
.dropdown-menu {
opacity: 0;
pointer-events: none;
margin: 0;
border-radius: $dropdown-border-radius;
}
.dropdown-menu-end {
&:before {
right: 20px;
left: auto;
}
}
.dropdown-menu-center {
left: 50%;
transform: translateX(-50%);
}
.dropdown-menu,
.dropdown-megamenu,
.dropdown-megamenu-md {
&.show {
opacity: 1;
pointer-events: auto;
}
&.close {
display: block;
}
}
.dropdown-submenu .dropdown-menu {
transform: none;
}
.dropdown-menu {
position: relative;
display: block;
opacity: 0;
pointer-events: none;
transition: $transition-base;
}
.dropdown.show,
.dropdown-submenu.show {
& > .dropdown-menu {
display: block;
opacity: 1;
pointer-events: auto;
}
}
.dropdown-menu-inner {
position: relative;
padding: 1rem;
}
}
.navbar-transparent {
.navbar-nav {
.nav-link {
&.disabled {
color: $navbar-dark-disabled-color;
}
}
}
.navbar-brand {
color: $navbar-dark-color;
}
}
}
// Collapse
.navbar-collapse-header {
display: none;
}
.navbar-collapse {
width: auto;
}
@include media-breakpoint-down(lg) {
.navbar-nav {
.nav-link {
padding: .625rem 0;
}
.dropdown-menu {
box-shadow: none;
width: 100%;
.media svg {
width: 30px;
}
}
}
.dropdown-menu-center {
right: 0;
left: auto;
transform: translate(0, 0);
@include media-breakpoint-down(lg) {
transform: translateX(-75%);
}
}
.navbar-collapse {
width: calc(100% - 30px);
position: absolute;
top: 0;
right: 15px;
z-index: 1050;
overflow-y: auto;
// using !important to overwrite Bootstrap's inline styles
height: calc(100vh - 30px) !important;
opacity: 0;
.navbar-toggler {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
padding: 0;
span {
display: block;
position: absolute;
width: 100%;
height: 2px;
border-radius: 2px;
opacity: 1;
background: #283448;
}
}
.navbar-collapse-header {
display: block;
padding-bottom: 1rem;
margin-bottom: 1rem;
}
.collapse-brand img {
height: 35px;
}
.collapse-close {
text-align: right;
}
}
.navbar-collapse.collapsing,
.navbar-collapse.show {
padding: 1.5rem;
border-radius: $dropdown-border-radius;
background: $white;
animation: show-navbar-collapse .2s ease forwards;
@include box-shadow(0 0 20px rgba(0, 0, 0, .1));
}
.navbar-collapse.collapsing-out {
animation: hide-navbar-collapse .2s ease forwards;
}
}
.navbar-dashboard {
border-radius: $border-radius;
}
// Theme color variants
// eg. navbar-theme-primary, navbar-theme-secondary
@each $color, $value in $navbar-colors {
.navbar-theme-#{$color}:not(.headroom) {
background-color: $value;
}
}

164
Main/static/assets/scss/volt/layout/_section.scss Normal file
View File

@@ -0,0 +1,164 @@
/**
* = Sections
*/
.section {
position: relative;
padding-top: $spacer * 3;
padding-bottom: $spacer * 3;
}
.section-header {
position: relative;
padding-top: $spacer * 9;
padding-bottom: $spacer * 3;
}
@include media-breakpoint-up(sm) {
.section {
position: relative;
padding-top: $spacer * 5;
padding-bottom: $spacer * 5;
}
.section-header {
position: relative;
padding-top: $spacer * 8;
padding-bottom: $spacer * 8;
&.section-sm{
padding-top: $spacer * 4;
padding-bottom: $spacer * 3;
}
}
.section-xl {
padding-top: $spacer * 8;
padding-bottom: $spacer * 8;
}
.section-lg {
padding-top: $spacer * 6;
padding-bottom: $spacer * 6;
}
.section-sm {
padding-top: $spacer * 3;
padding-bottom: $spacer * 3;
}
}
@include media-breakpoint-up(lg) {
.section {
position: relative;
padding-top: $spacer * 6;
padding-bottom: $spacer * 6;
}
.section-header {
position: relative;
padding-top: $spacer * 10;
padding-bottom: $spacer * 10;
&.section-sm{
padding-top: $spacer * 4;
padding-bottom: $spacer * 3;
}
}
.section-xl {
padding-top: $spacer * 10;
padding-bottom: $spacer * 10;
}
.section-lg {
padding-top: $spacer * 8;
padding-bottom: $spacer * 8;
}
.section-sm {
padding-top: $spacer * 4;
padding-bottom: $spacer * 4;
}
}
// Hero sections
.section-hero {
@include media-breakpoint-up(md) {
height: 100vh;
}
}
//Section delimiter
.line-bottom{
&::after{
content: '';
display: block;
width: 80%;
position: absolute;
bottom: 0;
left: 50%;
margin-left: -40%;
height: 1px;
background: radial-gradient(ellipse at center,$light 0,rgba(255,255,255,0) 80%);
}
}
// Profile cover
.section-profile-cover {
height: 580px;
background-size: cover;
background-position: center center;
@include media-breakpoint-down(md) {
height: 400px;
}
}
// Components section
.components-section {
>.form-control {
+.form-control {
margin-top: .5rem;
}
}
>.nav+.nav,
>.alert+.alert,
>.navbar+.navbar,
>.progress+.progress,
>.progress+.btn,
.badge,
.btn {
margin-top: .5rem;
margin-bottom: .5rem;
}
.btn-group {
margin-top: .5rem;
margin-bottom: .5rem;
.btn {
margin: 0;
}
}
.alert {
margin: 0;
+.alert {
margin-top: 1.25rem;
}
}
.badge {
margin-right: .5rem;
}
.modal-footer {
.btn {
margin: 0;
}
}
}
.copy-docs {
position: absolute;
top: 5px;
right: 5px;
transition: $transition-base;
&.copied {
background: $success;
}
&:hover {
cursor: pointer;
}
}
.kanban-container{
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
}

34
Main/static/assets/scss/volt/layout/_sidebar.scss Normal file
View File

@@ -0,0 +1,34 @@
/**
* = Sidebars
*/
#doc-index:not(.collapse.show), .doc-sidebar {
display: none;
}
@include media-breakpoint-up(lg){
#doc-index{
display: block;
}
.doc-sidebar {
display: block;
height: calc(100vh - 2rem);
overflow-y: scroll;
position: -webkit-sticky;
position: sticky;
top: 2rem;
.nav-link[data-toggle="collapse"] > .icon {
transform: rotateZ(-90deg);
position: relative;
right: .25rem;
}
.nav{
.nav-item{
font-size:$font-size-sm;
}
}
}
}

191
Main/static/assets/scss/volt/layout/_sidenav.scss Normal file
View File

@@ -0,0 +1,191 @@
/*
* Sidebar
*/
.sidebar {
display: block;
position: fixed;
top: 0;
bottom: 0;
left: 0;
z-index: 100;
max-height: 100%;
overflow-y: auto;
width: 100%;
@include transition(max-width .1s);
@include media-breakpoint-up(md) {
width: 100%;
max-width: 260px;
}
.nav {
white-space: nowrap;
}
.nav-item {
&.active {
& > .nav-link {
color: $gray-100;
background-color: $gray-700;
}
}
.nav-link {
color: $white;
cursor: pointer;
&:hover {
color: $gray-100;
background-color: $gray-700;
}
}
margin-bottom: .2rem;
}
.nav-link + .multi-level {
margin-top: .2rem;
}
.nav-link {
font-size: $font-size-base;
vertical-align: middle;
padding: 0.55rem 0.75rem;
@include border-radius($border-radius);
.sidebar-icon {
margin-right: .5rem;
color: $gray-400;
}
.link-arrow{
font-size: $font-size-sm;
}
&[data-bs-toggle=collapse][aria-expanded=true] .link-arrow{
@include transform(rotate(90deg));
transition: $transition-base;
}
}
.nav-link.active {
color: $gray-100;
}
.multi-level{
.nav-link{
padding-left: 53px;
}
}
.sidebar-text,
.link-arrow,
.badge,
.notification-count {
opacity: 1;
}
.sidebar-text-contracted {
display: none;
}
&.contracted {
.sidebar-text,
.link-arrow,
.badge {
opacity: 0;
}
.notification-count {
opacity: 1;
position: absolute;
top: 0;
left: 40px;
width: 18px;
height: 18px;
border-radius: 50%;
font-size: .7rem;
padding: .2rem;
}
.nav-item {
position: relative;
&.active {
& > .nav-link {
background-color: #363c54;
width: 44px;
}
}
.nav-link {
&:hover {
background-color: $primary;
}
}
}
.sidebar-text-contracted {
display: inline;
}
.multi-level .nav-link {
padding-left: 17px;
}
.nav-item {
white-space: nowrap;
}
.sidebar-icon {
text-align: center;
}
@include media-breakpoint-up(md) {
& + .content {
margin-left: 95px;
}
}
max-width: 95px;
}
}
.sidebar-inner {
position: relative;
overflow-y: hidden;
}
.sidebar-heading {
font-size: .75rem;
text-transform: uppercase;
}
.user-card{
border-bottom: 0.0625rem solid #2e3650;
}
@include media-breakpoint-down(sm) {
.sidebar {
width: 100%;
}
}
.content {
overflow: hidden;
padding: 0 $spacer 0 $spacer;
@include transition(all .3s);
@include media-breakpoint-up(lg) {
margin-left: 260px;
}
}
.sidebar-toggle {
font-size: 1.3rem;
&:hover,
&:focus {
outline: none;
box-shadow: none;
background: $gray-300;
}
}