You are here

hierarchical_select-rtl.css in Hierarchical Select 5.3


/* The hierarchical select. */
.hierarchical-select-wrapper {
  margin: 2px; /* Make sure a Hierarchical Selects is *indistuingishable*
                  from a normal select with regards to spacing. Firefox seems
                  to be giving special treatment to select elements though,
                  because it's not rendering the 2px horizontal margins though
                  they *are* set. */
}

.hierarchical-select-wrapper .hierarchical-select .selects {
  float: right; /* If a block is floated, it won't consume as much width as
                   available, only just enough. This allows the grippie to
                   perfectly scale with the with consumed by the selects. */ 
}

.hierarchical-select-wrapper .hierarchical-select .selects .grippie {
  clear: right; /* clear: left; */
  height: 9px;
  overflow: hidden;
  background: #eee url(images/grippie.png) no-repeat center 2px;
  border: 1px solid #ddd;
  border-top-width: 0;
  cursor: s-resize;
  margin-left: 0.5em; /* margin-right: 0.5em; */ /* Give the grippie the same margin as each select. */
  min-width: 70px; /* Hack for IE, makes the grip usable, but not yet the same as in other browsers. */
}

.hierarchical-select-wrapper .hierarchical-select select,
.hierarchical-select-wrapper .hierarchical-select .add-to-dropbox,
.hierarchical-select-wrapper .hierarchical-select .create-new-item {
  margin: 0;
  margin-left: .5em; /* margin-right: .5em; */
  margin-bottom: 3px;
  float: right; /* float: left; */
}


/* The flat select (only used in GET forms). */
.hierarchical-select-wrapper .flat-select {
  display: none;
}


/* The pseudo-modal window for creating a new item or new level. */
.hierarchical-select-wrapper .hierarchical-select .create-new-item {
  padding: .7em;
  border: 2px outset gray;
}

.hierarchical-select-wrapper .hierarchical-select .create-new-item {
  width: 11em;
}

.hierarchical-select-wrapper .hierarchical-select .create-new-item-create,
.hierarchical-select-wrapper .hierarchical-select .create-new-item-cancel {
  float: left; /* float: right; */
  margin: 0;
  margin-left: .4em;
}

.hierarchical-select-wrapper .hierarchical-select .create-new-item-input {
  width: 10.5em;
  margin: 0;
  margin-bottom: 1em;
  float: right; /* float: left; */
  float: left; /* clear: right; */
}


/* Level labels styles. */
.hierarchical-select-level-labels-style-bold .hierarchical-select select option.level-label {
  font-weight: bold;
}

.hierarchical-select-level-labels-style-inversed .hierarchical-select select option.level-label {
  background-color: #000000;
  color: #FFFFFF;
}

.hierarchical-select-level-labels-style-underlined .hierarchical-select select option.level-label {
  text-decoration: underline;
}


/* Child level indicator. */
.hierarchical-select-wrapper .hierarchical-select option.has-children {
  background: url(images/arrow-rtl.png) no-repeat right center;
}


/* Dropbox limit warning.*/
p.hierarchical-select-dropbox-limit-warning {
  padding: 0;
  color: #F7A54F;
  font-size: 110%;
  padding-left: .5em;
}


/* The dropbox table. */
.hierarchical-select-wrapper .dropbox-title {
  font-size: 115%;
  color: #898989;
  margin-bottom: 0.2em;
}

.hierarchical-select-wrapper .dropbox {
  display: inline-block;
  margin: .5em 0;
}

.hierarchical-select-wrapper .dropbox table {
  margin: 0;
  width: auto;
  max-width: 100%;
  min-width: 20em;
  color: gray;
  font-size: 90%;
  border: 1px solid gray;
}

tr.dropbox-entry {
  line-height: 1.3em;
  padding: .3em .6em;
}

tr.dropbox-entry.even {
  background-color: transparent;
  border-bottom: 1px solid #CCCCCC;
}

tr.dropbox-entry.odd {
  background-color: #EDF5FA;
  border-bottom: 1px solid #CCCCCC;
}

tr.dropbox-entry.first {
  border-top: 1px solid gray;
}

tr.dropbox-entry.last {
  border-bottom: 1px solid gray;
}

.dropbox-selected-item {
  font-weight: bold;
}

.hierarchical-select-item-separator {
  padding-left: .5em;
  padding-right: .5em;
}

td.dropbox-remove *,
td.dropbox-remove a:link,
td.dropbox-remove a:visited {
  color: #F7A54F;
  text-decoration: none;
}

