skins.css 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984
  1. /*
  2. *
  3. * SKIN blue 若依管理系统
  4. * NAME - blue/green/purple/red/yellow
  5. *
  6. */
  7. /** 蓝色主题 skin-blue **/
  8. .navbar, .skin-blue .navbar {
  9. background-color: #3c8dbc
  10. }
  11. .skin-blue .navbar-default .nav>li.selected>a,
  12. .skin-blue .navbar-default .nav>li.selected>a:focus {
  13. background-color: #1890ff;
  14. color: rgba(255,255,255,1);
  15. }
  16. .skin-blue .navbar .nav>li>a {
  17. color: #fff
  18. }
  19. .skin-blue .navbar .nav>li>a:hover,
  20. .skin-blue .navbar .nav>li>a:active,
  21. .skin-blue .navbar .nav>li>a:focus,
  22. .skin-blue .navbar .nav .open>a,
  23. .skin-blue .navbar .nav .open>a:hover,
  24. .skin-blue .navbar .nav .open>a:focus,
  25. .skin-blue .navbar .nav>.active>a {
  26. background: rgba(0, 0, 0, 0.1);
  27. color: #f6f6f6
  28. }
  29. .skin-blue .navbar .sidebar-toggle {
  30. color: #fff
  31. }
  32. .skin-blue .navbar .sidebar-toggle:hover {
  33. color: #f6f6f6;
  34. background: rgba(0, 0, 0, 0.1)
  35. }
  36. .skin-blue .navbar .sidebar-toggle {
  37. color: #fff
  38. }
  39. .skin-blue .navbar .sidebar-toggle:hover {
  40. background-color: #367fa9
  41. }
  42. @media ( max-width :767px) {
  43. .skin-blue .navbar .dropdown-menu li.divider {
  44. background-color: rgba(255, 255, 255, 0.1)
  45. }
  46. .skin-blue .navbar .dropdown-menu li a {
  47. color: #fff
  48. }
  49. .skin-blue .navbar .dropdown-menu li a:hover {
  50. background: #367fa9
  51. }
  52. }
  53. .skin-blue .logo {
  54. background-color: #367fa9;
  55. color: #fff;
  56. border-bottom: 0 solid transparent
  57. }
  58. .skin-blue .logo:hover {
  59. background-color: #357ca5
  60. }
  61. .skin-blue li.user-header {
  62. background-color: #3c8dbc
  63. }
  64. .skin-blue .content-header {
  65. background: transparent
  66. }
  67. .skin-blue .wrapper,
  68. .skin-blue .main-sidebar,
  69. .skin-blue .left-side {
  70. background-color: #222d32
  71. }
  72. .skin-blue .user-panel>.info,
  73. .skin-blue .user-panel>.info>a {
  74. color: #fff
  75. }
  76. .skin-blue .nav>li.header {
  77. color: #4b646f;
  78. background: #1a2226
  79. }
  80. .skin-blue .nav>li.active {
  81. color: #fff;
  82. background: #293846;
  83. border-left: 3px solid #3c8dbc;
  84. }
  85. .skin-blue .nav>li.active>ul li.active {
  86. border-left: none;
  87. }
  88. .skin-blue .sidebar a {
  89. color: #b8c7ce
  90. }
  91. .skin-blue .sidebar a:hover {
  92. text-decoration: none
  93. }
  94. .skin-blue .sidebar-form {
  95. border-radius: 3px;
  96. border: 1px solid #374850;
  97. margin: 10px 10px
  98. }
  99. .skin-blue .sidebar-form input[type="text"],
  100. .skin-blue .sidebar-form .btn {
  101. box-shadow: none;
  102. background-color: #374850;
  103. border: 1px solid transparent;
  104. height: 35px
  105. }
  106. .skin-blue .sidebar-form input[type="text"] {
  107. color: #666;
  108. border-top-left-radius: 2px;
  109. border-top-right-radius: 0;
  110. border-bottom-right-radius: 0;
  111. border-bottom-left-radius: 2px
  112. }
  113. .skin-blue .sidebar-form input[type="text"]:focus,
  114. .skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  115. background-color: #fff;
  116. color: #666
  117. }
  118. .skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  119. border-left-color: #fff
  120. }
  121. .skin-blue .sidebar-form .btn {
  122. color: #999;
  123. border-top-left-radius: 0;
  124. border-top-right-radius: 2px;
  125. border-bottom-right-radius: 2px;
  126. border-bottom-left-radius: 0
  127. }
  128. .skin-blue.layout-top-nav>.logo {
  129. background-color: #3c8dbc;
  130. color: #fff;
  131. border-bottom: 0 solid transparent
  132. }
  133. .skin-blue.layout-top-nav>.logo:hover {
  134. background-color: #3b8ab8
  135. }
  136. .skin-blue .content-tabs {
  137. border-bottom: 1px solid #e5e5e5;
  138. }
  139. .skin-blue.layout-top-nav>.logo {
  140. background-color: #3c8dbc;
  141. color: #fff;
  142. border-bottom: 0 solid transparent
  143. }
  144. .skin-blue.layout-top-nav>.logo:hover {
  145. background-color: #3b8ab8
  146. }
  147. /** 绿色主题 skin-green **/
  148. .skin-green .navbar {
  149. background-color: #00a65a;
  150. }
  151. .skin-green .navbar-default .nav>li.selected>a,
  152. .skin-green .navbar-default .nav>li.selected>a:focus {
  153. background-color: #52c41a;
  154. color: rgba(255,255,255,1);
  155. }
  156. .skin-green .content-tabs {
  157. border-bottom: 1px solid #e5e5e5;
  158. }
  159. .skin-green .navbar .nav>li>a {
  160. color: #fff
  161. }
  162. .skin-green .navbar .nav>li>a:hover,
  163. .skin-green .navbar .nav>li>a:active,
  164. .skin-green .navbar .nav>li>a:focus,
  165. .skin-green .navbar .nav .open>a,
  166. .skin-green .navbar .nav .open>a:hover,
  167. .skin-green .navbar .nav .open>a:focus,
  168. .skin-green .navbar .nav>.active>a {
  169. background: rgba(0, 0, 0, 0.1);
  170. color: #f6f6f6
  171. }
  172. .skin-green .navbar .sidebar-toggle {
  173. color: #fff
  174. }
  175. .skin-green .navbar .sidebar-toggle:hover {
  176. color: #f6f6f6;
  177. background: rgba(0, 0, 0, 0.1)
  178. }
  179. .skin-green .navbar .sidebar-toggle {
  180. color: #fff
  181. }
  182. .skin-green .navbar .sidebar-toggle:hover {
  183. background-color: #008d4c
  184. }
  185. @media ( max-width :767px) {
  186. .skin-green .navbar .dropdown-menu li.divider {
  187. background-color: rgba(255, 255, 255, 0.1)
  188. }
  189. .skin-green .navbar .dropdown-menu li a {
  190. color: #fff
  191. }
  192. .skin-green .navbar .dropdown-menu li a:hover {
  193. background: #008d4c
  194. }
  195. }
  196. .skin-green .logo {
  197. background-color: #008d4c;
  198. color: #fff;
  199. border-bottom: 0 solid transparent
  200. }
  201. .skin-green .logo:hover {
  202. background-color: #008749
  203. }
  204. .skin-green li.user-header {
  205. background-color: #00a65a
  206. }
  207. .skin-green .content-header {
  208. background: transparent
  209. }
  210. .skin-green .wrapper,
  211. .skin-green .main-sidebar,
  212. .skin-green .left-side {
  213. background-color: #222d32
  214. }
  215. .skin-green .user-panel>.info,
  216. .skin-green .user-panel>.info>a {
  217. color: #fff
  218. }
  219. .skin-green .nav>li.header {
  220. color: #4b646f;
  221. background: #1a2226;
  222. }
  223. .skin-green .nav>li.active {
  224. color: #fff;
  225. background: #293846;
  226. border-left: 3px solid #00a65a;
  227. }
  228. .skin-green .nav>li.active>ul li.active {
  229. border-left: none;
  230. }
  231. .skin-green .sidebar a {
  232. color: #b8c7ce
  233. }
  234. .skin-green .sidebar a:hover {
  235. text-decoration: none
  236. }
  237. .skin-green .sidebar-form {
  238. border-radius: 3px;
  239. border: 1px solid #374850;
  240. margin: 10px 10px
  241. }
  242. .skin-green .sidebar-form input[type="text"],
  243. .skin-green .sidebar-form .btn {
  244. box-shadow: none;
  245. background-color: #374850;
  246. border: 1px solid transparent;
  247. height: 35px
  248. }
  249. .skin-green .sidebar-form input[type="text"] {
  250. color: #666;
  251. border-top-left-radius: 2px;
  252. border-top-right-radius: 0;
  253. border-bottom-right-radius: 0;
  254. border-bottom-left-radius: 2px
  255. }
  256. .skin-green .sidebar-form input[type="text"]:focus,
  257. .skin-green .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  258. background-color: #fff;
  259. color: #666
  260. }
  261. .skin-green .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  262. border-left-color: #fff
  263. }
  264. .skin-green .sidebar-form .btn {
  265. color: #999;
  266. border-top-left-radius: 0;
  267. border-top-right-radius: 2px;
  268. border-bottom-right-radius: 2px;
  269. border-bottom-left-radius: 0
  270. }
  271. /** 红色主题 skin-red **/
  272. .skin-red .navbar {
  273. background-color: #dd4b39
  274. }
  275. .skin-red .navbar-default .nav>li.selected>a,
  276. .skin-red .navbar-default .nav>li.selected>a:focus {
  277. background-color: #f5222d;
  278. color: rgba(255,255,255,1);
  279. }
  280. .skin-red .navbar .nav>li>a {
  281. color: #fff
  282. }
  283. .skin-red .navbar .nav>li>a:hover,
  284. .skin-red .navbar .nav>li>a:active,
  285. .skin-red .navbar .nav>li>a:focus,
  286. .skin-red .navbar .nav .open>a,
  287. .skin-red .navbar .nav .open>a:hover,
  288. .skin-red .navbar .nav .open>a:focus,
  289. .skin-red .navbar .nav>.active>a {
  290. background: rgba(0, 0, 0, 0.1);
  291. color: #f6f6f6
  292. }
  293. .skin-red .navbar .sidebar-toggle {
  294. color: #fff
  295. }
  296. .skin-red .navbar .sidebar-toggle:hover {
  297. color: #f6f6f6;
  298. background: rgba(0, 0, 0, 0.1)
  299. }
  300. .skin-red .navbar .sidebar-toggle {
  301. color: #fff
  302. }
  303. .skin-red .navbar .sidebar-toggle:hover {
  304. background-color: #d73925
  305. }
  306. @media ( max-width :767px) {
  307. .skin-red .navbar .dropdown-menu li.divider {
  308. background-color: rgba(255, 255, 255, 0.1)
  309. }
  310. .skin-red .navbar .dropdown-menu li a {
  311. color: #fff
  312. }
  313. .skin-red .navbar .dropdown-menu li a:hover {
  314. background: #d73925
  315. }
  316. }
  317. .skin-red .logo {
  318. background-color: #d73925;
  319. color: #fff;
  320. border-bottom: 0 solid transparent
  321. }
  322. .skin-red .logo:hover {
  323. background-color: #d33724
  324. }
  325. .skin-red li.user-header {
  326. background-color: #dd4b39
  327. }
  328. .skin-red .content-header {
  329. background: transparent
  330. }
  331. .skin-red .wrapper,
  332. .skin-red .main-sidebar,
  333. .skin-red .left-side {
  334. background-color: #222d32
  335. }
  336. .skin-red .user-panel>.info,
  337. .skin-red .user-panel>.info>a {
  338. color: #fff
  339. }
  340. .skin-red .nav>li.header {
  341. color: #4b646f;
  342. background: #1a2226
  343. }
  344. .skin-red .nav>li.active {
  345. color: #fff;
  346. border-left: 3px solid #dd4b39;
  347. background: #293846;
  348. }
  349. .skin-red .nav>li.active>ul li.active {
  350. border-left: none;
  351. }
  352. .skin-red .content-tabs {
  353. border-bottom: 1px solid #e5e5e5;
  354. }
  355. .skin-red .sidebar a {
  356. color: #b8c7ce
  357. }
  358. .skin-red .sidebar a:hover {
  359. text-decoration: none
  360. }
  361. .skin-red .sidebar-form {
  362. border-radius: 3px;
  363. border: 1px solid #374850;
  364. margin: 10px 10px
  365. }
  366. .skin-red .sidebar-form input[type="text"],
  367. .skin-red .sidebar-form .btn {
  368. box-shadow: none;
  369. background-color: #374850;
  370. border: 1px solid transparent;
  371. height: 35px
  372. }
  373. .skin-red .sidebar-form input[type="text"] {
  374. color: #fff;
  375. border-top-left-radius: 2px;
  376. border-top-right-radius: 0;
  377. border-bottom-right-radius: 0;
  378. border-bottom-left-radius: 2px
  379. }
  380. .skin-red .sidebar-form input[type="text"]:focus,
  381. .skin-red .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  382. background-color: #fff;
  383. color: #666
  384. }
  385. .skin-red .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  386. border-left-color: #fff
  387. }
  388. .skin-red .sidebar-form .btn {
  389. color: #999;
  390. border-top-left-radius: 0;
  391. border-top-right-radius: 2px;
  392. border-bottom-right-radius: 2px;
  393. border-bottom-left-radius: 0
  394. }
  395. /** 黄色主题 skin-red **/
  396. .skin-yellow .navbar {
  397. background-color: #f39c12
  398. }
  399. .skin-yellow .navbar-default .nav>li.selected>a,
  400. .skin-yellow .navbar-default .nav>li.selected>a:focus {
  401. background-color: #faad14;
  402. color: rgba(255,255,255,1);
  403. }
  404. .skin-yellow .navbar .nav>li>a {
  405. color: #fff
  406. }
  407. .skin-yellow .navbar .nav>li>a:hover,
  408. .skin-yellow .navbar .nav>li>a:active,
  409. .skin-yellow .navbar .nav>li>a:focus,
  410. .skin-yellow .navbar .nav .open>a,
  411. .skin-yellow .navbar .nav .open>a:hover,
  412. .skin-yellow .navbar .nav .open>a:focus,
  413. .skin-yellow .navbar .nav>.active>a {
  414. background: rgba(0, 0, 0, 0.1);
  415. color: #f6f6f6
  416. }
  417. .skin-yellow .navbar .sidebar-toggle {
  418. color: #fff
  419. }
  420. .skin-yellow .navbar .sidebar-toggle:hover {
  421. color: #f6f6f6;
  422. background: rgba(0, 0, 0, 0.1)
  423. }
  424. .skin-yellow .navbar .sidebar-toggle {
  425. color: #fff
  426. }
  427. .skin-yellow .navbar .sidebar-toggle:hover {
  428. background-color: #e08e0b
  429. }
  430. @media ( max-width :767px) {
  431. .skin-yellow .navbar .dropdown-menu li.divider {
  432. background-color: rgba(255, 255, 255, 0.1)
  433. }
  434. .skin-yellow .navbar .dropdown-menu li a {
  435. color: #fff
  436. }
  437. .skin-yellow .navbar .dropdown-menu li a:hover {
  438. background: #e08e0b
  439. }
  440. }
  441. .skin-yellow .logo {
  442. background-color: #e08e0b;
  443. color: #fff;
  444. border-bottom: 0 solid transparent
  445. }
  446. .skin-yellow .logo:hover {
  447. background-color: #db8b0b
  448. }
  449. .skin-yellow li.user-header {
  450. background-color: #f39c12
  451. }
  452. .skin-yellow .content-header {
  453. background: transparent
  454. }
  455. .skin-yellow .wrapper,
  456. .skin-yellow .main-sidebar,
  457. .skin-yellow .left-side {
  458. background-color: #222d32
  459. }
  460. .skin-yellow .user-panel>.info,
  461. .skin-yellow .user-panel>.info>a {
  462. color: #fff
  463. }
  464. .skin-yellow .nav>li.header {
  465. color: #4b646f;
  466. background: #1a2226
  467. }
  468. .skin-yellow .nav>li.active {
  469. color: #fff;
  470. background: #293846;
  471. border-left: 3px solid #f39c12;
  472. }
  473. .skin-yellow .nav>li.active>ul li.active {
  474. border-left: none;
  475. }
  476. .skin-yellow .content-tabs {
  477. border-bottom: 1px solid #e5e5e5;
  478. }
  479. .skin-yellow .sidebar a {
  480. color: #b8c7ce
  481. }
  482. .skin-yellow .sidebar a:hover {
  483. text-decoration: none
  484. }
  485. .skin-yellow .sidebar-form {
  486. border-radius: 3px;
  487. border: 1px solid #374850;
  488. margin: 10px 10px
  489. }
  490. .skin-yellow .sidebar-form input[type="text"],
  491. .skin-yellow .sidebar-form .btn {
  492. box-shadow: none;
  493. background-color: #374850;
  494. border: 1px solid transparent;
  495. height: 35px
  496. }
  497. .skin-yellow .sidebar-form input[type="text"] {
  498. color: #666;
  499. border-top-left-radius: 2px;
  500. border-top-right-radius: 0;
  501. border-bottom-right-radius: 0;
  502. border-bottom-left-radius: 2px
  503. }
  504. .skin-yellow .sidebar-form input[type="text"]:focus,
  505. .skin-yellow .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  506. background-color: #fff;
  507. color: #666
  508. }
  509. .skin-yellow .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  510. border-left-color: #fff
  511. }
  512. .skin-yellow .sidebar-form .btn {
  513. color: #999;
  514. border-top-left-radius: 0;
  515. border-top-right-radius: 2px;
  516. border-bottom-right-radius: 2px;
  517. border-bottom-left-radius: 0
  518. }
  519. /** 紫色主题 skin-purple **/
  520. .skin-purple .navbar {
  521. background-color: #605ca8
  522. }
  523. .skin-purple .navbar-default .nav>li.selected>a,
  524. .skin-purple .navbar-default .nav>li.selected>a:focus {
  525. background-color: #722ed1;
  526. color: rgba(255,255,255,1);
  527. }
  528. .skin-purple .navbar .nav>li>a {
  529. color: #fff
  530. }
  531. .skin-purple .navbar .nav>li>a:hover,
  532. .skin-purple .navbar .nav>li>a:active,
  533. .skin-purple .navbar .nav>li>a:focus,
  534. .skin-purple .navbar .nav .open>a,
  535. .skin-purple .navbar .nav .open>a:hover,
  536. .skin-purple .navbar .nav .open>a:focus,
  537. .skin-purple .navbar .nav>.active>a {
  538. background: rgba(0, 0, 0, 0.1);
  539. color: #f6f6f6
  540. }
  541. .skin-purple .navbar .sidebar-toggle {
  542. color: #fff
  543. }
  544. .skin-purple .navbar .sidebar-toggle:hover {
  545. color: #f6f6f6;
  546. background: rgba(0, 0, 0, 0.1)
  547. }
  548. .skin-purple .navbar .sidebar-toggle {
  549. color: #fff
  550. }
  551. .skin-purple .navbar .sidebar-toggle:hover {
  552. background-color: #555299
  553. }
  554. @media ( max-width :767px) {
  555. .skin-purple .navbar .dropdown-menu li.divider {
  556. background-color: rgba(255, 255, 255, 0.1)
  557. }
  558. .skin-purple .navbar .dropdown-menu li a {
  559. color: #fff
  560. }
  561. .skin-purple .navbar .dropdown-menu li a:hover {
  562. background: #555299
  563. }
  564. }
  565. .skin-purple .logo {
  566. background-color: #555299;
  567. color: #fff;
  568. border-bottom: 0 solid transparent
  569. }
  570. .skin-purple .logo:hover {
  571. background-color: #545096
  572. }
  573. .skin-purple li.user-header {
  574. background-color: #605ca8
  575. }
  576. .skin-purple .content-header {
  577. background: transparent
  578. }
  579. .skin-purple .wrapper,
  580. .skin-purple .main-sidebar,
  581. .skin-purple .left-side {
  582. background-color: #222d32
  583. }
  584. .skin-purple .user-panel>.info,
  585. .skin-purple .user-panel>.info>a {
  586. color: #fff
  587. }
  588. .skin-purple .nav>li.header {
  589. color: #4b646f;
  590. background: #1a2226
  591. }
  592. .skin-purple .nav>li.active {
  593. color: #fff;
  594. background: #293846;
  595. border-left: 3px solid #605ca8;
  596. }
  597. .skin-purple .nav>li.active>ul li.active {
  598. border-left: none;
  599. }
  600. .skin-purple .content-tabs {
  601. border-bottom: 1px solid #e5e5e5;
  602. }
  603. .skin-purple .sidebar a {
  604. color: #b8c7ce
  605. }
  606. .skin-purple .sidebar a:hover {
  607. text-decoration: none
  608. }
  609. .skin-purple .sidebar-form {
  610. border-radius: 3px;
  611. border: 1px solid #374850;
  612. margin: 10px 10px
  613. }
  614. .skin-purple .sidebar-form input[type="text"],
  615. .skin-purple .sidebar-form .btn {
  616. box-shadow: none;
  617. background-color: #374850;
  618. border: 1px solid transparent;
  619. height: 35px
  620. }
  621. .skin-purple .sidebar-form input[type="text"] {
  622. color: #666;
  623. border-top-left-radius: 2px;
  624. border-top-right-radius: 0;
  625. border-bottom-right-radius: 0;
  626. border-bottom-left-radius: 2px
  627. }
  628. .skin-purple .sidebar-form input[type="text"]:focus,
  629. .skin-purple .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  630. background-color: #fff;
  631. color: #666
  632. }
  633. .skin-purple .sidebar-form input[type="text"]:focus+.input-group-btn .btn {
  634. border-left-color: #fff
  635. }
  636. .skin-purple .sidebar-form .btn {
  637. color: #999;
  638. border-top-left-radius: 0;
  639. border-top-right-radius: 2px;
  640. border-bottom-right-radius: 2px;
  641. border-bottom-left-radius: 0
  642. }
  643. /*
  644. *
  645. * 侧边栏主题 若依管理系统
  646. * NAME - .theme-dark/theme-light
  647. *
  648. */
  649. /** 深黑主题 .theme-dark **/
  650. .theme-dark .user-panel>.info>p, .theme-dark .user-panel>.info, .theme-dark .user-panel>.info>a{
  651. color: #fff
  652. }
  653. .theme-dark .nav>li.active {
  654. background: #293846;
  655. }
  656. .theme-dark .navbar-static-side {
  657. background-color: #2f4050;
  658. }
  659. .theme-dark .user-panel {
  660. background-color: #2f4050;
  661. }
  662. .theme-dark .navbar-default .nav>li>a:hover,
  663. .theme-dark .navbar-default .nav>li>a:focus {
  664. background: #293846;
  665. }
  666. /** 浅色主题 theme-light **/
  667. .theme-light .user-panel>.info>p, .theme-light .user-panel>.info, .theme-light .user-panel>.info>a{
  668. color: #555
  669. }
  670. .theme-light .nav>li.active{
  671. background: #f9fafc;
  672. }
  673. .theme-light .navbar-static-side {
  674. background-color: #f9fafc;
  675. box-shadow: 2px 0 2px 0 rgba(29,35,41,.05);
  676. }
  677. .theme-light .user-panel {
  678. background-color: #f9fafc;
  679. }
  680. .theme-light .navbar-default .nav>li>a {
  681. color: #777;
  682. }
  683. .theme-light.skin-blue .navbar-default .nav>li.active>a {
  684. color: #1890ff;
  685. }
  686. .theme-light.skin-blue .navbar-default .nav>li.selected>a,
  687. .theme-light.skin-blue .navbar-default .nav>li.selected>a:focus {
  688. background-color: rgb(240, 245, 255);
  689. color: rgb(47, 84, 235);
  690. }
  691. .theme-light.skin-green .navbar-default .nav>li.active>a {
  692. color: #52c41a;
  693. }
  694. .theme-light.skin-green .navbar-default .nav>li.selected>a,
  695. .theme-light.skin-green .navbar-default .nav>li.selected>a:focus {
  696. background-color: rgb(246, 255, 237);
  697. color: rgb(82, 196, 26);
  698. }
  699. .theme-light.skin-purple .navbar-default .nav>li.active>a {
  700. color: rgb(114, 46, 209);
  701. }
  702. .theme-light.skin-purple .navbar-default .nav>li.selected>a,
  703. .theme-light.skin-purple .navbar-default .nav>li.selected>a:focus {
  704. background-color: #f9f0ff;
  705. color: #722ed1;
  706. }
  707. .theme-light.skin-red .navbar-default .nav>li.active>a {
  708. color: rgb(245, 34, 45);
  709. }
  710. .theme-light.skin-red .navbar-default .nav>li.selected>a,
  711. .theme-light.skin-red .navbar-default .nav>li.selected>a:focus {
  712. background-color: rgb(255, 241, 240);
  713. color: rgb(245, 34, 45);
  714. }
  715. .theme-light.skin-yellow .navbar-default .nav>li.active>a {
  716. color: rgb(250, 173, 20);
  717. }
  718. .theme-light.skin-yellow .navbar-default .nav>li.selected>a,
  719. .theme-light.skin-yellow .navbar-default .nav>li.selected>a:focus {
  720. background-color: #fffbe6;
  721. color: #faad14;
  722. }
  723. .theme-light .navbar-default .nav>li>a:hover,
  724. .theme-light .navbar-default .nav>li>a:focus {
  725. background-color: rgb(240, 245, 255);
  726. }
  727. .fixed-sidebar.theme-light.mini-navbar .nav li:hover>a> span.nav-label {
  728. background-color: #f9fafc;
  729. }
  730. .fixed-sidebar.theme-light.mini-navbar .nav li:hover>.nav-second-level {
  731. background-color: #f9fafc;
  732. }
  733. /** 深蓝主题 theme-light **/
  734. /**
  735. .skin-blue.theme-blue .logo, .skin-white.theme-blue .logo {
  736. background-color: rgba(15,41,80,1) !important;
  737. color: #fff;
  738. }
  739. **/
  740. .theme-blue .user-panel>.info>p, .theme-blue .user-panel>.info, .theme-blue .user-panel>.info>a{
  741. color: #a3b1cc
  742. }
  743. .theme-blue .nav>li.active{
  744. background-color: rgba(15,41,80,1);
  745. }
  746. .theme-blue .navbar-static-side {
  747. background-color: rgba(15,41,80,1);
  748. box-shadow: 2px 0 2px 0 rgba(29,35,41,.05);
  749. }
  750. .theme-blue .user-panel {
  751. background-color: rgba(15,41,80,1);
  752. }
  753. .theme-blue .navbar-default .nav>li>a {
  754. color: #a3b1cc;
  755. }
  756. .theme-blue.skin-blue .navbar-default .nav>li.active>a {
  757. color: #1890ff;
  758. }
  759. .theme-blue.skin-blue .navbar-default .nav>li.selected>a,
  760. .theme-blue.skin-blue .navbar-default .nav>li.selected>a:focus {
  761. background-color: #1890ff;
  762. }
  763. .theme-blue.skin-green .navbar-default .nav>li.active>a {
  764. color: #52c41a;
  765. }
  766. .theme-blue.skin-green .navbar-default .nav>li.selected>a,
  767. .theme-blue.skin-green .navbar-default .nav>li.selected>a:focus {
  768. background-color: #52c41a;
  769. color: rgba(255,255,255,1);
  770. }
  771. .theme-blue.skin-purple .navbar-default .nav>li.active>a {
  772. color: rgb(114, 46, 209);
  773. }
  774. .theme-blue.skin-purple .navbar-default .nav>li.selected>a,
  775. .theme-blue.skin-purple .navbar-default .nav>li.selected>a:focus {
  776. background-color: #722ed1;
  777. color: rgba(255,255,255,1);
  778. }
  779. .theme-blue.skin-red .navbar-default .nav>li.active>a {
  780. color: rgb(245, 34, 45);
  781. }
  782. .theme-blue.skin-red .navbar-default .nav>li.selected>a,
  783. .theme-blue.skin-red .navbar-default .nav>li.selected>a:focus {
  784. background-color: #f5222d;
  785. color: rgba(255,255,255,1);
  786. }
  787. .theme-blue.skin-yellow .navbar-default .nav>li.active>a {
  788. color: rgb(250, 173, 20);
  789. }
  790. .theme-blue.skin-yellow .navbar-default .nav>li.selected>a,
  791. .theme-blue.skin-yellow .navbar-default .nav>li.selected>a:focus {
  792. background-color: #faad14;
  793. color: rgba(255,255,255,1);
  794. }
  795. .theme-blue .navbar-default .nav>li>a:hover,
  796. .theme-blue .navbar-default .nav>li>a:focus {
  797. background-color: rgba(15,41,80,1);
  798. box-shadow: 2px 0 2px 0 rgba(29,35,41,.05);
  799. }
  800. .fixed-sidebar.theme-blue.mini-navbar .nav li:hover>a> span.nav-label {
  801. background-color: rgba(15,41,80,1);
  802. }
  803. .fixed-sidebar.theme-blue.mini-navbar .nav li:hover>.nav-second-level {
  804. background-color: rgba(15,41,80,1);
  805. }