Skip to content
Permalink
Browse files

fix(accordion): Adjusted styling to only target first children

  • Loading branch information...
Ayesha Mazumdar
Ayesha Mazumdar committed Oct 18, 2017
1 parent 418f8d7 commit 9f8f6012afe3894b7f4db92bda85b6b7fb145945
Showing with 55 additions and 6 deletions.
  1. +6 −6 ui/components/accordion/base/_index.scss
  2. +49 −0 ui/components/accordion/base/example.jsx
@@ -112,15 +112,15 @@
*/
.slds-is-open {

.slds-accordion__summary {
> .slds-accordion__summary {
margin-bottom: $spacing-small;

.slds-accordion__summary-action-icon {
transform: rotate(0deg);
}
}

.slds-accordion__summary-action-icon {
transform: rotate(0deg);
}

.slds-accordion__content {
> .slds-accordion__content {
visibility: visible;
opacity: 1;
height: auto;
@@ -14,6 +14,8 @@ import {
const referenceId01 = 'accordion-details-01';
const referenceId02 = 'accordion-details-02';
const referenceId03 = 'accordion-details-03';
const referenceId04 = 'accordion-details-04';
const referenceId05 = 'accordion-details-05';

let Accordion = props => (
<ul className={classNames('slds-accordion', props.className)}>
@@ -249,3 +251,50 @@ export let states = [
)
}
];

export let examples = [
{
id: 'nested-accordions',
label: 'Nested Accordions',
element: (
<Accordion>
<AccordionSection
summary="Accordion summary"
isOpen
referenceId={referenceId01}
>
<Accordion>
<AccordionSection
summary="Nested accordion summary"
isOpen
referenceId={referenceId04}
>
Accordion details - A
</AccordionSection>
<AccordionSection
summary="Nested accordion summary"
isOpen={false}
referenceId={referenceId05}
>
Accordion details - B
</AccordionSection>
</Accordion>
</AccordionSection>
<AccordionSection
summary="Accordion summary"
isOpen={false}
referenceId={referenceId02}
>
Accordion details - B
</AccordionSection>
<AccordionSection
summary="Accordion summary"
isOpen={false}
referenceId={referenceId03}
>
Accordion details - C
</AccordionSection>
</Accordion>
)
}
];

0 comments on commit 9f8f601

Please sign in to comment.
You can’t perform that action at this time.