You are here

Home » API reference » Select with Style 7

department-store.css in Select with Style 7 

/* CSS "skin" for use with a department store or similar vocabulary.
 *
 * The group names must correspond to the taxonomy terms in the vocabulary.
 * Either change the group names below or change the term names to match. Or 
 * specify a transformation callback function on the "Select List Options" 
 * section of the taxonomy term field's configuration panel.
 * Term names may be mixed case and may contain spaces and some special characters.
 *
 * Icons taken from mapicons.nicolasmollet.com and customised using this URL:
 * http://mapicons.nicolasmollet.com/category/markers/stores/apparel?custom_color=c21393&style=simple
 */

.option-parent,
.option-child {
  font-size: 15px;
  height: 24px;
  padding: 3px 0 0 29px;
}
.option-parent.depth-1,
.option-child.depth-1 {
  margin-left: 22px;
}

.group-bags           { background: url(department-store-icons/bags.png)          no-repeat -3px -13px; }
.group-hats           { background: url(department-store-icons/hats.png)          no-repeat -3px -13px; }
.group-jewelry        { background: url(department-store-icons/jewelry.png)       no-repeat -3px -13px; }
.group-lingerie       { background: url(department-store-icons/lingerie.png)      no-repeat -3px -13px; }
.group-mens-fashion   { background: url(department-store-icons/mens-fashion.png)  no-repeat -3px -13px; }
.group-perfumes       { background: url(department-store-icons/perfumes.png)      no-repeat -3px -13px; }
.group-shoes          { background: url(department-store-icons/shoes.png)         no-repeat -3px -13px; }
.group-stationary     { background: url(department-store-icons/stationary.png)    no-repeat -3px -13px; }
.group-textiles       { background: url(department-store-icons/textiles.png)      no-repeat -3px -13px; }
.group-womens-fashion { background: url(department-store-icons/womens-fashion.png)no-repeat -3px -13px; }

File

select_with_style/css/department-store.css
View source 
  1. 

  2. /* CSS "skin" for use with a department store or similar vocabulary.

  3.  *

  4.  * The group names must correspond to the taxonomy terms in the vocabulary.

  5.  * Either change the group names below or change the term names to match. Or 

  6.  * specify a transformation callback function on the "Select List Options" 

  7.  * section of the taxonomy term field's configuration panel.

  8.  * Term names may be mixed case and may contain spaces and some special characters.

  9.  *

  10.  * Icons taken from mapicons.nicolasmollet.com and customised using this URL:

  11.  * http://mapicons.nicolasmollet.com/category/markers/stores/apparel?custom_color=c21393&style=simple

  12.  */

  13. 

  14. .option-parent,

  15. .option-child {

  16.   font-size: 15px;

  17.   height: 24px;

  18.   padding: 3px 0 0 29px;

  19. }

  20. .option-parent.depth-1,

  21. .option-child.depth-1 {

  22.   margin-left: 22px;

  23. }

  24. 

  25. .group-bags           { background: url(department-store-icons/bags.png)          no-repeat -3px -13px; }

  26. .group-hats           { background: url(department-store-icons/hats.png)          no-repeat -3px -13px; }

  27. .group-jewelry        { background: url(department-store-icons/jewelry.png)       no-repeat -3px -13px; }

  28. .group-lingerie       { background: url(department-store-icons/lingerie.png)      no-repeat -3px -13px; }

  29. .group-mens-fashion   { background: url(department-store-icons/mens-fashion.png)  no-repeat -3px -13px; }

  30. .group-perfumes       { background: url(department-store-icons/perfumes.png)      no-repeat -3px -13px; }

  31. .group-shoes          { background: url(department-store-icons/shoes.png)         no-repeat -3px -13px; }

  32. .group-stationary     { background: url(department-store-icons/stationary.png)    no-repeat -3px -13px; }

  33. .group-textiles       { background: url(department-store-icons/textiles.png)      no-repeat -3px -13px; }

  34. .group-womens-fashion { background: url(department-store-icons/womens-fashion.png)no-repeat -3px -13px; }

  35.