Compare commits

..

No commits in common. "2fda35a3222f5860ce31b2e23128b9532c956562" and "6d0609858de2fb29f4cdad8721c06b58af822b7e" have entirely different histories.

6 changed files with 68 additions and 176 deletions

1
.gitignore vendored
View File

@ -6,4 +6,3 @@ dist
*.swp *.swp
.cache .cache
.idea .idea
src/table-expand.zip

View File

@ -1,11 +1,5 @@
import $ from 'jquery'; import $ from 'jquery';
import 'what-input'; import 'what-input';
//https://get.foundation/building-blocks/blocks/table-expand.html
$('[data-open-details]').click(function (e) {
e.preventDefault();
$(this).next().toggleClass('is-active');
$(this).toggleClass('is-active');
});
// Foundation JS relies on a global variable. In ES6, all imports are hoisted // Foundation JS relies on a global variable. In ES6, all imports are hoisted
// to the top of the file so if we used `import` to import Foundation, // to the top of the file so if we used `import` to import Foundation,
@ -20,6 +14,4 @@ require('foundation-sites');
//import './lib/foundation-explicit-pieces'; //import './lib/foundation-explicit-pieces';
$(document).foundation(); $(document).foundation();

View File

@ -1,5 +1,5 @@
table { table {
tbody .table-expand-row{ tr._expand_site_item {
border-top: $global-border-archive; border-top: $global-border-archive;
} }
th { th {
@ -11,70 +11,3 @@ table {
line-height: 1.6; line-height: 1.6;
} }
} }
// --
// table expand
// https://get.foundation/building-blocks/blocks/table-expand.html
.table-expand {
// margin-top: 5rem;
td {
// color: $dark-gray;
}
tr {
// border: 1px solid $light-gray;
}
.text-right {
// padding-right: 3rem;
}
}
.table-expand-row {
&.is-active {
.expand-icon::after {
content: '-';
}
}
.expand-icon::after {
content: '+';
float: right;
}
}
// this is where the magic happens
.table-expand-row-content {
display: none;
}
.table-expand-row-content {
&.is-active {
display: table-row;
animation: fadeIn ease-in 1;
animation-fill-mode: both;
animation-duration: 0.5s;
}
}
.table-expand-row-nested {
column-span: 3;
// background-color: $light-gray;
&:first-child {
column-span: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
// end table expand
// --

View File

@ -149,7 +149,7 @@
.collections-list { .collections-list {
@include xy-grid; @include xy-grid;
header,main{ header,main,aside {
@include xy-cell(12); @include xy-cell(12);
@include flex; @include flex;
@include flex-align(center,top); @include flex-align(center,top);
@ -180,18 +180,45 @@
} }
} }
} }
.accordion-content { aside {
@include xy-grid(12);
figure {
@include xy-cell(4);
}
p {
@include xy-cell(6);
}
} }
} }
// end collections category // end collections category
//
// collections category
//--------------
.list-of-sites {
@include xy-grid;
header,.site-list,aside {
@include xy-cell(12);
@include flex;
@include flex-align(center,top);
padding: $global-padding*2 0;
}
header {
margin-top: 2*$global-margin;
border-top: 1px solid $body-font-color;
padding: $global-padding*2 0;
}
.site-list {
@include xy-grid;
article, table{
@include breakpoint(small){
@include xy-cell();
}
@include breakpoint(medium){
}
@include breakpoint(large){
}
margin-bottom:0;
}
}
aside {
}
}
// end collections category
//
// partners // partners
// for big announcemnts // for big announcemnts
//--------------------- //---------------------

View File

@ -4,4 +4,4 @@ layout: omeka
{{> section-collections-latest}} {{> section-collections-latest}}
<!-- {{> section-collections}} --> {{> section-collections}}

View File