td.dropbox-remove a:hover {
  text-decoration: underline;
}

tr.dropbox-is-empty {
  padding: .5em 1em;
}


/* The "Update" button and help text (used when Javascript is disabled). */
.hierarchical-select-wrapper .nojs .update-button {
  margin: 0 0 1em;
}

.hierarchical-select-wrapper .nojs .help-text {
  font-size: 90%;
  color: transparent;
  display: block;
  border: 1px dotted black;
  overflow: hidden;
  width: 34em;
  height: 1.2em;
  padding: .6em;
  line-height: normal;
}

.hierarchical-select-wrapper .nojs .help-text:hover {
  height: auto;
  width: auto;
  min-width: 25em;
  max-width: 45em;
  color: gray;
}

.hierarchical-select-wrapper .nojs .help-text .ask-to-hover {
  color: gray;
  font-style: italic;
}

.hierarchical-select-wrapper .nojs .help-text:hover .ask-to-hover {
  display: none;
}
  
.hierarchical-select-wrapper .nojs .help-text .highlight {
  text-decoration: underline;
}

.hierarchical-select-wrapper .nojs .help-text .warning {
  color: red;
}

.hierarchical-select-wrapper .nojs .help-text .solutions {
  margin: 0;
  padding: 0;
}


/* The 'waiting' class is set dynamically, during a callback to the server. */
.hierarchical-select-wrapper.waiting {
  opacity: 0.5;

  /* IE doesn't support CSS 2 properly. */
  zoom: 1;
  filter: alpha(opacity=50);
}


/* Use a monospace font for the import/export config code text areas. */
.hierarchical-select-config-code {
  font-family: 'Monaco', 'Lucida Console', 'Consolas', monospace;
}

File

