just-the-cards 0.2.5 → 0.2.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3efe1707c66ee0109382bd4f7ebbc278008e453c3b1e75403f581c7958eef97d
-  data.tar.gz: f5d2d3fdd2128dfa24a634808ad36231908ddcbe5ee4dd571be4d7639ec42341
+  metadata.gz: 8eca8837c240b86c77bc9a311a10e1fd61c9ddfabeda208c566c49f3267d398c
+  data.tar.gz: b1dd671fcd526d55ca030c209e56325fb4255b55a0545aa46a211a839eeee6c4
 SHA512:
-  metadata.gz: 997f4a0105470884f676960d1c33210f6e4df62f91641d9df4ecc086b12182ab9e2e398ba9475a957d00f5412226b39848c84bf6bb6ae15af101507bc8bf6fce
-  data.tar.gz: f7c10c11a9e39ea9108e32b45b870d1c4396c64185e1bd8e2fb32deabc0ad9788c619398175b5da1e3014fb615e4c572b9d45bf37a30f93b62e9e42e467a4ad5
+  metadata.gz: 5ba96ca49b671d9d3a6340d4445aea2841a086dc032a03338f26bdce20d33d1bced16e0131b5b79dec7ee619e79d9a158a34238aa80910aeb653ed061971776a
+  data.tar.gz: febedd249b9145170b665538ff8d1553eba8a37a9da10ff153a47ac7d953fb57e88d2326b68fe682063be28a6b4a952b15d9e8ad28e9b215a3bba1c747b591c3

data/_includes/card/accordion-option.html

@@ -0,0 +1,27 @@
+<!-- 
+    Include parameters are:
+    - [type] Type of source: must match one .html in the card folder f.e image
+    - [source] Source: can be a path to an image, pdf, video...
+-->
+
+{% if include.source != nil and include.source != "" %}
+
+<div class="card">
+    <div class="card-header" id="heading{{ include.type | capitalize }}">
+        <h2 class="mb-0">
+            <button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse"
+                data-target="#collapse{{ include.type | capitalize }}" aria-expanded="true"
+                aria-controls="collapse{{ include.type | capitalize }}">
+                {{ include.type | capitalize }}
+            </button>
+        </h2>
+    </div>
+    <div id="collapse{{ include.type | capitalize }}" class="collapse"
+        aria-labelledby="heading{{ include.type | capitalize }}" data-parent="#accordionSources">
+        <div class="card-body">
+            {% include card/{{ include.type }}.html source=include.source %}
+        </div>
+    </div>
+</div>
+
+{% endif %}

data/_includes/card/image.html

@@ -0,0 +1 @@
+<img src="{{include.source}}" class="img-fluid" alt="Card image">

data/_includes/card/pdf.html

@@ -0,0 +1 @@
+<object data="{{page.pdf}}" width="1000" height="700" type='application/pdf'></object>

data/_includes/card/tablature.html

@@ -0,0 +1,5 @@
+<div class="container">
+
+    {% include alphatab.html source=include.source %}
+
+</div>

data/_includes/card/video.html

@@ -0,0 +1,13 @@
+{% if include.source contains "youtube" %}
+<div class="embed-responsive embed-responsive-16by9">
+    <iframe frameborder="0" src={{include.source}} allowfullscreen>
+    </iframe>
+</div>
+
+{% else %}
+<div class="embed-responsive embed-responsive-16by9">
+    <iframe src="https://docs.google.com/gview?url={{include.source}}&embedded=true" frameborder="0"
+        allowfullscreen></iframe>
+</div>
+
+{% endif %}

data/_layouts/card.html

@@ -3,12 +3,6 @@ layout: default
 show_title: false
 ---
 
-{% if page.image != nil %}
-<div class="container text-center">
-    <img src="{{ page.image }}" class="img-fluid" alt="Card image">
-</div>
-{% endif %}
-
 <h2>{{page.title}}</h2>
 
 {% if page.date != nil %}
@@ -23,47 +17,19 @@ show_title: false
 
 <p>{{page.content | markdownify }}</p>
 
-<div class="container">
-
-    {% if page.tablature != nil and page.tablature != "" %}
-    <div class="row">
-        {% include alphatab.html source=page.tablature %}
-    </div>
-    {% endif %}
-
-    <hr>
+<div class="accordion" id="accordionSources">
+    <!-- Image -->
+    {% include card/accordion-option.html type='image' source=page.image %}
 
-    {% if page.pdf != nil and page.pdf != ""%}
-    <div class="row">
-        <h3>Check the PDF here</h3>
-        <div class="embed-responsive embed-responsive-16by9">
-            <object data="{{page.pdf}}" width="1000" height="1000" type='application/pdf'></object>
-        </div>
-    </div>
-    {% endif %}
-    {% if page.video != nil and page.video != "" %}
+    <!-- PDF -->
+    {% include card/accordion-option.html type='pdf' source=page.pdf %}
 
-    <hr>
+    <!-- Video -->
+    {% include card/accordion-option.html type='video' source=page.video %}
 
-    <div class="row">
-        <h3>Check the Video demo here</h3>
-
-        {% if page.video contains "youtube" %}
-        <div class="embed-responsive embed-responsive-16by9">
-            <iframe frameborder="0" src={{page.video}} allowfullscreen>
-            </iframe>
-        </div>
-
-        {% else %}
-        <div class="embed-responsive embed-responsive-16by9">
-            <iframe src="https://docs.google.com/gview?url={{page.video}}&embedded=true" frameborder="0"
-                allowfullscreen></iframe>
-        </div>
-
-        {% endif %}
-
-    </div>
-    {% endif %}
+    <!-- Tablature -->
+    {% include card/accordion-option.html type='tablature' source=page.tablature %}
 </div>
 
+
 {% include back_url.html %}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: just-the-cards
 version: !ruby/object:Gem::Version
-  version: 0.2.5
+  version: 0.2.6
 platform: ruby
 authors:
 - juandspy
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2022-06-04 00:00:00.000000000 Z
+date: 2022-07-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -36,6 +36,11 @@ files:
 - _config.yml
 - _includes/alphatab.html
 - _includes/back_url.html
+- _includes/card/accordion-option.html
+- _includes/card/image.html
+- _includes/card/pdf.html
+- _includes/card/tablature.html
+- _includes/card/video.html
 - _includes/card_preview.html
 - _includes/count_children.html
 - _includes/footer.html