Skip to content

T
Tabler

Dashboards / Tabler
11 个月 前同步成功

通知 0
Star 0
Fork 0
T
Tabler

体验新版 GitCode，发现更多精彩内容 >>

提交 2b24230d 编写于 作者: C codecalm 提交者： Alex Safian
浏览文件
操作

navigation refactoring

上级 b2d444a5
隐藏空白更改
内联 并排
Showing with 360 addition and 327 deletion
js/tabler.js
浏览文件 @ 2b24230d
require('./tabler/dropdowns');
const tabler = { const tabler = {
colorVariation: function(color, variation) { colorVariation: function(color, variation) {
const colorValue = this.colors[color]; const colorValue = this.colors[color];
......
js/tabler/dropdowns.js 已删除 100644 → 0
浏览文件 @ b2d444a5
'use strict';
(function(){
let dropdown = document.querySelectorAll('.dropup, .dropright, .dropdown, .dropleft'),
dropdownToggle = document.querySelectorAll('.dropdown-menu .dropdown-toggle');
})();
pages/_data/layouts.yml 0 → 100644
浏览文件 @ 2b24230d
- name: sidebar-left
title: Left sidebar
url: layout-navbar-left.html
- name: sidebar-right
title: Right sidebar
url: layout-navbar-right.html
- name: sidebar-dark
title: Dark sidebar
url: layout-navbar-dark.html
- name: sidebar-folded
title: Folded sidebar
url: layout-navbar-folded.html
- name: navbar-top
title: Navbar top
url: layout-navbar-top.html
- name: header-dark
title: Dark header
url: layout-header-dark.html
- name: header-sticky
title: Sticky header
url: layout-header-sticky.html
- name: dark-mode
title: Dark mode
url: layout-dark-mode.html
pages/_data/menu.yml
浏览文件 @ 2b24230d
...@@ -18,47 +18,10 @@ charts: ...@@ -18,47 +18,10 @@ charts:
title: Charts title: Charts
icon: pie-chart icon: pie-chart
level-1: layouts:
title: Level 1 title: Layouts
icon: menu
children:
level-2:
title: Level 2
children:
level-3:
title: Level 3
children:
level-4:
title: Level 4
layout:
title: Layout
icon: layout icon: layout
children: url: layouts.html
sidebar-left:
title: Left sidebar
url: layout-navbar-left.html
sidebar-right:
title: Right sidebar
url: layout-navbar-right.html
sidebar-white:
title: White sidebar
url: layout-navbar-white.html
sidebar-folded:
title: Folded sidebar
url: layout-navbar-folded.html
navbar-top:
title: Navbar top
url: layout-navbar-top.html
header-dark:
title: Dark header
url: layout-header-dark.html
header-sticky:
title: Sticky header
url: layout-header-sticky.html
dark-mode:
title: Dark mode
url: layout-dark-mode.html
docs: docs:
title: Documentation title: Documentation
......
pages/_includes/layout/layouts.html 0 → 100644
浏览文件 @ 2b24230d
<div class="card">
<div class="card-body">
{% for layout in site.data.layouts %}
<a href="{{ layout.url }}" class="d-block">
{{ layout.title }}
</a>
{% endfor %}
</div>
</div>
pages/_includes/layout/menu.html
浏览文件 @ 2b24230d
{% removeemptylines %} {% removeemptylines %}
{% assign side = false %}
<ul class="navbar-nav{% if include.class %} {{ include.class }}{% endif %}"> <ul class="navbar-nav{% if include.class %} {{ include.class }}{% endif %}">
{% assign current-page = page.menu | default: layout.menu | split: '.' %} {% assign current-page = page.menu | default: layout.menu | split: '.' %}
{% for level-1 in site.data.menu %} {% for level-1 in site.data.menu %}
{% assign icon = level-1[1].icon %} {% assign icon = level-1[1].icon %}
<li class="nav-item{% if level-1[0] == current-page[0] %} active{% endif %}{% if level-1[1].children or level-1[1].docs %} dropdown{% endif %}"> <li
<a class="nav-link{% if level-1[1].children or level-1[1].docs %} dropdown-toggle{% endif %}" {% if level-1[1].children or level-1[1].docs %}href="#sidebar-{{ level-1[0] }}" data-toggle="dropdown" role="button" aria-expanded="{% if level-1[0] == current-page[0] %}true{% else %}false{% endif %}"{% elsif level-1[1].toggle %}href="{{ level-1[1].url }}" data-toggle="{{ level-1[1].toggle }}"{% else %}href="{{ site.base }}/{{ level-1[1].url }}"{% endif %}> class="nav-item{% if level-1[0] == current-page[0] %} active{% endif %}{% if level-1[1].children or level-1[1].docs %} {% if side %}dropright{% else %}dropdown{% endif %}{% endif %}">
<a class="nav-link{% if level-1[1].children or level-1[1].docs %} dropdown-toggle{% endif %}" {% if
level-1[1].children or level-1[1].docs %}href="#sidebar-{{ level-1[0] }}" data-toggle="dropdown" role="button"
aria-expanded="{% if level-1[0] == current-page[0] %}true{% else %}false{% endif %}" {% elsif level-1[1].toggle
%}href="{{ level-1[1].url }}" data-toggle="{{ level-1[1].toggle }}" {% else
%}href="{{ site.base }}/{{ level-1[1].url }}" {% endif %}>
<span class="nav-icon"> <span class="nav-icon">
{% include ui/icon.html icon=icon %} {% include ui/icon.html icon=icon %}
</span> </span>
...@@ -20,75 +26,36 @@ ...@@ -20,75 +26,36 @@
</span> </span>
</a> </a>
{% if level-1[1].children or level-1[1].docs %} {% if level-1[1].children or level-1[1].docs %}
<ul class="dropdown-menu"> <div class="dropdown-menu">
{% if level-1[1].docs %} {% if level-1[1].docs %}
{% for d in site.data.docs %} {% for d in site.data.docs %}
{% assign doc = site.docs | where: "slug", d.page | first %} {% assign doc = site.docs | where: "slug", d.page | first %}
{% if doc %} {% if doc %}
<li class="nav-item{% if current-page[0] == 'docs' and current-page[1] == doc.slug %} active{% endif %}{% if level-1[1].children %} dropdown{% endif %}"> <a class="dropdown-item{% if current-page[0] == 'docs' and current-page[1] == doc.slug %} active{% endif %}{% if level-1[1].children %} dropdown{% endif %}">
<a href="{{ site.base }}/docs/{{ doc.slug }}.html" class="nav-link"> <span class="nav-text">
<span class="nav-text"> {{ doc.title }}
{{ doc.title }}
{% if doc.new %} {% if doc.new %}
<span class="badge bg-primary text-white ml-auto text-uppercase">new</span> <span class="badge bg-primary text-white ml-auto text-uppercase">new</span>
{% endif %} {% endif %}
</span> </span>
</a> </a>
</li>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% for level-2 in level-1[1].children %} {% for level-2 in level-1[1].children %}
<li class="nav-item{% if level-2[0] == current-page[1] %} active{% endif %}{% if level-2[1].children %} dropdown{% endif %}"> <a class="dropdown-item" {% if level-2[1].children %}href="#sidebar-{{ level-2[0] }}" data-toggle="dropdown" role="button" aria-expanded="false" {% else %}href="{{ site.base }}/{{ level-2[1].url }}" {% endif %}>
<a class="nav-link" {% if level-2[1].children %}href="#sidebar-{{ level-2[0] }}" data-toggle="dropdown" role="button" aria-expanded="false"{% else %}href="{{ site.base }}/{{ level-2[1].url }}"{% endif %}> <span class="nav-text">
<span class="nav-text"> {{ level-2[1].title }}
{{ level-2[1].title }} {% if level-2[1].label %}
{% if level-2[1].label %} <span class="badge bg-{{ level-2[1].label-color | default: 'primary' }} text-white ml-auto">{{ level-2[1].label }}</span>
<span class="badge bg-{{ level-2[1].label-color | default: 'primary' }} text-white ml-auto">{{ level-2[1].label }}</span> {% endif %}
{% endif %} </span>
</span> </a>
</a>
{% if level-2[1].children %}
<ul class="dropdown-menu">
{% for level-3 in level-2[1].children %}
<li class="nav-item{% if level-3[0] == current-page[2] %} active{% endif %}">
<a class="nav-link" {% if level-3[1].children %}href="#sidebar-{{ level-3[0] }}" data-toggle="dropdown" role="button" aria-expanded="false"{% else %}href="{{ site.base }}/{{ level-3[1].url }}"{% endif %}>
<span class="nav-text">
{{ level-3[1].title }}
{% if level-3[1].label %}
<span class="badge bg-{{ level-3[1].label-color | default: 'primary' }} text-white ml-auto">{{ level-3[1].label }}</span>
{% endif %}
</span>
</a>
{% if level-3[1].children %}
<div class="navbar-subnav collapse">
<ul class="nav nav-sm flex-column">
{% for level-4 in level-3[1].children %}
<li class="nav-item{% if level-4[0] == current-page[3] %} active{% endif %}">
<a class="nav-link" href="{% if level-4[1].url %}{{ site.base }}/{{ level-4[1].url }}{% else %}#{% endif %}">
<span class="nav-text">
{{ level-4[1].title }}
{% if level-4[1].label %}
<span class="badge bg-{{ level-4[1].label-color | default: 'primary' }} text-white ml-auto">{{ level-4[1].label }}</span>
{% endif %}
</span>
</a>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %} {% endfor %}
</ul> </div>
{% endif %} {% endif %}
</li> </li>
{% endfor %} {% endfor %}
......
pages/_includes/layout/sidenav-content.html
浏览文件 @ 2b24230d
{% assign id = 0 | random_id %} {% assign id = 0 | random_id %}
<div class="pb-3"> <a href="{{ site.base }}" class="navbar-brand">
<a href="{{ site.base }}" class="navbar-brand text-reset"> <img src="{{ site.base }}/img/logo{% if include.dark %}-white{% endif %}.svg" alt="" class="hide-navbar-folded navbar-brand-logo">
<img src="{{ site.base }}/img/logo{% if include.white %}-white{% endif %}.svg" alt="" class="hide-navbar-folded navbar-brand-logo"> <img src="{{ site.base }}/img/logo-small{% if include.dark %}-white{% endif %}.svg" alt="" class="hide-navbar-expanded navbar-brand-logo">
<img src="{{ site.base }}/img/logo-small{% if include.white %}-white{% endif %}.svg" alt="" class="hide-navbar-expanded navbar-brand-logo"> </a>
</a>
</div>
<div class="flex-fill"> <div class="flex-fill">
<h6 class="navbar-heading"> <h6 class="navbar-heading">Docs</h6>
Docs
</h6>
{% include layout/menu.html menu=include.menu class="mb-md-4" %} {% include layout/menu.html menu=include.menu class="mb-md-4" %}
<h6 class="navbar-heading"> <h6 class="navbar-heading">Other</h6>
Other
</h6>
</div> </div>
......
pages/_includes/layout/sidenav.html
浏览文件 @ 2b24230d
{% assign menu = page.menu | default: layout.menu %} {% assign menu = page.menu | default: layout.menu %}
<aside class="navbar navbar-side{% if include.dark %} navbar-dark{% endif %}{% if include.fixed %} navbar-fixed{% endif %}{% if include.right %} navbar-right{% endif %}{% if include.folded %} navbar-folded{% endif %} js-sidebar"> <aside class="navbar navbar-side {% if include.dark %}navbar-dark bg-dark text-white{% else %}navbar-light{% endif %}{% if include.fixed %} navbar-fixed{% endif %}{% if include.right %} navbar-right{% endif %}{% if include.folded %} navbar-folded{% endif %} js-sidebar" id="sidebar">
{% unless include.empty %} {% unless include.empty %}
{% include layout/sidenav-content.html menu=menu %} {% include layout/sidenav-content.html menu=menu dark=include.dark %}
{% endunless %} {% endunless %}
</aside> </aside>
<div class="navbar-bg"></div>
pages/_includes/layout/topnav.html
浏览文件 @ 2b24230d
<header class="navbar navbar-expand-lg {% if include.dark %}navbar-dark{% else %}navbar-light{% endif %}{% if include.sticky %} navbar-sticky{% endif %}"> <header class="navbar navbar-expand-lg {% if include.dark %}navbar-dark bg-dark text-white{% else %}navbar-light{% endif %}{% if include.sticky %} navbar-sticky{% endif %}">
<div class="container{% if include.fluid %} container-fluid{% endif %}"> <div class="container{% if include.fluid %} container-fluid{% endif %}">
{% include parts/navbar.html logo=true search=true user-menu=1 person=1 dark=include.dark notifications=true %} {% include parts/navbar.html logo=true search=true user-menu=1 person=1 dark=include.dark notifications=true %}
</div> </div>
......
pages/_layouts/default.html
浏览文件 @ 2b24230d
...@@ -2,13 +2,14 @@ ...@@ -2,13 +2,14 @@
layout: base layout: base
--- ---
<div class="d-flex flex-row h-100p"> <div class="layout d-flex flex-row vh-100">
{% comment %}{% include layout/sidenav.html dark=true folded=false fixed=true %}{% endcomment %} {% if page.nav-side %}
{% include layout/sidenav.html dark=page.nav-dark folded=page.nav-folded fixed=page.nav-fixed right=page.nav-right %}
{% endif %}
<div class="layout-main d-flex flex-column flex-fill max-w-full"> <div class="layout-main d-flex flex-column flex-fill max-w-full">
{% unless page.nav-side %}
{% include layout/topnav.html dark=page.header-dark sticky=page.header-sticky %} {% include layout/topnav.html dark=page.header-dark sticky=page.header-sticky %}
{% unless page.nav-position == 'left' or page.nav-position == 'right'%}
{% include layout/topmenu.html %} {% include layout/topmenu.html %}
{% endunless %} {% endunless %}
......
pages/layout-dark-mode.html
浏览文件 @ 2b24230d
...@@ -2,5 +2,7 @@ ...@@ -2,5 +2,7 @@
title: Dark mode title: Dark mode
dark-theme: true dark-theme: true
page-title: Dashboard page-title: Dashboard
menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-header-dark.html
浏览文件 @ 2b24230d
...@@ -2,5 +2,7 @@ ...@@ -2,5 +2,7 @@
title: Dark header title: Dark header
header-dark: true header-dark: true
page-title: Dashboard page-title: Dashboard
menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-header-sticky.html
浏览文件 @ 2b24230d
...@@ -3,5 +3,7 @@ title: Sticky header ...@@ -3,5 +3,7 @@ title: Sticky header
menu: layout.header-sticky menu: layout.header-sticky
page-title: Dashboard page-title: Dashboard
header-sticky: true header-sticky: true
menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-navbar-white.html → pages/layout-navbar-dark.html
浏览文件 @ 2b24230d
--- ---
title: Sidebar white title: Sidebar white
menu: layout.sidebar-white menu: layout.sidebar-white
nav-position: left nav-side: true
nav-dark: true
page-title: Dashboard page-title: Dashboard
menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-navbar-folded.html
浏览文件 @ 2b24230d
--- ---
title: Folded sidebar title: Folded sidebar
menu: layout.sidebar-folded menu: layout.sidebar-folded
nav-position: left nav-side: true
nav-folded: true
nav-dark: true
page-title: Dashboard page-title: Dashboard
sidenav-folded: true menu: layouts
sidenav-dark: true
--- ---
{% include layout/layouts.html %}
pages/layout-navbar-left.html
浏览文件 @ 2b24230d
--- ---
title: Sidebar left title: Sidebar left
menu: layout.sidebar-left menu: layout.sidebar-left
nav-position: left nav-side: true
page-title: Dashboard page-title: Dashboard
sidenav-dark: true menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-navbar-right.html
浏览文件 @ 2b24230d
--- ---
title: Sidebar right title: Sidebar right
menu: layout.sidebar-right menu: layout.sidebar-right
nav-position: right nav-side: true
nav-right: true
page-title: Dashboard page-title: Dashboard
sidenav-dark: true menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layout-navbar-top.html
浏览文件 @ 2b24230d
--- ---
title: Navbar top title: Navbar top
page-title: Dashboard page-title: Dashboard
menu: layouts
--- ---
{% include layout/layouts.html %}
pages/layouts.html 0 → 100644
浏览文件 @ 2b24230d
---
page-title: Page Layouts
menu: layouts
---
{% include layout/layouts.html %}
scss/layout/_navbar.scss
浏览文件 @ 2b24230d
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
border-bottom: 1px solid; border-bottom: 1px solid;
background-color: $navbar-bg; background-color: $navbar-bg;
border-color: $navbar-border-color; border-color: $navbar-border-color;
min-height: 4rem;
} }
/** /**
...@@ -25,7 +26,7 @@ Navbar logo ...@@ -25,7 +26,7 @@ Navbar logo
.nav-item.active .nav-link { .nav-item.active .nav-link {
position: relative; position: relative;
&:before { &:after {
content: ''; content: '';
position: absolute; position: absolute;
...@@ -107,98 +108,176 @@ Navbar logo ...@@ -107,98 +108,176 @@ Navbar logo
// border: 0; // border: 0;
//} //}
// //
///*
//Sidebar $navbar-side-padding-x: 1rem;
// */ $navbar-side-padding-y: 1rem;
//.navbar-side { $navbar-active-color: $primary;
// flex-direction: column;
// flex-wrap: nowrap; /*
// align-items: inherit; Sidebar
// justify-content: start; */
// width: $sidenav-width; .navbar-side {
// min-width: $sidenav-width; flex-direction: column;
// margin: 0; flex-wrap: nowrap;
// overflow: auto; align-items: inherit;
// pointer-events: inherit; justify-content: start;
// user-select: none; width: $sidenav-width;
// background: $sidenav-bg; min-width: $sidenav-width;
// border-right: 1px solid $sidenav-border-color; margin: 0;
// overflow: auto;
// .nav { pointer-events: inherit;
// flex-direction: column; user-select: none;
// } background: $sidenav-bg;
// padding: $navbar-side-padding-y $navbar-side-padding-x;
// .nav-link {
// display: flex; box-shadow: 1px 0 $sidenav-border-color;
// align-items: center;
// height: 2.5rem; .navbar-brand {
// padding: 0 $navbar-padding-x; text-align: center;
// color: $text-muted; padding: 0;
// box-shadow: inset 2px 0 0 0 transparent; margin: 0 0 1.5rem;
// transition: .3s background, .3s box-shadow; display: block;
// }
// &[aria-expanded="true"],
// &:hover { .navbar-nav {
// background: rgba($link-color, .04); flex-direction: column;
// border-color: $primary; margin-left: -$navbar-side-padding-y;
// box-shadow: inset 2px 0 0 0 $primary; margin-right: -$navbar-side-padding-y;
// }
// .nav-link {
// > .icon { padding: .5rem $navbar-side-padding-y;
// width: 2rem; }
// }
// .nav-item.active .nav-link {
// &[data-toggle="collapse"] { box-shadow: inset 2px 0 $navbar-active-color;
// &::after { background: rgba($navbar-active-color, .04);
// display: block;
// margin-left: auto; &:after {
// font-family: $font-icons !important; content: none;
// content: ""; }
// transition: transform .3s; }
// } }
//
// &[aria-expanded="true"]::after { .nav-icon {
// transform: rotate(-180deg); width: 1.5rem;
// } }
// }
// } /*
// Right navbar
// &:not(.navbar-folded) { */
// &[data-toggle="collapse"][aria-expanded="true"] { &.navbar-right {
// background: none; order: 9;
// box-shadow: none; box-shadow: -1px 0 $sidenav-border-color;
// } }
// }
// /*
// &:not(.hide-navbar-folded) { Folded navbar
// //.nav-item .nav-item .nav-link { */
// // padding-left: 2.5rem; &.navbar-folded {
// //} width: $sidenav-folded-width;
// // min-width: $sidenav-folded-width;
// //.nav-item .nav-item .nav-item .nav-link {
// // padding-left: 3.5rem; .navbar-heading {
// //} display: none;
// // }
// //.nav-item .nav-item .nav-item .nav-item .nav-link {
// // padding-left: 4.5rem; .nav-text {
// //} display: none;
// } }
//
// .navbar-brand { .nav-icon {
// height: 2.5rem; margin: .25rem 0;
// text-align: center; width: 100%;
// } font-size: 1.125rem;
//
// .navbar-heading { .icon {
// @include subheader; margin: 0 auto;
// margin: 0 0 .5rem; stroke-width: 1.5;
// } }
// }
// .navbar-nav { }
// flex-direction: column;
// } .navbar-heading {
//} @include subheader;
// margin: 0 0 .5rem;
}
.nav-link {
}
// .nav {
// flex-direction: column;
// }
//
// .nav-link {
// display: flex;
// align-items: center;
// height: 2.5rem;
// padding: 0 $navbar-padding-x;
// color: $text-muted;
// box-shadow: inset 2px 0 0 0 transparent;
// transition: .3s background, .3s box-shadow;
//
// &[aria-expanded="true"],
// &:hover {
// background: rgba($link-color, .04);
// border-color: $primary;
// box-shadow: inset 2px 0 0 0 $primary;
// }
//
// > .icon {
// width: 2rem;
// }
//
// &[data-toggle="collapse"] {
// &::after {
// display: block;
// margin-left: auto;
// font-family: $font-icons !important;
// content: "";
// transition: transform .3s;
// }
//
// &[aria-expanded="true"]::after {
// transform: rotate(-180deg);
// }
// }
// }
//
// &:not(.navbar-folded) {
// &[data-toggle="collapse"][aria-expanded="true"] {
// background: none;
// box-shadow: none;
// }
// }
//
// &:not(.hide-navbar-folded) {
// //.nav-item .nav-item .nav-link {
// // padding-left: 2.5rem;
// //}
// //
// //.nav-item .nav-item .nav-item .nav-link {
// // padding-left: 3.5rem;
// //}
// //
// //.nav-item .nav-item .nav-item .nav-item .nav-link {
// // padding-left: 4.5rem;
// //}
// }
//
// .navbar-brand {
// height: 2.5rem;
// text-align: center;
// }
//
//
// .navbar-nav {
// flex-direction: column;
// }
}
///* ///*
//Fixed navbar //Fixed navbar
// */ // */
...@@ -208,17 +287,6 @@ Navbar logo ...@@ -208,17 +287,6 @@ Navbar logo
// bottom: 0; // bottom: 0;
// z-index: $zindex-sticky; // z-index: $zindex-sticky;
// //
// + .navbar-bg {
// position: fixed;
// top: 0;
// right: 0;
// bottom: 0;
// left: 0;
// z-index: $zindex-dropdown;
// display: none;
// background: rgba($dark, .2);
// }
//
// &.navbar-side { // &.navbar-side {
// top: 0; // top: 0;
// bottom: 0; // bottom: 0;
...@@ -267,16 +335,7 @@ Navbar logo ...@@ -267,16 +335,7 @@ Navbar logo
// } // }
// } // }
//} //}
//
///*
//Right navbar
// */
//.navbar-right {
// order: 9;
// border-right: none;
// border-left: 1px solid $sidenav-border-color;
//}
//
///* ///*
//Dark navbar //Dark navbar
// */ // */
...@@ -309,89 +368,89 @@ Navbar logo ...@@ -309,89 +368,89 @@ Navbar logo
// left: 0; // left: 0;
// } // }
//} //}
//
///** /**
//Folded navbar Folded navbar
// */ */
//.navbar-folded { //.navbar-folded {
// width: $sidenav-folded-width; // width: $sidenav-folded-width;
// min-width: $sidenav-folded-width; // min-width: $sidenav-folded-width;
// //
// .navbar-brand { // .navbar-brand {
// width: 2.5rem; // width: 2.5rem;
// } // }
// //
// .navbar-heading { // .navbar-heading {
// display: none; // display: none;
// } // }
// //
// .nav-text { // .nav-text {
// display: none; // display: none;
// } // }
// //
// .nav-link { // .nav-link {
// justify-content: center; // justify-content: center;
// padding-top: 0; // padding-top: 0;
// padding-bottom: 0; // padding-bottom: 0;
// //
// &[data-toggle="collapse"]::after { // &[data-toggle="collapse"]::after {
// content: none; // content: none;
// } // }
// } // }
// //
// .nav-icon { // .nav-icon {
// justify-content: center; // justify-content: center;
// opacity: 1; // opacity: 1;
// } // }
// //
// .navbar-subnav { // .navbar-subnav {
// position: absolute; // position: absolute;
// top: 0; // top: 0;
// left: 100%; // left: 100%;
// background: #fff; // background: #fff;
// //
// .nav-text { // .nav-text {
// display: block; // display: block;
// } // }
// //
// .nav-link { // .nav-link {
// color: $body-color; // color: $body-color;
// } // }
// } // }
//} //}
// //
//.nav-icon { //.nav-icon {
// display: flex; // display: flex;
// flex-shrink: 0; // flex-shrink: 0;
// align-items: center; // align-items: center;
// width: 1.5rem; // width: 1.5rem;
// font-size: px2rem(15px); // font-size: px2rem(15px);
// border-radius: 100%; // border-radius: 100%;
// opacity: .8; // opacity: .8;
// //
// .icon { // .icon {
// font-size: inherit; // font-size: inherit;
// } // }
//} //}
//
//.nav-text { //.nav-text {
// display: flex; // display: flex;
// align-items: center; // align-items: center;
// width: 100%; // width: 100%;
//} //}
//
///** /**
//Utils Utils
// */ */
//.hide-navbar-folded { .hide-navbar-folded {
// @at-root .navbar-side.navbar-folded & { @at-root .navbar-side.navbar-folded & {
// display: none; display: none;
// } }
//} }
//
//.hide-navbar-expanded { .hide-navbar-expanded {
// @at-root .navbar-side:not(.navbar-folded) & { @at-root .navbar-side:not(.navbar-folded) & {
// display: none; display: none;
// } }
//} }
//
scss/ui/_nav.scss
浏览文件 @ 2b24230d
...@@ -43,6 +43,10 @@ ...@@ -43,6 +43,10 @@
font-size: 1rem; font-size: 1rem;
line-height: 1; line-height: 1;
margin-right: .25rem; margin-right: .25rem;
.icon {
display: block;
}
} }
.nav-link { .nav-link {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或