Merge pull request #3046 from ColorlibHQ/feat/new-form-button-styles

new styles and demos
pull/3053/head
REJack 2020-09-25 13:49:49 +02:00 committed by GitHub
commit 4ead90db62
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
92 changed files with 2408 additions and 59 deletions

View File

@ -2,27 +2,27 @@
"files": [
{
"path": "./dist/css/adminlte.css",
"maxSize": "80 kB"
"maxSize": "81.5 kB"
},
{
"path": "./dist/css/adminlte.min.css",
"maxSize": "74 kB"
"maxSize": "77.5 kB"
},
{
"path": "./dist/css/alt/adminlte.components.css",
"maxSize": "14 kB"
"maxSize": "16 kB"
},
{
"path": "./dist/css/alt/adminlte.components.min.css",
"maxSize": "13 kB"
"maxSize": "15 kB"
},
{
"path": "./dist/css/alt/adminlte.core.css",
"maxSize": "46 kB"
"maxSize": "47 kB"
},
{
"path": "./dist/css/alt/adminlte.core.min.css",
"maxSize": "43 kB"
"maxSize": "44 kB"
},
{
"path": "./dist/css/alt/adminlte.extra-components.css",

View File

@ -112,3 +112,31 @@
.btn-xs {
@include button-size($button-padding-y-xs, $button-padding-x-xs, $button-font-size-xs, $button-line-height-xs, $button-border-radius-xs);
}
.dark-mode {
.btn-default,
.btn-app {
background-color: lighten($dark, 2.5%);
color: $white;
border-color: $gray-600;
&:hover,
&:focus {
background-color: lighten($dark, 5%);
color: $gray-300;
border-color: lighten($gray-600, 2.5%);
}
}
.btn-light {
background-color: lighten($dark, 7.5%);
color: $white;
border-color: $gray-600;
&:hover,
&:focus {
background-color: lighten($dark, 10%);
color: $gray-300;
border-color: lighten($gray-600, 5%);
}
}
}

View File

@ -49,3 +49,9 @@
border-left-color: darken(theme-color("success"), 10%);
}
}
.dark-mode {
.callout {
background-color: lighten($dark, 5%);
}
}

View File

@ -96,7 +96,7 @@
.nav-item {
&:first-child .nav-link {
margin-left: -1px;
border-left-color: transparent;
}
}
}
@ -478,3 +478,44 @@ html.maximized-card {
}
}
}
.dark-mode {
.card {
background-color: $dark;
color: $white;
.card {
background-color: lighten($dark, 5%);
color: $white;
}
.nav.flex-column > li {
border-bottom-color: $gray-600;
}
.card-footer {
background-color: rgba($black, .1);
}
&.card-outline-tabs .card-header a:hover {
border-color: $gray-600;
}
&:not(.card-outline) > .card-header a.active {
color: $white;
}
}
.card-comments {
background-color: lighten($dark, 1.25%);
.username {
color: $gray-400;
}
.card-comment {
border-bottom-color: lighten($dark, 7.5%);
}
}
.todo-list > li {
background-color: lighten($dark, 5%);
border-color: lighten($dark, 7.5%);
color: $white;
}
}

View File

@ -89,3 +89,16 @@ a.text-muted:hover {
}
}
}
.dark-mode {
.bg-light {
background-color: lighten($dark, 7.5%) !important;
color: $white !important;
}
.text-black,
.text-dark,
.link-black,
.link-dark {
color: $gray-400;
}
}

View File

@ -222,3 +222,25 @@
@include direct-chat-variant($color);
}
}
.dark-mode {
.direct-chat-text {
background-color: lighten($dark, 7.5%);
border-color: lighten($dark, 10%);
color: $white;
&::after,
&::before {
border-right-color: lighten($dark, 10%);
}
}
.direct-chat-timestamp {
color: $gray-500;
}
.right > .direct-chat-text {
&::after,
&::before {
border-right-color: transparent;
}
}
}

View File

