Skip to content

Instantly share code, notes, and snippets.

@angry-dan
Last active November 4, 2015 10:05
Show Gist options
  • Save angry-dan/2f15c4472f78848051c8 to your computer and use it in GitHub Desktop.
Save angry-dan/2f15c4472f78848051c8 to your computer and use it in GitHub Desktop.

Drupal's bootstrap theme converts Drupal's fieldsets into Bootstrap panels, but sadly doesn't include any kind of indication in the panel header that they are collapsible/expandible.

This nifty bit of sass will let you add a dropdown icon to the title:

<span class="glyphicon glyphicon-chevron-down pull-right"></span>

And have it animate when you expand/collapse the panel.

To use, simply override bootstrap-panel.tpl.php and throw that in just after the title is printed inside of the <?php if ($collapsible): ?>

.panel-title {
.glyphicon.pull-right {
line-height: inherit;
}
.glyphicon-chevron-down {
transition: transform 0.6s ease 0s;
transform: rotateX(180deg);
}
&.collapsed .glyphicon-chevron-down {
transform: rotateX(0deg);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment