scss for Superfish

This is a scss file to generate css for Superfish http://users.tpg.com.au/j_birch/plugins/superfish/ /* * Sample SCSS for adding Superfish styles to themes. * * Instructions: * * 1. Change the #block-superfish-1 (below) to the ID of your Superfish menu. * * 2. Add the SCSS to your theme, either as a separate SCSS file or as a part of the main SCSS file. * * 3. Note that by removing the .sf-style-default, the style will be applied to the menu regardless of * the Style selected in the block configuration. * */ // You can add these variables to your _base.scss $superfish-1-color: #fff; // links $superfish-1-background-color-level-first: #A3BA54; $superfish-1-background-color-level-second: #A3BA54; $superfish-1-background-color-level-third: #A3BA54; $superfish-1-background-color-level-fourth: #008a00; // hover .sf-menu.sf-style-default { float: left; margin-bottom: 1em; padding: 0; } .sf-menu.sf-style-default.sf-navbar { width: 100%; } .sf-menu.sf-style-default ul { padding-left: 0; } .sf-menu.sf-style-default a, .sf-menu.sf-style-default a:visited, .sf-menu.sf-style-default span.nolink { border-left: 1px solid #fff; border-top: 1px solid #cfdeff; color: $superfish-1-color; padding: 0.75em 1em; } .sf-menu.sf-style-default a.sf-with-ul, .sf-menu.sf-style-default span.nolink.sf-with-ul { padding-right: 2.25em; } .sf-menu.sf-style-default.rtl a.sf-with-ul, .sf-menu.sf-style-default.rtl span.nolink.sf-with-ul { padding-left: 2.25em; padding-right: 1em; } .sf-menu.sf-style-default span.sf-description { color: $superfish-1-color; display: block; font-size: 0.833em; line-height: 1.5; margin: 5px 0 0 5px; padding: 0; } .sf-menu.sf-style-default.rtl span.sf-description { margin: 5px 5px 0 0; } .sf-menu.sf-style-default li, .sf-menu.sf-style-default.sf-navbar { background: $superfish-1-background-color-level-first } .sf-menu.sf-style-default li li { background: $superfish-1-background-color-level-second; } .sf-menu.sf-style-default li li li { background: $superfish-1-background-color-level-third; } .sf-menu.sf-style-default li:hover, .sf-menu.sf-style-default li.sfHover, .sf-menu.sf-style-default a:focus, .sf-menu.sf-style-default a:hover, .sf-menu.sf-style-default a:active, .sf-menu.sf-style-default span.nolink:hover { background: $superfish-1-background-color-level-fourth; outline: 0; } div.sf-accordion-toggle.sf-style-default a { background: $superfish-1-background-color-level-first; border-left: 1px solid #fff; border-top: 1px solid #cfdeff; color: $superfish-1-color; padding: 1em; } div.sf-accordion-toggle.sf-style-default a.sf-expanded, .sf-menu.sf-style-default.sf-accordion li.sf-expanded { background-color: $superfish-1-background-color-level-fourth; } div.sf-accordion-toggle.sf-style-default a.sf-expanded, .sf-menu.sf-style-default.sf-accordion li.sf-expanded > a, .sf-menu.sf-style-default.sf-accordion li.sf-expanded > span.nolink { font-weight: bold; } .sf-menu.sf-style-default.sf-accordion li a.sf-accordion-button { font-weight: bold; position: absolute; right: 0; top: 0; z-index: 499; } .sf-menu.sf-style-default.sf-accordion li li a, .sf-menu.sf-style-default.sf-accordion li li span.nolink { padding-left: 2em; } .sf-menu.sf-style-default.sf-accordion li li li a, .sf-menu.sf-style-default.sf-accordion li li li span.nolink { padding-left: 3em; } .sf-menu.sf-style-default.sf-accordion li li li li a, .sf-menu.sf-style-default.sf-accordion li li li li span.nolink { padding-left: 4em; } .sf-menu.sf-style-default.sf-accordion li li li li li a, .sf-menu.sf-style-default.sf-accordion li li li li li span.nolink { padding-left: 5em; } .sf-menu.sf-style-default.rtl.sf-accordion li li a, .sf-menu.sf-style-default.rtl.sf-accordion li li span.nolink { padding-left: auto; padding-right: 2em; } .sf-menu.sf-style-default.rtl.sf-accordion li li li a, .sf-menu.sf-style-default.rtl.sf-accordion li li li span.nolink { padding-left: auto; padding-right: 3em; } .sf-menu.sf-style-default.rtl.sf-accordion li li li li a, .sf-menu.sf-style-default.rtl.sf-accordion li li li li span.nolink { padding-left: auto; padding-right: 4em; } .sf-menu.sf-style-default.rtl.sf-accordion li li li li li a, .sf-menu.sf-style-default.rtl.sf-accordion li li li li li span.nolink { padding-left: auto; padding-right: 5em; } .sf-menu.sf-style-default ul.sf-megamenu li.sf-megamenu-wrapper ol, .sf-menu.sf-style-default ul.sf-megamenu li.sf-megamenu-wrapper ol li { margin: 0; padding: 0; } .sf-menu.sf-style-default ul.sf-megamenu li.sf-megamenu-wrapper a.menuparent, .sf-menu.sf-style-default ul.sf-megamenu li.sf-megamenu-wrapper span.nolink.menuparent { font-weight: bold; } .sf-menu.sf-style-default ul.sf-megamenu li.sf-megamenu-wrapper ol li.sf-megamenu-column { display: inline; float: left; } .sf-menu.sf-style-default.rtl ul.sf-megamenu li.sf-megamenu-wrapper ol li.sf-megamenu-column { float: right; }
Etiquetas