@ -269,3 +269,53 @@
width: $sidebar-user-image-width;
}
}
.dark-mode {
.dropdown-menu {
background-color: $dark;
color: $white;
}
.dropdown-item {
color: $white;
&:focus,
&:hover {
background-color: lighten($dark, 5%);
}
}
.dropdown-divider {
border-color: $gray-600;
}
.navbar-nav > .user-menu > .dropdown-menu {
> .user-footer {
background-color: lighten($dark, 2.5%);
color: $white;
.btn-default {
color: $white;
&:hover,
&:focus {
background-color: lighten($dark, 5%);
color: $gray-300;
}
&:focus {
background-color: lighten($dark, 7.5%);
}
}
}
> .user-body {
border-color: $gray-600;
}
> .user-body a {
background-color: transparent !important;
color: $white !important;
&:hover,
&:focus {
color: $gray-400 !important;
}
}
}
}

View File

@ -271,6 +271,25 @@ body.text-sm {
}
}
// custom .form-control styles
.form-control,
.custom-select {
&.form-control-border {
border-top: 0;
border-left: 0;
border-right: 0;
border-radius: 0;
box-shadow: inherit;
&.border-width-2 {
border-bottom-width: 2px;
}
&.border-width-3 {
border-bottom-width: 3px;
}
}
}
// custom switch color variations
.custom-switch {
@each $name, $color in $theme-colors {
@ -292,3 +311,91 @@ body.text-sm {
@include custom-range-variant($name, $color);
}
}
// custom control input variations
@each $name, $color in $theme-colors {
@include custom-control-input-variant($name, $color);
}
@each $name, $color in $colors {
@include custom-control-input-variant($name, $color);
}
.custom-control-input-outline {
~ .custom-control-label::before {
background-color: transparent !important;
box-shadow: none;
}
&:checked ~ .custom-control-label::before {
@include gradient-bg(transparent);
}
}
.dark-mode {
.form-control,
.custom-select,
.custom-file-label,
.custom-file-label::after,
.custom-control-label::before,
.input-group-text {
background-color: $dark;
color: $white;
}
.form-control:not(.form-control-navbar):not(.is-invalid):not(:focus) {
border-color: $gray-600;
}
select {
background-color: $dark;
color: $white;
border-color: $gray-600;
}
.input-group-text {
border-color: $gray-600;
}
.custom-control-input:disabled ~ .custom-control-label::before,
.custom-control-input[disabled] ~ .custom-control-label::before {
background-color: lighten($dark, 5%);
border-color: $gray-600;
color: $white;
}
.custom-range {
&::-webkit-slider-runnable-track {
background-color: lighten($dark, 7.5%);
}
&::-moz-range-track {
background-color: lighten($dark, 7.5%);
}
&::-ms-track {
background-color: lighten($dark, 7.5%);
}
}
.navbar-dark {
.btn-navbar,
.form-control-navbar {
background-color: $dark;
border: $input-border-width solid $gray-600;
}
.btn-navbar {
&:hover {
background-color: lighten($sidebar-dark-bg, 7.5%);
}
&:focus {
background-color: lighten($sidebar-dark-bg, 10%);
}
}
.form-control-navbar + .input-group-prepend,
.form-control-navbar + .input-group-append {
> .btn-navbar {
background-color: lighten($dark, 5%);
color: $white;
border: $input-border-width solid $gray-600;
border-left: none;
}
}
}
}

View File

@ -144,3 +144,10 @@
}
}
}
.dark-mode {
.info-box {
background-color: $dark;
color: $white;
}
}

View File

@ -625,3 +625,27 @@ body:not(.sidebar-mini-md) {
animation-duration: 0s !important;
}
}
.dark-mode {
background-color: lighten($dark, 7.5%) !important;
color: $white;
.breadcrumb-item {
&.active,
& + .breadcrumb-item::before {
color: $gray-500;
}
}
.main-footer {
background-color: $dark;
border-color: lighten($dark, 10%);
}
.content-wrapper {
background-color: lighten($dark, 7.5%);
color: $white;
.content-header {
color: $white;
}
}
}

View File