hierarchical_select-rtl.css
View source
  1. /* The hierarchical select. */
  2. .hierarchical-select-wrapper {
  3. margin: 2px; /* Make sure a Hierarchical Selects is *indistuingishable*
  4. from a normal select with regards to spacing. Firefox seems
  5. to be giving special treatment to select elements though,
  6. because it's not rendering the 2px horizontal margins though
  7. they *are* set. */
  8. }
  9. .hierarchical-select-wrapper .hierarchical-select .selects {
  10. float: right; /* If a block is floated, it won't consume as much width as
  11. available, only just enough. This allows the grippie to
  12. perfectly scale with the with consumed by the selects. */
  13. }
  14. .hierarchical-select-wrapper .hierarchical-select .selects .grippie {
  15. clear: right; /* clear: left; */
  16. height: 9px;
  17. overflow: hidden;
  18. background: #eee url(images/grippie.png) no-repeat center 2px;
  19. border: 1px solid #ddd;
  20. border-top-width: 0;
  21. cursor: s-resize;
  22. margin-left: 0.5em; /* margin-right: 0.5em; */ /* Give the grippie the same margin as each select. */
  23. min-width: 70px; /* Hack for IE, makes the grip usable, but not yet the same as in other browsers. */
  24. }
  25. .hierarchical-select-wrapper .hierarchical-select select,
  26. .hierarchical-select-wrapper .hierarchical-select .add-to-dropbox,
  27. .hierarchical-select-wrapper .hierarchical-select .create-new-item {
  28. margin: 0;
  29. margin-left: .5em; /* margin-right: .5em; */
  30. margin-bottom: 3px;
  31. float: right; /* float: left; */
  32. }
  33. /* The flat select (only used in GET forms). */
  34. .hierarchical-select-wrapper .flat-select {
  35. display: none;
  36. }
  37. /* The pseudo-modal window for creating a new item or new level. */
  38. .hierarchical-select-wrapper .hierarchical-select .create-new-item {
  39. padding: .7em;
  40. border: 2px outset gray;
  41. }
  42. .hierarchical-select-wrapper .hierarchical-select .create-new-item {
  43. width: 11em;
  44. }
  45. .hierarchical-select-wrapper .hierarchical-select .create-new-item-create,
  46. .hierarchical-select-wrapper .hierarchical-select .create-new-item-cancel {
  47. float: left; /* float: right; */
  48. margin: 0;
  49. margin-left: .4em;
  50. }
  51. .hierarchical-select-wrapper .hierarchical-select .create-new-item-input {
  52. width: 10.5em;
  53. margin: 0;
  54. margin-bottom: 1em;
  55. float: right; /* float: left; */
  56. float: left; /* clear: right; */
  57. }
  58. /* Level labels styles. */
  59. .hierarchical-select-level-labels-style-bold .hierarchical-select select option.level-label {
  60. font-weight: bold;
  61. }
  62. .hierarchical-select-level-labels-style-inversed .hierarchical-select select option.level-label {
  63. background-color: #000000;
  64. color: #FFFFFF;
  65. }
  66. .hierarchical-select-level-labels-style-underlined .hierarchical-select select option.level-label {
  67. text-decoration: underline;
  68. }
  69. /* Child level indicator. */
  70. .hierarchical-select-wrapper .hierarchical-select option.has-children {
  71. background: url(images/arrow-rtl.png) no-repeat right center;
  72. }
  73. /* Dropbox limit warning.*/
  74. p.hierarchical-select-dropbox-limit-warning {
  75. padding: 0;
  76. color: #F7A54F;
  77. font-size: 110%;
  78. padding-left: .5em;
  79. }
  80. /* The dropbox table. */
  81. .hierarchical-select-wrapper .dropbox-title {
  82. font-size: 115%;
  83. color: #898989;
  84. margin-bottom: 0.2em;
  85. }
  86. .hierarchical-select-wrapper .dropbox {
  87. display: inline-block;
  88. margin: .5em 0;
  89. }
  90. .hierarchical-select-wrapper .dropbox table {
  91. margin: 0;
  92. width: auto;
  93. max-width: 100%;
  94. min-width: 20em;
  95. color: gray;
  96. font-size: 90%;
  97. border: 1px solid gray;
  98. }
  99. tr.dropbox-entry {
  100. line-height: 1.3em;
  101. padding: .3em .6em;
  102. }
  103. tr.dropbox-entry.even {
  104. background-color: transparent;
  105. border-bottom: 1px solid #CCCCCC;
  106. }
  107. tr.dropbox-entry.odd {
  108. background-color: #EDF5FA;
  109. border-bottom: 1px solid #CCCCCC;
  110. }
  111. tr.dropbox-entry.first {
  112. border-top: 1px solid gray;
  113. }
  114. tr.dropbox-entry.last {
  115. border-bottom: 1px solid gray;
  116. }
  117. .dropbox-selected-item {
  118. font-weight: bold;
  119. }
  120. .hierarchical-select-item-separator {
  121. padding-left: .5em;
  122. padding-right: .5em;
  123. }
  124. td.dropbox-remove *,
  125. td.dropbox-remove a:link,
  126. td.dropbox-remove a:visited {
  127. color: #F7A54F;
  128. text-decoration: none;
  129. }
  130. td.dropbox-remove a:hover {
  131. text-decoration: underline;
  132. }
  133. tr.dropbox-is-empty {
  134. padding: .5em 1em;
  135. }
  136. /* The "Update" button and help text (used when Javascript is disabled). */
  137. .hierarchical-select-wrapper .nojs .update-button {
  138. margin: 0 0 1em;
  139. }
  140. .hierarchical-select-wrapper .nojs .help-text {
  141. font-size: 90%;
  142. color: transparent;
  143. display: block;
  144. border: 1px dotted black;
  145. overflow: hidden;
  146. width: 34em;
  147. height: 1.2em;
  148. padding: .6em;
  149. line-height: normal;
  150. }
  151. .hierarchical-select-wrapper .nojs .help-text:hover {
  152. height: auto;
  153. width: auto;
  154. min-width: 25em;
  155. max-width: 45em;
  156. color: gray;
  157. }
  158. .hierarchical-select-wrapper .nojs .help-text .ask-to-hover {
  159. color: gray;
  160. font-style: italic;
  161. }
  162. .hierarchical-select-wrapper .nojs .help-text:hover .ask-to-hover {
  163. display: none;
  164. }
  165. .hierarchical-select-wrapper .nojs .help-text .highlight {
  166. text-decoration: underline;
  167. }
  168. .hierarchical-select-wrapper .nojs .help-text .warning {
  169. color: red;
  170. }
  171. .hierarchical-select-wrapper .nojs .help-text .solutions {
  172. margin: 0;
  173. padding: 0;
  174. }
  175. /* The 'waiting' class is set dynamically, during a callback to the server. */
  176. .hierarchical-select-wrapper.waiting {
  177. opacity: 0.5;
  178. /* IE doesn't support CSS 2 properly. */
  179. zoom: 1;
  180. filter: alpha(opacity=50);
  181. }
  182. /* Use a monospace font for the import/export config code text areas. */
  183. .hierarchical-select-config-code {
  184. font-family: 'Monaco', 'Lucida Console', 'Consolas', monospace;
  185. }