@ -3,122 +3,63 @@
<header> <header>
<h2> Latest in collections</h2> <h2> Latest in collections</h2>
</header> </header>
<main class=""> <main class="">
<article class=""> <article class="">
<ul class="accordion" data-responsive-accordion-tabs="accordion small-accordion" data-multi-expand="true" data-allow-all-closed="true" data-deep-link="true"> <ul class="accordion" data-responsive-accordion-tabs="accordion small-accordion" data-allow-all-closed="true">
<li class="accordion-item title" data-accordion-item disabled> <li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title"> <a href="#" class="accordion-title">
<ul class=""> <ul class="">
<li class="title">Title</li> <li class="title">Title</li>
<li class="curator">Artist</li> <li class="artist">Artist</li>
<li class="collection-name">Collection</li> <li class="main">Main</li>
<li class="date">Date</li> <li class="category">Category</li>
</ul> </ul>
</a> </a>
<aside class="accordion-content" data-tab-content> <div class="accordion-content" data-tab-content>
<figure> </div>
</figure>
<p>
</p>
</aside>
</li> </li>
<li class="accordion-item" data-accordion-item> <li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title"> <a href="#" class="accordion-title">
<ul class=""> <ul class="">
<li class="title">Hangar</li> <li class="title">Conservation and Digitzation</li>
<li class="artist"></li> <li class="artist">Marta Louro</li>
<li class="category"></li> <li class="category">Instalation</li>
<li class="year"></li> <li class="year">2021</li>
</ul> </ul>
</a> </a>
<aside class="accordion-content" data-tab-content> <div class="accordion-content" data-tab-content>
<figure> </div>
</figure>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eaque unde quaerat reprehenderit ipsa ipsam, adipisci facere repellendus impedit at, quisquam dicta optio veniam quia nesciunt, inventore quod in neque magni?</p>
</aside>
</li>
<li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title">
<ul class="">
<li class="title">Modules</li>
<li class="artist">Chris</li>
<li class="category">Hangar people</li>
<li class="year">2021-03-09</li>
</ul>
</a>
<aside class="accordion-content" data-tab-content>
<img src="https://dev-archive.hangar.org/files/large/81/3D-Panoramic-Landscape-Image-768x288.jpg">
<p>You can extend the functionality of Omeka S by writing an add-on component called a module. Zend Framework provides a substantial framework for writing modules, but Omeka S provides extra structure that makes the modules installable, upgradeable, and integratable. You can extend the functionality of Omeka S by writing an add-on component called a module. Zend Framework provides a substantial framework for writing modules, but Omeka S provides extra structure that makes the modules installable, upgradeable, and integratable.</p>
<br>
<button class="go_to_site_button" onclick="window.location.href = '/s/modules'">
View
</button>
</aside>
</li> </li>
<li class="accordion-item" data-accordion-item> <li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title"> <a href="#" class="accordion-title">
<ul class=""> <ul class="">
<li class="title">Trees and cells</li> <li class="title">Light Scapes</li>
<li class="artist"></li> <li class="artist">Kim Doan</li>
<li class="category"></li> <li class="category">Performance</li>
<li class="year"></li> <li class="year">2021</li>
</ul> </ul>
</a> </a>
<aside class="accordion-content" data-tab-content> <div class="accordion-content" data-tab-content>
Here, some footnotes of structural imagination <br> </div>
<button class="go_to_site_button" onclick="window.location.href = '/s/trees-and-cells'">
View
</button>
</aside>
</li>
<li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title">
<ul class="">
<li class="title">VideoReplication</li>
<li class="artist"></li>
<li class="category"></li>
<li class="year"></li>
</ul>
</a>
<aside class="accordion-content" data-tab-content>
<figure>
</figure>
<p>
<button class="go_to_site_button" onclick="window.location.href = '/s/videoreplication'">
View
</button>
</p>
</aside>
</li> </li>
<li class="accordion-item" data-accordion-item> <li class="accordion-item" data-accordion-item>
<a href="#" class="accordion-title"> <a href="#" class="accordion-title">
<ul class=""> <ul class="">
<li class="title">Werewolves</li> <li class="title">I will grow my burger</li>
<li class="artist">Antonio + Chris</li> <li class="artist">Oron Catts and Andy Gracie</li>
<li class="category">Hangar people</li> <li class="category">Research</li>
<li class="year">2021-03-02</li> <li class="year">2021</li>
</ul> </ul>
</a> </a>
<aside class="accordion-content" data-tab-content> <div class="accordion-content" data-tab-content>
<figure> </div>
<img src="https://dev-archive.hangar.org/files/large/89/scary-werewolf.jpg">
</figure>
<p>
The werewolf is a widespread concept in European folklore, existing in many variants, which are related by a common development of a Christian interpretation of underlying European folklore developed during the medieval period. From the early modern period, werewolf beliefs also spread to the New World with colonialism. Belief in werewolves developed in parallel to the belief in witches, in the course of the Late Middle Ages and the Early Modern period. <br>
<button class="button small" onclick="window.location.href = '/s/Werewolves'">
View
</button>
</p>
</aside>
</li> </li>
</ul> </ul>
</article> </article>
</main> </main>
<aside> <aside>
<nav>
<a href="#" class="button">More than 200 Biomedia Artworks</a>
</nav>
</aside> </aside>
</section> </section>