@ -481,3 +481,31 @@ blockquote {
.badge-btn.badge-pill {
padding: .375rem .6rem;
}
.dark-mode {
a:not(.btn):hover {
color: lighten($link-color, 10%);
}
.attachment-block {
background-color: lighten($dark, 3.75%);
.attachment-text {
color: $gray-400;
}
}
blockquote {
background-color: lighten($dark, 5%);
}
.close,
.mailbox-attachment-close {
color: $gray-500;
text-shadow: 0 1px 0 $gray-700;
}
.tab-custom-content {
border-color: $gray-600;
}
.list-group-item {
background-color: $dark;
border-color: $gray-600;
}
}

View File

@ -38,3 +38,35 @@
}
}
}
.dark-mode {
.modal-header,
.modal-footer {
border-color: $gray-600;
}
.modal-content {
background-color: $dark;
&.bg-warning {
.modal-header,
.modal-footer {
border-color: $gray-600;
}
.close {
color: $dark !important;
text-shadow: 0 1px 0 $gray-700 !important;
}
}
&.bg-primary,
&.bg-secondary,
&.bg-info,
&.bg-danger,
&.bg-success {
.modal-header,
.modal-footer {
border-color: $white;
}
}
}
}

View File

@ -81,6 +81,9 @@
@if $color == dark or $color == light {
.navbar-#{$color} {
background-color: $value;
@if $color == dark {
border-color: lighten($dark, 10%);
}
}
}
}
@ -98,3 +101,49 @@
background-color: $value;
}
}
.dark-mode {
.nav-pills .nav-link {
color: $gray-400;
}
.nav-tabs {
border-color: lighten($dark, 15%);
.nav-link:focus,
.nav-link:hover {
border-color: lighten($dark, 15%);
}
.nav-item.show .nav-link,
.nav-link.active {
background-color: $dark;
border-color: lighten($dark, 15%) lighten($dark, 15%) transparent lighten($dark, 15%);
color: $white;
}
&.flex-column {
.nav-item.show .nav-link,
.nav-link {
&.active,
&:focus,
&:hover {
border-color: lighten($dark, 15%) transparent lighten($dark, 15%) lighten($dark, 15%);
}
&:focus,
&:hover {
background-color: lighten($dark, 5%);
}
}
&.nav-tabs-right {
border-color: lighten($dark, 15%);
.nav-link {
&.active,
&:focus,
&:hover {
border-color: lighten($dark, 15%) lighten($dark, 15%) lighten($dark, 15%) transparent;
}
}
}
}
}
}

View File

@ -41,3 +41,33 @@
}
}
}
.dark-mode {
.page-item {
&.disabled .page-link {
background-color: lighten($dark, 2.5%);
border-color: $gray-600;
color: $gray-600;
}
&.active {
.page-link {
&:hover,
&:focus {
color: $gray-400;
}
}
}
&:not(.active) {
.page-link {
background-color: $dark;
border-color: $gray-600;
&:hover,
&:focus {
color: lighten($primary, 5%);
background-color: lighten($dark, 5%);
}
}
}
}
}

View File

@ -16,6 +16,7 @@
background-color: $white;
padding: 10px 0;
}
.product-img {
@ -52,3 +53,16 @@
border-bottom-width: 0;
}
}
.dark-mode {
.products-list > .item {
background-color: $dark;
color: $white;
border-bottom-color: $gray-600;
}
.product-description {
color: $gray-400;
}
}

View File

@ -64,3 +64,9 @@
}
}
}
.dark-mode {
.progress {
background: lighten($dark, 7.5%);
}
}

View File

@ -58,6 +58,8 @@
.card-body.p-0 & {
thead > tr > th,
thead > tr > td,
tfoot > tr > th,
tfoot > tr > td,
tbody > tr > th,
tbody > tr > td {
&:first-of-type {
@ -120,3 +122,34 @@
}
}
}
.dark-mode {
.table-bordered {
&,
td,
th {
border-color: $gray-600;
}
}
.table-hover {
tbody tr:hover {
color: $gray-300;
background-color: lighten($dark, 2.5%);
border-color: $gray-600;
}
}
.table {
thead th {
border-bottom-color: $gray-600;
}
th,
td {
border-top-color: $gray-600;
}
&.table-head-fixed {
thead tr:nth-child(1) th {
background-color: lighten($dark, 5%);
}
}
}
}

View File

@ -37,3 +37,9 @@
color: #{$color} !important;
}
}
.dark-mode {
.text-muted {
color: $gray-500 !important;
}
}

View File

@ -132,3 +132,24 @@
}
}
}
.dark-mode {
.timeline {
&::before {
background-color: $gray-600;
}
> div > .timeline-item {
background-color: $dark;
color: $white;
border-color: $gray-600;
> .timeline-header {
color: $gray-400;
border-color: $gray-600;
}
> .time {
color: $gray-400;
}
}
}
}

View File

@ -46,6 +46,18 @@
}
}
.dark-mode {
.toast {
background-color: rgba($dark, .85);
color: $white;
.toast-header {
background-color: rgba($dark, .7);
color: $gray-100;
}
}
}
.toast {
@each $name, $color in $theme-colors {
@include toast-variant($name, $color);

View File

@ -43,3 +43,12 @@
color: darken($gray-500, 20%);
font-size: 12px;
}
.dark-mode {
.users-list-name {
color: $gray-400;
}
.users-list-date {
color: $gray-500;
}
}

View File

@ -4,8 +4,8 @@
// Accent Variant
@mixin accent-variant($name, $color) {
$link-color: $color;
.accent-#{$name} {
$link-color: $color;
$link-hover-color: darken($color, 15%);
$pagination-active-bg: $color;
$pagination-active-border-color: $color;
@ -90,5 +90,14 @@
}
}
}
.dark-mode.accent-#{$name} {
.page-item {
.page-link {
&:hover,
&:focus {
color: lighten($link-color, 5%);
}
}
}
}
}

View File

@ -79,3 +79,45 @@
}
}
}
// Custom Control Input Variant
@mixin custom-control-input-variant($name, $color) {
$custom-control-indicator-checked-color: $color;
$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23");
$custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23");
.custom-control-input-#{$name} {
&:checked ~ .custom-control-label::before {
border-color: $color;
@include gradient-bg($color);
}
&.custom-control-input-outline:checked {
&[type="checkbox"] ~ .custom-control-label::after {
background-image: $custom-checkbox-indicator-icon-checked !important;
}
&[type="radio"] ~ .custom-control-label::after {
background-image: $custom-radio-indicator-icon-checked !important;
}
}
&:focus ~ .custom-control-label::before {
// the mixin is not used here to make sure there is feedback
@if $enable-shadows {
box-shadow: $input-box-shadow, 0 0 0 $input-btn-focus-width rgba($color, .25);
} @else {
box-shadow: 0 0 0 $input-btn-focus-width rgba($color, .25);
}
}
&:focus:not(:checked) ~ .custom-control-label::before {
border-color: lighten($color, 25%);
}
&:not(:disabled):active ~ .custom-control-label::before {
background-color: lighten($color, 35%);
border-color: lighten($color, 35%);
}
}
}

View File

@ -11,3 +11,9 @@
.invoice-title {
margin-top: 0;
}
.dark-mode {
.invoice {
background-color: $dark;
}
}

View File

@ -0,0 +1,56 @@
.content-wrapper.kanban {
height: 1px;
.content {
height: 100%;
overflow-x: auto;
overflow-y: hidden;
.container,
.container-fluid {
width: max-content;
display: flex;
align-items: stretch;
}
}
.content-header + .content {
height: calc(100% - ((2 * 15px) + (1.8rem * #{$headings-line-height})));
}
.card {
.card-body {
padding: .5rem;
}
&.card-row {
width: 340px;
display: inline-block;
margin: 0 .5rem;
&:first-child {
margin-left: 0;
}
.card-body {
height: 100%;
overflow-y: auto;
}
.card {
.card-header {
padding: .5rem .75rem;
}
.card-body {
padding: .75rem;
}
}
}
}
.btn-tool {
&.btn-link {
text-decoration: underline;
padding-left: 0;
padding-right: 0;
}
}
}

View File

@ -76,3 +76,18 @@
.lockscreen-footer {
margin-top: 10px;
}
.dark-mode {
.lockscreen-item {
background-color: $dark;
}
.lockscreen-logo a {
color: $white;
}
.lockscreen-credentials .btn {
background-color: $dark;
}
.lockscreen-image {
background-color: $gray-600;
}
}

View File

@ -52,6 +52,7 @@
&:focus {
box-shadow: none;
& ~ .input-group-prepend .input-group-text,
& ~ .input-group-append .input-group-text {
border-color: $input-focus-border-color;
}
@ -62,6 +63,7 @@
box-shadow: none;
}
& ~ .input-group-prepend .input-group-text,
& ~ .input-group-append .input-group-text {
border-color: $success;
}
@ -99,3 +101,18 @@
.social-auth-links {
margin: 10px 0;
}
.dark-mode {
.login-card-body,
.register-card-body {
background-color: $dark;
border-color: $gray-600;
color: $white;
}
.login-logo,
.register-logo {
a {
color: $white;
}
}
}

View File

@ -35,3 +35,10 @@
width: 100%;
}
}
.dark-mode {
.post {
color: $white;
border-color: $gray-600;
}
}

View File

@ -10,3 +10,4 @@
@import "../pages/profile";
@import "../pages/e-commerce";
@import "../pages/projects";
@import "../pages/kanban";

View File

@ -33,3 +33,10 @@
}
}
}
.dark-mode {
.slider-track {
background-color: lighten($dark, 10%);
background-image: none;
}
}

