auth-skin-default.css 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. /**
  2. Author: Jeffrey Wang
  3. Email: admin@wj2015.com
  4. Name: auth-skin-default
  5. Comment: 默认主题,感谢lipengfei886@qq.com提供的基础样式
  6. Version: v1.0.0
  7. */
  8. /*请在js中的.auth-status前的div加一个class属性auth-skin*/
  9. .auth-skin-default .auth-status {
  10. margin-top: -12px;
  11. }
  12. .auth-skin-default .auth-status > i.layui-icon {
  13. width: 18px;
  14. font-size: 18px;
  15. text-align: center;
  16. }
  17. .auth-skin-default .auth-status > div {
  18. position: relative;
  19. top: 6px;
  20. padding-left: 17px;
  21. }
  22. .auth-skin-default .auth-status > div.layui-form-radio {
  23. padding-left: 5px;
  24. }
  25. /*美化的多选框/单选框DOM*/
  26. .auth-skin-default .auth-status > div > span {
  27. -moz-border-radius: 5px;
  28. -webkit-border-radius: 5px;
  29. border-radius: 5px;
  30. display: inline-block;
  31. padding: 3px 8px;
  32. text-decoration: none;
  33. position: relative;
  34. top: -3px;
  35. }
  36. .auth-skin-default .auth-skin {
  37. list-style-type: none;
  38. margin: 0;
  39. padding: 13px 5px 0 5px;
  40. position: relative;
  41. color: #009688;
  42. }
  43. .auth-skin-default .auth-skin::before, .auth-skin-default .auth-skin::after {
  44. content: '';
  45. left: -10px;
  46. position: absolute;
  47. right: auto
  48. }
  49. .auth-skin-default .auth-skin::before {
  50. border-left: 1px dashed #009688;
  51. bottom: 50px;
  52. height: 100%;
  53. top: 0;
  54. width: 1px
  55. }
  56. .auth-skin-default .auth-skin::after {
  57. border-top: 1px dashed #009688;
  58. height: 20px;
  59. top: 25px;
  60. width: 25px
  61. }
  62. /*解决多层数据中,auth-child缩进长度的问题*/
  63. .auth-skin-default > .auth-single .auth-single {
  64. margin-left: 36px;
  65. }
  66. .auth-skin-default > .auth-single > .auth-skin > .auth-child .auth-child {
  67. margin-left: 18px;
  68. }
  69. .auth-skin-default > .auth-single > .auth-skin {
  70. }
  71. .auth-skin-default > .auth-single > .auth-skin::before, .auth-skin-default > .auth-single > .auth-skin::after {
  72. border: 0
  73. }
  74. .auth-skin-default > .auth-single > .auth-skin:last-child::before {
  75. height: 30px
  76. }
  77. /*隐藏左侧操作的特殊样式*/
  78. .auth-skin-default.auth-tree-hidechoose .auth-status > span {
  79. display: none;
  80. }
  81. .auth-skin-default.auth-tree-hidechoose .auth-status > div > span {
  82. padding-left: 3px;
  83. }
  84. .auth-skin-default.auth-tree-hidechoose .auth-status > i {
  85. position: relative;
  86. top: 4px;
  87. }
  88. /*放于同一行的样式*/
  89. .auth-skin-default .auth-row {
  90. display: inline-block;
  91. margin-left: 5px;
  92. }
  93. .auth-skin-default > .auth-single .auth-child .auth-row {
  94. margin-left: -22px;
  95. }
  96. .auth-skin-default .auth-row.auth-skin::before, .auth-skin-default .auth-row.auth-skin::after {
  97. content: '';
  98. border: 0;
  99. }