Contents

// ====================================================================================================================
// BUTTON GROUPS
// ====================================================================================================================
@if $button-groups {
	.btn-group {
		@extend .clearfix;
		@include inline-block;
		margin: 0;
		// position: relative;

		> * {
			float: left;
			list-style-type: none;
			// position: relative;
		}

		&[data-width] .btn,
		> *[data-width] .btn {
			@extend %width-100;
			padding-left: 0;
			padding-right: 0;
		}

		// Space multiple inline groups
		// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
		+ .btn-group { margin-left: em(5px); }

		// Float button and reapply border radius
		// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
		> .btn,
		> * .btn {
			@include border-radius(0);
			float: left;
		}

		> * + * 							{ margin-left: -$input-border; }
		> *:first-child,
		> *:first-child .btn 				{ @include border-radius($base-border-radius 0 0 $base-border-radius); }
		> *:last-child,
		> *:last-child .btn 				{ @include border-radius(0 $base-border-radius $base-border-radius 0); }
		> *:last-child:first-child,
		> *:last-child:first-child .btn 	{ @include border-radius($base-border-radius); }

		// On hover/focus/active, bring the proper btn to front
		// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
		> .btn:hover,
		> .btn:focus,
		> .btn:active,
		> .btn.active {
			z-index: 2;
		}

	}
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
rapido-css-0.0.3	stylesheets/components/_button-groups.scss