View File

@ -173,3 +173,16 @@ $bootstrap-switch-handle-border-radius: .1rem;
border-top-left-radius: $bootstrap-switch-handle-border-radius;
}
}
.dark-mode {
.bootstrap-switch {
border-color: $gray-600;
.bootstrap-switch-handle-off.bootstrap-switch-default,
.bootstrap-switch-handle-on.bootstrap-switch-default {
background-color: lighten($dark, 2.5%);
color: $white;
border-color: lighten($dark, 7.5%);
}
}
}

View File

@ -39,3 +39,12 @@
border-color: #{$color};
}
}
.dark-mode {
[class*="icheck-"] > input:first-child:not(:checked) {
+ input[type="hidden"] + label::before,
+ label::before {
border-color: $gray-600;
}
}
}

View File

@ -37,3 +37,29 @@
overflow: hidden;
position: relative;
}
.dark-mode {
.irs--flat .irs-line {
background-color: lighten($dark, 10%);
}
.jsgrid-edit-row > .jsgrid-cell,
.jsgrid-filter-row > .jsgrid-cell,
.jsgrid-grid-body, .jsgrid-grid-header,
.jsgrid-header-row > .jsgrid-header-cell,
.jsgrid-insert-row > .jsgrid-cell,
.jsgrid-row > .jsgrid-cell,
.jsgrid-alt-row > .jsgrid-cell {
border-color: $gray-600;
}
.jsgrid-header-row > .jsgrid-header-cell,
.jsgrid-row > .jsgrid-cell {
background-color: $dark;
}
.jsgrid-alt-row > .jsgrid-cell {
background-color: lighten($dark, 2.5%);
}
.jsgrid-selected-row > .jsgrid-cell {
background-color: lighten($dark, 5%);
}
}

View File

@ -272,3 +272,46 @@ select.form-control-sm ~ {
@each $name, $color in $colors {
@include select2-variant($name, $color);
}
.dark-mode {
.select2-selection {
background-color: $dark;
border-color: $gray-600;
}
.select2-container--disabled .select2-selection--single {
background-color: lighten($dark, 7.5%);
}
.select2-selection--single {
background-color: $dark;
border-color: $gray-600;
.select2-selection__rendered {
color: $white;
}
}
.select2-dropdown .select2-search__field,
.select2-search--inline .select2-search__field {
background-color: $dark;
border-color: $gray-600;
color: white;
}
.select2-dropdown {
background-color: $dark;
border-color: $gray-600;
color: white;
}
.select2-results__option[aria-selected="true"] {
background-color: lighten($dark, 5%) !important;
color: $gray-300;
}
.select2-container .select2-search--inline .select2-search__field {
background-color: transparent;
color: $white;
}
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
color: $white;
}
}

View File

@ -36,5 +36,16 @@
background-color: $success;
}
}
}
.dark-mode {
.swal2-popup {
background-color: $dark;
color: $gray-200;
.swal2-content,
.swal2-title {
color: $gray-200;
}
}
}

17
dist/js/demo.js vendored
View File

