removed grey color from figure in accordion

to be able to fix accordion-content layout

asset/scss/_settings.scss

@@ -322,7 +322,7 @@ $button-border: 2px solid $button-color;//1px solid transparent;
 $button-hollow-border-width: 2px;
 $button-sizes: (
   tiny: 0.7rem,
-  small: 0.95rem,
+  small: 0.9rem,
   default: 1.6rem,
   large: 2.4rem,
 );

asset/scss/components/_accordion.scss

@@ -1,11 +1,26 @@
 .accordion-item {
   border-bottom: $global-border-archive;
+  &:first-of-type {
+    max-height: 5rem;
+    .is-active{
+      max-height: 5rem;
+      padding:0;
+    }
+    .accordion-title::before{
+      content:'';
+    }
+    a {
+      color: black;
+      &:hover,&:active,&:focus{
+        color: black;
+        cursor: not-allowed;
+      }
+    }
+  }
 }
 .accordion-title {
   ul,ol {
     list-style: none;
-    //@include flex;
-    //@include flex-align(justify,middle);
     @include xy-grid;
   }
   li {
@@ -14,3 +29,4 @@
     text-align:left;
   }
 }
+

asset/scss/components/_buttons.scss

@@ -1,23 +1,28 @@
 button,.button {
-  &:not(.large,.small,.tiny){
-    // min-width: 20rem;
+  &.small{
+    padding: $global-padding*0.5 $global-padding*1.5;
   }
-    &.primary {
-      color: $white;
-    }
-    &.success {
-      border-color: $success-color;
-    }
-    &.alert {
-      border-color: $alert-color;
-      color: $white;
-      &:hover{
-        color:$white;
-      }
-    }
-    &.secondary {
-      border-color: $secondary-color;
+  &.tiny{
+    padding: $global-padding*0.3 $global-padding*1.1;
+  }
+  &:not(.large,.small,.tiny){
+  }
+  &.primary {
+    color: $white;
+  }
+  &.success {
+    border-color: $success-color;
+  }
+  &.alert {
+    border-color: $alert-color;
+    color: $white;
+    &:hover{
+      color:$white;
     }
+  }
+  &.secondary {
+    border-color: $secondary-color;
+  }
 }
 .hero {
   button,.button {

asset/scss/modules/_content.scss

@@ -41,7 +41,10 @@ main {
         text-align: center;
       }
     }
-    .entry-content {
+    section {
+      padding: $global-padding $global-padding*2;
+    }
+    .entry-content,.omekas-entry-content {
       @include breakpoint(small){
         @include xy-cell(12);
         padding: $global-padding*2 ;
@@ -65,6 +68,32 @@ main {
 }
 
 
+//
+// page category
+//--------------
+.index{
+  main {
+    article {
+      header {
+        .entry-title {
+        }
+      }
+      section {
+      }
+      .entry-content,.omekas-entry-content {
+        @include breakpoint(small){
+        }
+        @include breakpoint(medium){
+          max-width: unset;
+        }
+        @include breakpoint(xlarge){
+          max-width: unset;
+        }
+      }
+    }
+  }
+}
+
 //
 // news category
 //--------------
@@ -148,12 +177,11 @@ main {
 
 .collections-list {
   @include xy-grid;
-  width:100vw;
+  padding:0;
   header,main{
     @include xy-cell(12);
     @include flex;
     @include flex-align(center,top);
-    padding: $global-padding*2 0;
   }
   header {
     margin-top: 2*$global-margin;
@@ -162,10 +190,15 @@ main {
   }
   main {
     @include xy-grid;
-    article{
+    padding: 0;
+    margin: 0;
+    article {
       @include card-container();
-      @include breakpoint(small){
         @include xy-cell();
+        width: 100%; 
+        padding: 0;
+        margin: 0;
+      @include breakpoint(small){
         font-size: $global-font-size*0.7;
       }
       @include breakpoint(medium){
@@ -175,18 +208,18 @@ main {
       }
       margin-bottom:0;
     }
-    table {
-      thead,tbody,tfoot {
-        margin: $global-padding*2;
-      }
-    }
   }
   .accordion-content {
+    padding-top: 0;
     section {
       @include xy-grid;
+      padding-top: 0;
+      padding-bottom: 0;
       @include breakpoint(small){
         figure {
           @include xy-cell(12);
+          margin-left:0;
+          margin-right:0;
         }
         p {
           @include xy-cell(12);
@@ -195,6 +228,7 @@ main {
       @include breakpoint(medium){
         figure {
           @include xy-cell(3);
+          margin-left: 0;
         }
         p {
           @include xy-cell(9);
@@ -378,5 +412,4 @@ main {
     width: 100%;
 
   }
-
 //end omeka specific styles

gulpfile.js

@@ -28,6 +28,7 @@ function serve() {
   });
 
   gulp.watch("asset/scss/*.scss", sass);
+  gulp.watch("asset/scss/*/*.scss", sass);
   gulp.watch("*.html").on('change', browserSync.reload);
 }
 

view/common/site-list-entry.phtml

@@ -28,6 +28,7 @@ $summary = $showSummary ? $site->summary() : null;
     </ul>
   </a>
   <aside class="accordion-content" data-tab-content>
+   <section>
     <figure>
       <?php if ($site_meta_values != null): ?>
         <img src="<?= $site_meta_values['thumbnail']; ?>" />
@@ -39,5 +40,6 @@ $summary = $showSummary ? $site->summary() : null;
       <?php endif; ?>
       <a class="button small" href="<?= $site->siteUrl() ?>">View</a>
     </p>
+   </section>
   </aside>
 </li>

view/layout/layout.phtml

@@ -93,8 +93,9 @@ endif;
             <!-- </div> -->
         </content>
         <script>
-          $(document).foundation();
+//          $(document).foundation();
         </script>
+<script src="<?php echo $this->assetUrl('js/foundation.js'); ?>"></script>
 
     </body>
 </html>

view/omeka/site/item/show.phtml

@@ -7,34 +7,29 @@ $itemMedia = $item->media();
 $showLayout = $this->themeSetting('show_layout');
 ?>
 
-<!-- arc-hive insert begins -->
+<!-- arc-hive page header-image insert begins -->
 <?php
-//$site->pages();
-// set header image
-$img_src = $this->getHelperPluginManager()->get('archiveSiteMeta')->getSiteImage($site);
-if (!$img_src) {
-  $img_src = '/themes/archive/asset/img/default-header-image.jpg';
-}
-if ($this->site->title() == "Collections") {
-  $image_height = "300px";
-} else {
-  $image_height = "200px";
-}
+$img_src = null;
+  $img_src = $this->getHelperPluginManager()->get('archiveSiteMeta')->getSiteImage($site);
+  if (!$img_src) {
+    $img_src = $this->assetUrl('img/ARC-HIVE-logo.svg');
+  }
+  ?>
+  <style>
+  .arc-page-header-img {
+     content: url("<?= $img_src ?>");
+  }
+  </style>
+  <?php
 ?>
-<style>
-#archive_header_img {
-   background: url("<?= $img_src ?>") no-repeat;
-   width: 100%;
-   height: <?= $image_height ?>;
-}
-</style>
 <script>
 <?php
   $_html = '<a href="'.$this->site->url().'">'.$this->site->title().'</a>';
 ?>
 $("#archive_page_title").html('<?php echo $_html ?>');
 </script>
-<!-- arc-hive insert ends -->
+<!-- arc-hive page header-image insert ends -->
+
 
 
 <div class="resource-title">

view/omeka/site/media/show.phtml

@@ -3,33 +3,28 @@ $translate = $this->plugin('translate');
 ?>
 <?php $this->htmlElement('body')->appendAttribute('class', 'media resource show'); ?>
 
-<!-- arc-hive insert begins -->
+<!-- arc-hive page header-image insert begins -->
 <?php
-//$site->pages();
-$img_src = $this->getHelperPluginManager()->get('archiveSiteMeta')->getSiteImage($site);
-if (!$img_src) {
-  $img_src = '/themes/archive/asset/img/default-header-image.jpg';
-}
-if ($this->site->title() == "Collections") {
-  $image_height = "300px";
-} else {
-  $image_height = "200px";
-}
+$img_src = null;
+  $img_src = $this->getHelperPluginManager()->get('archiveSiteMeta')->getSiteImage($site);
+  if (!$img_src) {
+    $img_src = $this->assetUrl('img/ARC-HIVE-logo.svg');
+  }
+  ?>
+  <style>
+  .arc-page-header-img {
+     content: url("<?= $img_src ?>");
+  }
+  </style>
+  <?php
 ?>
-<style>
-#archive_header_img {
-   background: url("<?= $img_src ?>") no-repeat;
-   width: 100%;
-   height: <?= $image_height ?>;
-}
-</style>
 <script>
 <?php
   $_html = '<a href="'.$this->site->url().'">'.$this->site->title().'</a>';
 ?>
 $("#archive_page_title").html('<?php echo $_html ?>');
 </script>
-<!-- arc-hive insert ends -->
+<!-- arc-hive page header-image insert ends -->
 
 
 <div class="resource-title">