Commit 982aeea1 authored by Mark Otto's avatar Mark Otto
Browse files

Merge branch 'accordion-borders' of https://github.com/andresgalante/bootstrap into v4-dev

parents 6a52ebfe c0246e92
Showing with 30 additions and 1 deletion
+30 -1
...@@ -66,7 +66,7 @@ Multiple `<button>` or `<a>` can show and hide an element if they each reference ...@@ -66,7 +66,7 @@ Multiple `<button>` or `<a>` can show and hide an element if they each reference
Using the [card]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/card/) component, you can extend the default collapse behavior to create an accordion. Using the [card]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/card/) component, you can extend the default collapse behavior to create an accordion.
{% example html %} {% example html %}
<div id="accordion"> <div class="accordion" id="accordion">
<div class="card"> <div class="card">
<div class="card-header" id="headingOne"> <div class="card-header" id="headingOne">
<h5 class="mb-0"> <h5 class="mb-0">
......
...@@ -268,3 +268,32 @@ ...@@ -268,3 +268,32 @@
} }
} }
} }
//
// Accordion
//
.accordion {
.card:not(:first-of-type):not(:last-of-type) {
border-bottom: 0;
border-radius: 0;
}
.card:not(:first-of-type) {
.card-header:first-child {
border-radius: 0;
}
}
.card:first-of-type {
border-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.card:last-of-type {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment