You are here

skinr.css in Skinr 6.2

/**
 * Skinr regions.
 */
.skinr-region {
  outline: none;
  position: relative;
}
.skinr-region-active {
  outline: #999 dashed 1px;
}

/**
 * Skinr edit links.
 */
.skinr-links-wrapper {
  display: none;
  font-size: 90%;
  position: absolute;
  right: 5px;
  top: 0px;
  z-index: 998;
}
html.js div.skinr-links-wrapper {
  display: block;
}
a.skinr-links-trigger {
  background: transparent url(../images/gear-select.png) no-repeat 2px 0;
  display: block;
  height: 18px;
  margin: 2px 1px 0 1px;
  padding: 0 2px;
  outline: none;
  text-indent: 34px;
  width: 28px;
  overflow: hidden;
}
a.skinr-links-trigger:hover,
div.skinr-links-active a.skinr-links-trigger {
  background-position: 2px -18px;
}
div.skinr-links-active a.skinr-links-trigger {
  background-color: #fff;
  border: #ccc 1px solid;
  border-bottom: none;
  padding: 0 2px;
  margin: 1px 0 0 0;
  position: relative;
  z-index: 1;
  border-radius-topleft: 4px;
  border-radius-topright: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-radius-topleft: 4px;
  -webkit-border-radius-topright: 4px;
}
div.skinr-links-wrapper ul.skinr-links {
  background-color: #fff;
  border: #ccc 1px solid;
  display: none;
  margin: 0;
  padding: 0.25em 0;
  position: absolute;
  right: 0;
  text-align: left;
  top: 19px;
  white-space: nowrap;
  -moz-border-radius: 4px;
  -moz-border-radius-topright: 0;
  -webkit-border-radius: 4px;
  -webkit-border-radius-topright: 0;
  border-radius: 4px;
  border-radius-topright: 0;
}
.skinr-links-region:hover a.skinr-links-trigger,
div.skinr-links-active a.skinr-links-trigger,
div.skinr-links-active ul.skinr-links {
  display: block;
}
ul.skinr-links li {
  line-height: 100%;
  list-style: none;
  list-style-image: none;
  margin: 0;
  padding: 0;
}
div.skinr-links-wrapper a {
  text-decoration: none;
}
ul.skinr-links li a {
  color: #333;
  display: block;
  margin: 0.25em 0;
  padding: 0.25em 1em 0.25em 0.5em;
}
ul.skinr-links li a:hover {
  background-color: #bfdcee;
}

/**
 * Collapsed fieldset.
 */
html.js fieldset.collapsed div.skinr-links-wrapper, 
html.js fieldset.collapsed div.skinr-links-wrapper a.skinr-links-trigger {
  display: block !important;
}
html.js fieldset.collapsed div.skinr-links-wrapper .skinr-links-active {
  display: block;
}
html.js fieldset.collapsed div.skinr-links-wrapper ul.skinr-links li {
  display: list-item;
}
html.js fieldset.collapsed div.skinr-links-wrapper ul.skinr-links li a {
  display: block;
}

/**
 * Support for admin menu module.
 */
body.admin-menu .skinr-links-wrapper-page {
  top: 20px;
}

File

css/skinr.css
View source
  1. /**
  2. * Skinr regions.
  3. */
  4. .skinr-region {
  5. outline: none;
  6. position: relative;
  7. }
  8. .skinr-region-active {
  9. outline: #999 dashed 1px;
  10. }
  11. /**
  12. * Skinr edit links.
  13. */
  14. .skinr-links-wrapper {
  15. display: none;
  16. font-size: 90%;
  17. position: absolute;
  18. right: 5px;
  19. top: 0px;
  20. z-index: 998;
  21. }
  22. html.js div.skinr-links-wrapper {
  23. display: block;
  24. }
  25. a.skinr-links-trigger {
  26. background: transparent url(../images/gear-select.png) no-repeat 2px 0;
  27. display: block;
  28. height: 18px;
  29. margin: 2px 1px 0 1px;
  30. padding: 0 2px;
  31. outline: none;
  32. text-indent: 34px;
  33. width: 28px;
  34. overflow: hidden;
  35. }
  36. a.skinr-links-trigger:hover,
  37. div.skinr-links-active a.skinr-links-trigger {
  38. background-position: 2px -18px;
  39. }
  40. div.skinr-links-active a.skinr-links-trigger {
  41. background-color: #fff;
  42. border: #ccc 1px solid;
  43. border-bottom: none;
  44. padding: 0 2px;
  45. margin: 1px 0 0 0;
  46. position: relative;
  47. z-index: 1;
  48. border-radius-topleft: 4px;
  49. border-radius-topright: 4px;
  50. -moz-border-radius-topleft: 4px;
  51. -moz-border-radius-topright: 4px;
  52. -webkit-border-radius-topleft: 4px;
  53. -webkit-border-radius-topright: 4px;
  54. }
  55. div.skinr-links-wrapper ul.skinr-links {
  56. background-color: #fff;
  57. border: #ccc 1px solid;
  58. display: none;
  59. margin: 0;
  60. padding: 0.25em 0;
  61. position: absolute;
  62. right: 0;
  63. text-align: left;
  64. top: 19px;
  65. white-space: nowrap;
  66. -moz-border-radius: 4px;
  67. -moz-border-radius-topright: 0;
  68. -webkit-border-radius: 4px;
  69. -webkit-border-radius-topright: 0;
  70. border-radius: 4px;
  71. border-radius-topright: 0;
  72. }
  73. .skinr-links-region:hover a.skinr-links-trigger,
  74. div.skinr-links-active a.skinr-links-trigger,
  75. div.skinr-links-active ul.skinr-links {
  76. display: block;
  77. }
  78. ul.skinr-links li {
  79. line-height: 100%;
  80. list-style: none;
  81. list-style-image: none;
  82. margin: 0;
  83. padding: 0;
  84. }
  85. div.skinr-links-wrapper a {
  86. text-decoration: none;
  87. }
  88. ul.skinr-links li a {
  89. color: #333;
  90. display: block;
  91. margin: 0.25em 0;
  92. padding: 0.25em 1em 0.25em 0.5em;
  93. }
  94. ul.skinr-links li a:hover {
  95. background-color: #bfdcee;
  96. }
  97. /**
  98. * Collapsed fieldset.
  99. */
  100. html.js fieldset.collapsed div.skinr-links-wrapper,
  101. html.js fieldset.collapsed div.skinr-links-wrapper a.skinr-links-trigger {
  102. display: block !important;
  103. }
  104. html.js fieldset.collapsed div.skinr-links-wrapper .skinr-links-active {
  105. display: block;
  106. }
  107. html.js fieldset.collapsed div.skinr-links-wrapper ul.skinr-links li {
  108. display: list-item;
  109. }
  110. html.js fieldset.collapsed div.skinr-links-wrapper ul.skinr-links li a {
  111. display: block;
  112. }
  113. /**
  114. * Support for admin menu module.
  115. */
  116. body.admin-menu .skinr-links-wrapper-page {
  117. top: 20px;
  118. }