Skip to content

A
AdminLTE

知鸟1号 / AdminLTE
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 0
Fork 0
A
AdminLTE

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

提交 c6667c6b 编写于 作者: A Abdullah Almsaeed
浏览文件
操作

Adjusted skins and main-header to function with BS4

上级 7b67b58d
展开全部 隐藏空白更改
内联 并排
Showing with 670 addition and 338 deletion
build/scss/AdminLTE.scss
浏览文件 @ c6667c6b
......@@ -62,3 +62,7 @@
// -------------
@import "miscellaneous";
@import "print";
// Skins
// -----
@import "skins/all-skins";
\ No newline at end of file
build/scss/_boxes.scss
浏览文件 @ c6667c6b
......@@ -28,7 +28,7 @@
border-top-color: $green;
}
&.box-default {
border-top-color: $gray;
border-top-color: $box-default-border-top-color;
}
// collapsed mode
......@@ -224,10 +224,10 @@
padding: 5px;
font-size: 12px;
background: transparent;
color: darken($box-default-border-top-color, 20%);
color: $gray-light;
.open &,
&:hover {
color: darken($box-default-border-top-color, 40%);
color: $gray;
}
&.btn:active {
box-shadow: none;
......
build/scss/_core.scss
浏览文件 @ c6667c6b
......@@ -13,8 +13,6 @@ body {
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 400;
overflow-x: hidden;
overflow-y: auto;
}
......@@ -35,7 +33,7 @@ body {
}
.layout-boxed {
background: url('${boxed-layout-bg-image-path}') repeat fixed;
background: url('#{$boxed-layout-bg-image-path}') repeat fixed;
}
/*
......@@ -75,7 +73,7 @@ transition: transform $transition-rule;
.content-wrapper,
.right-side {
min-height: 100%;
background-color: $body-bg;
background-color: $main-bg;
z-index: 800;
}
......@@ -83,7 +81,7 @@ transition: transform $transition-rule;
background: #fff;
padding: 15px;
color: #444;
border-top: 1px solid $gray;
border-top: 1px solid $gray-lighter;
}
/* Fixed layout */
......
build/scss/_header.scss
浏览文件 @ c6667c6b
......@@ -4,244 +4,5 @@
*/
.main-header {
position: relative;
max-height: 100px;
z-index: 1030;
//Navbar
> .navbar {
transition: margin-left $transition-speed $transition-fn;
margin-bottom: 0;
margin-left: $sidebar-width;
border: none;
padding: $navbar-padding-vertical $navbar-padding-horizontal;
border-radius: 0;
.layout-top-nav & {
margin-left: 0;
}
}
//Navbar search text input
#navbar-search-input.form-control {
background: rgba(255, 255, 255, 0.2);
border-color: transparent;
&:focus,
&:active {
border-color: rgba(0, 0, 0, 1);
background: rgba(255, 255, 255, 1);
}
&::-moz-placeholder {
color: #ccc;
opacity: 1;
}
&:-ms-input-placeholder {
color: #ccc;
}
&::-webkit-input-placeholder {
color: #ccc;
}
}
//Navbar Right Menu
.navbar-custom-menu,
.navbar-right {
float: right;
@media (max-width: map-get($grid-breakpoints, sm)) {
a {
color: inherit;
background: transparent;
}
}
}
.navbar-right {
@media (max-width: $screen-header-collapse) {
float: none;
.navbar-collapse & {
margin: 7.5px -15px;
}
> li {
color: inherit;
border: 0;
}
}
}
//Navbar toggle button
.sidebar-toggle {
float: left;
background-color: transparent;
background-image: none;
padding: $navbar-padding-vertical $navbar-padding-horizontal;
//Add the fontawesome bars icon
font-family: fontAwesome;
&:before {
content: "\f0c9";
}
&:hover {
color: #fff;
}
&:focus,
&:active {
background: transparent;
}
}
.sidebar-toggle .icon-bar {
display: none;
}
//Navbar User Menu
.navbar .nav > li.user > a {
> .fa,
> .glyphicon,
> .ion {
margin-right: 5px;
}
}
//Labels in navbar
.navbar .nav > li > a > .label {
position: absolute;
top: 9px;
right: 7px;
text-align: center;
font-size: 9px;
padding: 2px 3px;
line-height: 9px;
}
//Logo bar
.logo {
transition: width $transition-speed $transition-fn;
display: block;
float: left;
font-size: 20px;
line-height: 50px;
text-align: center;
width: $sidebar-width;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: $navbar-padding-vertical $navbar-padding-horizontal;
font-weight: 300;
overflow: hidden;
//Add support to sidebar mini by allowing the user to create
//2 logo designs. mini and lg
.logo-lg {
//should be visibile when sidebar isn't collapsed
display: block;
}
.logo-mini {
display: none;
}
}
//Navbar Brand. Alternative logo with layout-top-nav
.navbar-brand {
color: #fff;
}
}
// Content Header
.content-header {
position: relative;
padding: 15px 15px 0 15px;
// Header Text
> h1 {
margin: 0;
font-size: 24px;
> small {
font-size: 15px;
display: inline-block;
padding-left: 4px;
font-weight: 300;
}
}
> .breadcrumb {
float: right;
background: transparent;
margin-top: 0;
margin-bottom: 0;
font-size: 12px;
padding: 7px 5px;
position: absolute;
top: 15px;
right: 10px;
@include border-radius(2px);
> li > a {
color: #444;
text-decoration: none;
display: inline-block;
> .fa, > .glyphicon, > .ion {
margin-right: 5px;
}
}
> li + li:before {
content: '>\00a0';
}
}
@media (max-width: map-get($grid-breakpoints, sm)) {
> .breadcrumb {
position: relative;
margin-top: 5px;
top: 0;
right: 0;
float: none;
background: $gray;
padding-left: 10px;
li:before {
color: darken($gray, 20%);
}
}
}
}
.navbar-toggle {
color: #fff;
border: 0;
margin: 0;
padding: $navbar-padding-vertical $navbar-padding-horizontal;
}
//Control navbar scaffolding on x-small screens
@media (max-width: map-get($grid-breakpoints, sm)) {
.navbar-custom-menu .navbar-nav > li {
float: left;
}
//Dont't let links get full width
.navbar-custom-menu .navbar-nav {
margin: 0;
float: left;
}
.navbar-custom-menu .navbar-nav > li > a {
padding-top: 15px;
padding-bottom: 15px;
line-height: 20px;
}
}
// Collapse header
@media (max-width: $screen-header-collapse) {
.main-header {
position: relative;
.logo,
.navbar {
width: 100%;
float: none;
}
.navbar {
margin: 0;
}
.navbar-custom-menu {
float: right;
}
}
}
.navbar-collapse.pull-left {
@media (max-width: map-get($grid-breakpoints, sm)) {
float: none !important;
+ .navbar-custom-menu {
display: block;
position: absolute;
top: 0;
right: 40px;
}
}
}
}
\ No newline at end of file
build/scss/_mixins.scss
浏览文件 @ c6667c6b
......@@ -174,7 +174,7 @@
}
input[type="text"] {
color: #666;
@include border-radius(2px, 0, 2px, 0);
@include border-radius-sides(2px, 0, 2px, 0);
&:focus, &:focus + .input-group-btn .btn {
background-color: #fff;
color: #666;
......@@ -185,7 +185,7 @@
}
.btn {
color: #999;
@include border-radius(0, 2px, 0, 2px);
@include border-radius-sides(0, 2px, 0, 2px);
}
}
}
......@@ -279,7 +279,7 @@
}
input[type="text"] {
color: #666;
@include border-radius(2px, 0, 2px, 0);
@include border-radius-sides(2px, 0, 2px, 0);
&:focus,
&:focus + .input-group-btn .btn {
background-color: #fff;
......@@ -291,7 +291,7 @@
}
.btn {
color: #999;
@include border-radius(0, 2px, 0, 2px);
@include border-radius-sides(0, 2px, 0, 2px);
}
}
@media (min-width: map-get($grid-breakpoints, sm)) {
......
build/scss/_navs.scss
浏览文件 @ c6667c6b
......@@ -8,7 +8,7 @@
> li > a:active,
> li > a:focus {
color: #444;
background: #f7f7f7;
//background: #f7f7f7;
}
}
......
build/scss/_variables.scss
浏览文件 @ c6667c6b
......@@ -28,7 +28,7 @@ $fuchsia: #F012BE;
$purple: #605ca8;
$maroon: #D81B60;
$black: #111;
$gray: #d2d6de;
//$gray: #d2d6de;
//LAYOUT
//--------------------------------------------------------
......@@ -40,12 +40,12 @@ $boxed-layout-max-width: 1024px;
//When the logo should go to the top of the screen
$screen-header-collapse: map-get($grid-breakpoints, xs);
//Link colors (Aka: <a> tags)
//Link colors (aka: <a> tags)
$link-color: $light-blue;
$link-hover-color: lighten($link-color, 15%);
//Body background (Affects main content background only)
$body-bg: #ecf0f5;
$main-bg: #ecf0f5;
//SIDEBAR SKINS
//--------------------------------------------------------
......@@ -81,7 +81,7 @@ $box-boxshadow: 0 1px 1px rgba(0, 0, 0, 0.125);
$box-padding: 10px;
//Box variants
$box-default-border-top-color: #d2d6de;
$box-default-border-top-color: $gray-light;//#d2d6de;
//BUTTONS
//--------------------------------------------------------
......@@ -118,6 +118,5 @@ $attachment-border-radius: 3px;
//--------------------------------------------------------
//Transition global options
$transition-speed: 3s;
$transition-fn: ease-in-out;
//cubic-bezier(0.32,1.25,0.375,1.15);
$transition-speed: 0.3s;
$transition-fn: ease-in-out;
\ No newline at end of file
build/scss/skins/_all-skins.scss
浏览文件 @ c6667c6b
//All skins in one file
@import "skin-blue.less";
@import "skin-blue-light.less";
@import "skin-black.less";
@import "skin-black-light.less";
@import "skin-green.less";
@import "skin-green-light.less";
@import "skin-red.less";
@import "skin-red-light.less";
@import "skin-yellow.less";
@import "skin-yellow-light.less";
@import "skin-purple.less";
@import "skin-purple-light.less";
@import "skin-blue";
@import "skin-blue-light";
@import "skin-black";
@import "skin-black-light";
@import "skin-green";
@import "skin-green-light";
@import "skin-red";
@import "skin-red-light";
@import "skin-yellow";
@import "skin-yellow-light";
@import "skin-purple";
@import "skin-purple-light";
build/scss/skins/skin-black-light.scss
浏览文件 @ c6667c6b
......@@ -2,10 +2,6 @@
* Skin: Black
* -----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
/* skin-black navbar */
.skin-black-light {
......@@ -20,7 +16,7 @@
border-right: 1px solid #eee;
}
> .navbar {
@include navbar-variant(#fff; #333; #999; #fff);
@include navbar-variant(#fff, #333, #999, #fff);
> .sidebar-toggle {
color: #333;
border-right: 1px solid #eee;
......@@ -41,10 +37,10 @@
}
}
> .logo {
@include logo-variant(#fff; #333);
@include logo-variant(#fff, #333);
border-right: 1px solid #eee;
@media (max-width: $screen-header-collapse) {
@include logo-variant(#222; #fff);
@include logo-variant(#222, #fff);
border-right: none;
}
}
......
build/scss/skins/skin-black.scss
浏览文件 @ c6667c6b
......@@ -2,10 +2,6 @@
* Skin: Black
* -----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
/* skin-black navbar */
.skin-black {
......@@ -20,7 +16,7 @@
border-right: 1px solid #eee;
}
> .navbar {
@include navbar-variant(#fff; #333; #999; #fff);
@include navbar-variant(#fff, #333, #999, #fff);
> .sidebar-toggle {
color: #333;
border-right: 1px solid #eee;
......@@ -41,10 +37,10 @@
}
}
> .logo {
@include logo-variant(#fff; #333);
@include logo-variant(#fff, #333);
border-right: 1px solid #eee;
@media (max-width: $screen-header-collapse) {
@include logo-variant(#222; #fff);
@include logo-variant(#222, #fff);
border-right: none;
}
}
......
build/scss/skins/skin-blue-light.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Blue
* ----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-blue-light {
//Navbar
.main-header {
.navbar {
@include navbar-variant($light-blue; #fff);
@include navbar-variant($light-blue, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-blue.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,11 @@
* Skin: Blue
* ----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-blue {
//Navbar
.main-header {
.navbar {
@include navbar-variant($light-blue; #fff);
@include navbar-variant($light-blue, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-green-light.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Green
* -----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-green-light {
//Navbar
.main-header {
.navbar {
@include navbar-variant($green; #fff);
@include navbar-variant($green, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-green.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Green
* -----------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-green {
//Navbar
.main-header {
.navbar {
@include navbar-variant($green; #fff);
@include navbar-variant($green, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-purple-light.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Purple
* ------------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-purple-light {
//Navbar
.main-header {
.navbar {
@include navbar-variant($purple; #fff);
@include navbar-variant($purple, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-purple.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Purple
* ------------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-purple {
//Navbar
.main-header {
.navbar {
@include navbar-variant($purple; #fff);
@include navbar-variant($purple, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-red-light.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Red
* ---------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-red-light {
//Navbar
.main-header {
.navbar {
@include navbar-variant($red; #fff);
@include navbar-variant($red, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-red.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Red
* ---------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-red {
//Navbar
.main-header {
.navbar {
@include navbar-variant($red; #fff);
@include navbar-variant($red, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-yellow-light.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Yellow
* ------------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-yellow-light {
//Navbar
.main-header {
.navbar {
@include navbar-variant($yellow; #fff);
@include navbar-variant($yellow, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
build/scss/skins/skin-yellow.scss
浏览文件 @ c6667c6b
......@@ -2,16 +2,12 @@
* Skin: Yellow
* ------------
*/
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";
.skin-yellow {
//Navbar
.main-header {
.navbar {
@include navbar-variant($yellow; #fff);
@include navbar-variant($yellow, #fff);
.sidebar-toggle {
color: #fff;
&:hover {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或