@ -223,9 +223,24 @@
$('.brand-link').removeClass('text-sm')
}
})
var $text_sm_brand_container = $('<div />', { class: 'mb-4' }).append($text_sm_brand_checkbox).append('<span>Brand small text</span>')
var $text_sm_brand_container = $('<div />', { class: 'mb-1' }).append($text_sm_brand_checkbox).append('<span>Brand small text</span>')
$container.append($text_sm_brand_container)
var $dark_mode_checkbox = $('<input />', {
type: 'checkbox',
value: 1,
checked: $('body').hasClass('dark-mode'),
class: 'mr-1'
}).on('click', function () {
if ($(this).is(':checked')) {
$('body').addClass('dark-mode')
} else {
$('body').removeClass('dark-mode')
}
})
var $dark_mode_container = $('<div />', { class: 'mb-4' }).append($dark_mode_checkbox).append('<span>Dark Mode</span>')
$container.append($dark_mode_container)
$container.append('<h6>Navbar Variants</h6>')
var $navbar_variants = $('<div />', {

View File

@ -4,7 +4,7 @@ layout: default
<div class="content-wrapper px-4 py-2">
<div class="content-header">
<h1 class="text-dark">{{ page.title }}</h1>
<h1>{{ page.title }}</h1>
</div>
<div class="content px-2">

View File

@ -112,6 +112,16 @@ The following colors are available:
##### Custom Range / Switch
For custom colored custom-checkbox & custom-radio you can add this classes:
- `.custom-control-input-*`
You can also change the look to outlined checkbox & radio with adding the `.custom-control-input-outline` on the custom control input.
For custom colored custom-range you can add this classes:
- `.custom-range-*`
For custom colored custom-range you can add this classes:
- `.custom-range-*`

View File

@ -462,6 +462,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="pages/kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -819,7 +827,7 @@
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">Dashboard</h1>
<h1 class="m-0">Dashboard</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="pages/kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -806,7 +814,7 @@
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">Dashboard v2</h1>
<h1 class="m-0">Dashboard v2</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
@ -1534,7 +1542,7 @@
<!-- /.row -->
</div>
<!-- /.card-body -->
<div class="card-footer bg-white p-0">
<div class="card-footer bg-light p-0">
<ul class="nav nav-pills flex-column">
<li class="nav-item">
<a href="#" class="nav-link">

View File

@ -458,6 +458,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="pages/kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -815,7 +823,7 @@
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">Dashboard v3</h1>
<h1 class="m-0">Dashboard v3</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -1287,6 +1295,26 @@
<!-- ./row -->
<div class="row">
<div class="col-md-6">
<!-- Buttons with Icons -->
<div class="card">
<div class="card-header">
<h3 class="card-title">Buttons with Icons</h3>
</div>
<div class="card-body row">
<div class="col-md-6">
<button type="button" class="btn btn-primary btn-block"><i class="fa fa-bell"></i> .btn-block</button>
<button type="button" class="btn btn-info btn-block btn-flat"><i class="fa fa-bell"></i> .btn-block .btn-flat</button>
<button type="button" class="btn btn-danger btn-block btn-sm"><i class="fa fa-bell"></i> .btn-block .btn-sm</button>
</div>
<div class="col-md-6">
<button type="button" class="btn btn-outline-primary btn-block"><i class="fa fa-bell"></i> .btn-block</button>
<button type="button" class="btn btn-outline-info btn-block btn-flat"><i class="fa fa-book"></i> .btn-block .btn-flat</button>
<button type="button" class="btn btn-outline-danger btn-block btn-sm"><i class="fa fa-book"></i> .btn-block .btn-sm</button>
</div>
</div>
</div>
<!-- /.card -->
<!-- Block buttons -->
<div class="card">
<div class="card-header">

View File

@ -491,6 +491,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -451,6 +451,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -453,6 +453,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -451,6 +451,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -952,7 +960,7 @@
<div class="row">
<div class="col-12 mt-3 text-center">
<p class="lead">
<a href="contact-us.html">Contact us</a>,
<a href="contact-us.html">Contact us</a>,
if you found not the right anwser or you have a other question?<br />
</p>
</div>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -460,6 +460,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -191,7 +191,7 @@
<!-- Sidebar -->
<div class="sidebar">
<!-- SidebarSearch Form -->
<div class="form-inline">
<div class="form-inline mt-2">
<div class="input-group" data-widget="sidebar-search">
<input class="form-control form-control-sidebar" type="search" placeholder="Search" aria-label="Search">
<div class="input-group-append">
@ -475,6 +475,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -450,6 +450,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -464,6 +464,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -454,6 +454,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -865,37 +873,50 @@
</div>
<!-- /.card -->
<!-- Form Element sizes -->
<div class="card card-success">
<!-- general form elements -->
<div class="card card-primary">
<div class="card-header">
<h3 class="card-title">Different Height</h3>
<h3 class="card-title">Different Styles</h3>
</div>
<!-- /.card-header -->
<div class="card-body">
<input class="form-control form-control-lg" type="text" placeholder=".form-control-lg">
<br>
<input class="form-control" type="text" placeholder="Default input">
<br>
<input class="form-control form-control-sm" type="text" placeholder=".form-control-sm">
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
<div class="card card-danger">
<div class="card-header">
<h3 class="card-title">Different Width</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-3">
<input type="text" class="form-control" placeholder=".col-3">
</div>
<div class="col-4">
<input type="text" class="form-control" placeholder=".col-4">
</div>
<div class="col-5">
<input type="text" class="form-control" placeholder=".col-5">
</div>
<h4>Input</h4>
<div class="form-group">
<label for="exampleInputBorder">Bottom Border only <code>.form-control-border</code></label>
<input type="text" class="form-control form-control-border" id="exampleInputBorder" placeholder=".form-control-border">
</div>
<div class="form-group">
<label for="exampleInputBorderWidth2">Bottom Border only 2px Border <code>.form-control-border.border-width-2</code></label>
<input type="text" class="form-control form-control-border border-width-2" id="exampleInputBorderWidth2" placeholder=".form-control-border.border-width-2">
</div>
<div class="form-group">
<label for="exampleInputRounded0">Flat <code>.rounded-0</code></label>
<input type="text" class="form-control rounded-0" id="exampleInputRounded0" placeholder=".rounded-0">
</div>
<h4>Custom Select</h4>
<div class="form-group">
<label for="exampleSelectBorder">Bottom Border only <code>.form-control-border</code></label>
<select class="custom-select form-control-border" id="exampleSelectBorder">
<option>Value 1</option>
<option>Value 2</option>
<option>Value 3</option>
</select>
</div>
<div class="form-group">
<label for="exampleSelectBorderWidth2">Bottom Border only <code>.form-control-border.border-width-2</code></label>
<select class="custom-select form-control-border border-width-2" id="exampleSelectBorderWidth2">
<option>Value 1</option>
<option>Value 2</option>
<option>Value 3</option>
</select>
</div>
<div class="form-group">
<label for="exampleSelectRounded0">Flat <code>.rounded-0</code></label>
<select class="custom-select rounded-0" id="exampleSelectRounded0">
<option>Value 1</option>
<option>Value 2</option>
<option>Value 3</option>
</select>
</div>
</div>
<!-- /.card-body -->
@ -1076,6 +1097,43 @@
<!--/.col (left) -->
<!-- right column -->
<div class="col-md-6">
<!-- Form Element sizes -->
<div class="card card-success">
<div class="card-header">
<h3 class="card-title">Different Height</h3>
</div>
<div class="card-body">
<input class="form-control form-control-lg" type="text" placeholder=".form-control-lg">
<br>
<input class="form-control" type="text" placeholder="Default input">
<br>
<input class="form-control form-control-sm" type="text" placeholder=".form-control-sm">
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
<div class="card card-danger">
<div class="card-header">
<h3 class="card-title">Different Width</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-3">
<input type="text" class="form-control" placeholder=".col-3">
</div>
<div class="col-4">
<input type="text" class="form-control" placeholder=".col-4">
</div>
<div class="col-5">
<input type="text" class="form-control" placeholder=".col-5">
</div>
</div>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
<!-- general form elements disabled -->
<div class="card card-warning">
<div class="card-header">
@ -1253,6 +1311,14 @@
<input class="custom-control-input" type="checkbox" id="customCheckbox3" disabled>
<label for="customCheckbox3" class="custom-control-label">Custom Checkbox disabled</label>
</div>
<div class="custom-control custom-checkbox">
<input class="custom-control-input custom-control-input-danger" type="checkbox" id="customCheckbox4" checked>
<label for="customCheckbox4" class="custom-control-label">Custom Checkbox with custom color</label>
</div>
<div class="custom-control custom-checkbox">
<input class="custom-control-input custom-control-input-danger custom-control-input-outline" type="checkbox" id="customCheckbox5" checked>
<label for="customCheckbox5" class="custom-control-label">Custom Checkbox with custom color outline</label>
</div>
</div>
</div>
<div class="col-sm-6">
@ -1270,6 +1336,14 @@
<input class="custom-control-input" type="radio" id="customRadio3" disabled>
<label for="customRadio3" class="custom-control-label">Custom Radio disabled</label>
</div>
<div class="custom-control custom-radio">
<input class="custom-control-input custom-control-input-danger" type="radio" id="customRadio4" name="customRadio2" checked>
<label for="customRadio4" class="custom-control-label">Custom Radio with custom color</label>
</div>
<div class="custom-control custom-radio">
<input class="custom-control-input custom-control-input-danger custom-control-input-outline" type="radio" id="customRadio5" name="customRadio2">
<label for="customRadio5" class="custom-control-label">Custom Radio with custom color outline</label>
</div>
</div>
</div>
</div>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

1030
pages/kanban.html Normal file

File diff suppressed because it is too large Load Diff

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -450,6 +450,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -450,6 +450,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -448,6 +448,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -493,6 +493,14 @@ scratch. This page gets rid of all links and provides the needed markup only.
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -850,7 +858,7 @@ scratch. This page gets rid of all links and provides the needed markup only.
<div class="container">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark"> Top Navigation <small>Example 3.0</small></h1>
<h1 class="m-0"> Top Navigation <small>Example 3.0</small></h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">

View File

@ -192,7 +192,7 @@ scratch. This page gets rid of all links and provides the needed markup only.
<div class="container">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark"> Top Navigation <small>Example 3.0</small></h1>
<h1 class="m-0"> Top Navigation <small>Example 3.0</small></h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -816,7 +824,7 @@
<div class="row">
<div class="col-md-10 offset-md-1">
<div class="row">
<div class="col-6">
<div class="col-6">
<div class="form-group">
<label>Result Type:</label>
<select class="select2" multiple="multiple" data-placeholder="Any" style="width: 100%;">
@ -826,7 +834,7 @@
</select>
</div>
</div>
<div class="col-3">
<div class="col-3">
<div class="form-group">
<label>Sort Order:</label>
<select class="select2" style="width: 100%;">
@ -835,7 +843,7 @@
</select>
</div>
</div>
<div class="col-3">
<div class="col-3">
<div class="form-group">
<label>Order By:</label>
<select class="select2" style="width: 100%;">
@ -936,6 +944,6 @@
$(function () {
$('.select2').select2()
});
</script>
</script>
</body>
</html>

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -809,7 +817,7 @@
<div class="row">
<div class="col-md-10 offset-md-1">
<div class="row">
<div class="col-6">
<div class="col-6">
<div class="form-group">
<label>Result Type:</label>
<select class="select2" multiple="multiple" data-placeholder="Any" style="width: 100%;">
@ -819,7 +827,7 @@
</select>
</div>
</div>
<div class="col-3">
<div class="col-3">
<div class="form-group">
<label>Sort Order:</label>
<select class="select2" style="width: 100%;">
@ -828,7 +836,7 @@
</select>
</div>
</div>
<div class="col-3">
<div class="col-3">
<div class="form-group">
<label>Order By:</label>
<select class="select2" style="width: 100%;">
@ -884,6 +892,6 @@
$(function () {
$('.select2').select2()
});
</script>
</script>
</body>
</html>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -871,7 +879,7 @@
</div>
</section>
</div>
<!-- Main footer -->
<footer class="main-footer">
<div class="float-right d-none d-sm-block">

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>
@ -821,7 +829,7 @@
</div>
</section>
</div>
<!-- Main footer -->
<footer class="main-footer">
<div class="float-right d-none d-sm-block">

View File

@ -451,6 +451,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -450,6 +450,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -447,6 +447,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="../kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -449,6 +449,14 @@
</p>
</a>
</li>
<li class="nav-item">
<a href="kanban.html" class="nav-link">
<i class="nav-icon fas fa-columns"></i>
<p>
Kanban Board
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon far fa-envelope"></i>

View File

@ -230,7 +230,7 @@ scratch. This page gets rid of all links and provides the needed markup only.
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">Starter Page</h1>
<h1 class="m-0">Starter Page</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">