Change accordion attr open => isOpen

coliquio · Jun 19, 2020 · d2adb81 · d2adb81
1 parent 7cc07e1
commit d2adb81
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 64 deletions.
diff --git a/build/index.js b/build/index.js
diff --git a/build/style.css b/build/style.css
@@ -89,65 +89,6 @@
       border: none;
       background: none;
       color: var(--green-darken-10); }
-.wp-block-coliquio-accordion-item {
-  font-family: "Source Sans Pro", sans-serif; }
-  .wp-block-coliquio-accordion-item[open] .accordion-item-summary:before {
-    transform: rotate(270deg); }
-  .wp-block-coliquio-accordion-item .accordion-item-summary {
-    font-size: 1rem;
-    line-height: 1.75rem;
-    cursor: pointer;
-    display: block;
-    font-weight: 400;
-    color: var(--blue-base);
-    user-select: none;
-    padding-left: 0.9375rem;
-    list-style: none; }
-    @media (min-width: 768px) {
-      .wp-block-coliquio-accordion-item .accordion-item-summary {
-        font-size: 1.5rem; } }
-    .wp-block-coliquio-accordion-item .accordion-item-summary::-webkit-details-marker {
-      display: none; }
-    .wp-block-coliquio-accordion-item .accordion-item-summary:before {
-      content: "\A";
-      border-style: solid;
-      border-width: 5px 4px 5px 0;
-      border-color: transparent var(--black-lighten-20) transparent transparent;
-      position: absolute;
-      transform: rotate(180deg);
-      line-height: 2.75rem;
-      margin-top: .455rem; }
-      @media (min-width: 768px) {
-        .wp-block-coliquio-accordion-item .accordion-item-summary:before {
-          font-size: 1rem; } }
-    .wp-block-coliquio-accordion-item .accordion-item-summary .summary-content {
-      margin-left: 0.9375rem; }
-    .wp-block-coliquio-accordion-item .accordion-item-summary sup {
-      line-height: 0; }
-  .wp-block-coliquio-accordion-item .accordion-item-content {
-    padding: .625rem;
-    margin-left: 1.25rem;
-    color: var(--black-base);
-    font-size: 1rem;
-    line-height: 1.2rem;
-    font-weight: 400;
-    margin-bottom: 1rem; }
-    @media (min-width: 768px) {
-      .wp-block-coliquio-accordion-item .accordion-item-content {
-        font-size: 1.125rem;
-        line-height: 1.5625rem; } }
-  .wp-block-coliquio-accordion-item .wp-block-coliquio-image figcaption {
-    color: var(--black-lighten-40);
-    display: block;
-    font-size: 1rem;
-    font-weight: 400;
-    line-height: 1.3rem; }
-  .wp-block-coliquio-accordion-item p {
-    margin-top: 1rem;
-    margin-bottom: 1rem; }
-  .wp-block-coliquio-accordion-item .wp-block-coliquio-image {
-    margin-left: 0;
-    margin-right: 0; }
 /**
   Use this for hover states
  */
@@ -280,3 +221,62 @@
     max-width: 90px;
     font-size: 0.8rem;
     color: var(--white-base); }
+.wp-block-coliquio-accordion-item {
+  font-family: "Source Sans Pro", sans-serif; }
+  .wp-block-coliquio-accordion-item[open] .accordion-item-summary:before {
+    transform: rotate(270deg); }
+  .wp-block-coliquio-accordion-item .accordion-item-summary {
+    font-size: 1rem;
+    line-height: 1.75rem;
+    cursor: pointer;
+    display: block;
+    font-weight: 400;
+    color: var(--blue-base);
+    user-select: none;
+    padding-left: 0.9375rem;
+    list-style: none; }
+    @media (min-width: 768px) {
+      .wp-block-coliquio-accordion-item .accordion-item-summary {
+        font-size: 1.5rem; } }
+    .wp-block-coliquio-accordion-item .accordion-item-summary::-webkit-details-marker {
+      display: none; }
+    .wp-block-coliquio-accordion-item .accordion-item-summary:before {
+      content: "\A";
+      border-style: solid;
+      border-width: 5px 4px 5px 0;
+      border-color: transparent var(--black-lighten-20) transparent transparent;
+      position: absolute;
+      transform: rotate(180deg);
+      line-height: 2.75rem;
+      margin-top: .455rem; }
+      @media (min-width: 768px) {
+        .wp-block-coliquio-accordion-item .accordion-item-summary:before {
+          font-size: 1rem; } }
+    .wp-block-coliquio-accordion-item .accordion-item-summary .summary-content {
+      margin-left: 0.9375rem; }
+    .wp-block-coliquio-accordion-item .accordion-item-summary sup {
+      line-height: 0; }
+  .wp-block-coliquio-accordion-item .accordion-item-content {
+    padding: .625rem;
+    margin-left: 1.25rem;
+    color: var(--black-base);
+    font-size: 1rem;
+    line-height: 1.2rem;
+    font-weight: 400;
+    margin-bottom: 1rem; }
+    @media (min-width: 768px) {
+      .wp-block-coliquio-accordion-item .accordion-item-content {
+        font-size: 1.125rem;
+        line-height: 1.5625rem; } }
+  .wp-block-coliquio-accordion-item .wp-block-coliquio-image figcaption {
+    color: var(--black-lighten-40);
+    display: block;
+    font-size: 1rem;
+    font-weight: 400;
+    line-height: 1.3rem; }
+  .wp-block-coliquio-accordion-item p {
+    margin-top: 1rem;
+    margin-bottom: 1rem; }
+  .wp-block-coliquio-accordion-item .wp-block-coliquio-image {
+    margin-left: 0;
+    margin-right: 0; }
diff --git a/src/accordion-item/index.js b/src/accordion-item/index.js
@@ -30,7 +30,7 @@ export const settings = {
     title: {
       type: 'string',
     },
-    open: {
+    isOpen: {
       type: 'boolean',
 		  default: false,
     }
@@ -54,10 +54,10 @@ export const settings = {
           <PanelBody>
             <ToggleControl
               label={ __( 'Open by default', 'atomic-blocks' ) }
-              checked={ attributes.open }
+              checked={ attributes.isOpen }
               onChange={ () =>
                 setAttributes( {
-                  open: ! attributes.open,
+                  isOpen: ! attributes.isOpen,
                 } )
               }
             />
@@ -84,7 +84,7 @@ export const settings = {
 
   save({ attributes, className }) {
     return (
-      <details open={ attributes.open }>
+      <details open={ attributes.isOpen }>
         <summary class="accordion-item-summary">
           <div class="summary-content">
             <RichText.Content