misc improvements

Author: tong

assets/css/audio.scss

@@ -12,14 +12,14 @@ ol[data-type="playlist"] {
     position: relative;
     display: flex;
     flex-wrap: wrap;
-    color: var(--f_low);
+    color: var(--f_med);
     background: var(--b_low);
     background:
       linear-gradient(45deg, var(--b_low) 25%, transparent 25%, transparent 75%, var(--b_low) 75%),
       linear-gradient(45deg, var(--b_low) 25%, transparent 25%, transparent 75%, var(--b_low) 75%);
     background-size: 6px 6px;
     background-position: 0 0, 3px 3px;
-    border: 1px solid var(--f_low);
+    border: 1px solid var(--f_med);
     min-height: 300px;
     overflow: hidden;
     transition: border 0.2s;
@@ -44,7 +44,7 @@ ol[data-type="playlist"] {
     div.content {
       position: relative;
       z-index: 1000;
-      /*text-shadow: 1px 1px black;*/
+      //text-shadow: 1px 1px black;
     }
 
     .title {
@@ -67,15 +67,14 @@ ol[data-type="playlist"] {
       color: var(--f_med);
       background: var(--b_high);
       border: 0.5rem solid var(--f_med);
-
       // box-shadow: 1rem 1rem 2rem rgba(0, 0, 0, 0.2), -1rem -1rem 2rem rgba(0, 0, 0, 0.2);
       //transform: scale(1.05);
       //transition: transform 0.2s, box-shadow 0.2s;
       //z-index: 100000;
       img {
         filter: saturate(100%);
-        /*transform: scale(2);*/
-        /*transition: transform 600s;*/
+        // transform: scale(2);
+        // transition: transform 180s;
       }
 
       audio {
@@ -84,12 +83,7 @@ ol[data-type="playlist"] {
     }
 
     &:hover {
-      img {
-        /*filter: saturate(100%);*/
-      }
-
       audio {
-        /*display: block;*/
         opacity: 0.9;
       }
     }

assets/js/audio.js

@@ -5,10 +5,10 @@ const ol = document.querySelector('ol[data-type="playlist"]');
 const items = ol.querySelectorAll("li");
 const info = document.getElementById("audio-info")
 
-ol.style.opacity = "0";
-window.onload = () => {
-  ol.style.opacity = "1";
-}
+// ol.style.opacity = "0";
+// window.onload = () => {
+//   ol.style.opacity = "1";
+// }
 
 let activeItem;
 
@@ -40,6 +40,7 @@ items.forEach(item => {
   audio.onpause = e => {
     //console.log("pause")
     item.classList.remove("active")
+    //info.textContent = "";
     // activeItem = null;
   }
   // audio.onended = e => {
@@ -57,7 +58,7 @@ items.forEach(item => {
     }
     activeItem = item;
     item.classList.toggle("active")
-    info.textContent = item.querySelector(".title").textContent;
+    //info.textContent = item.querySelector(".title").textContent;
   }
   /*
   //console.log(item.getAttribute("href"));

content/audio/ACT_Pipedram.md

@@ -2,8 +2,6 @@
 title: "Pipedream"
 file: "ACT_Pipedream.mp3"
 project: a_certain_trio
-
 rss_ignore: true
 weight: 11
-
 ---

content/audio/Beach_Egina.md

@@ -5,5 +5,4 @@ recorder:
 details: ""
 rss_ignore: true
 weight: 50
-
 ---

content/audio/DFDB_Donauinsel_L.md

@@ -2,8 +2,6 @@
 title: "Kirschbaum - Donauinsel"
 file: "DFDB_Donauinsel_L.mp3"
 project: das_fluestern_der_baeume_in_wien
-
 rss_ignore: true
 weight: 5
-
 ---

content/audio/DFDB_Stadtpark_C.md

@@ -2,8 +2,6 @@
 title: "Kaukasische Flügelnuss - Stadtpark"
 file: "DFDB_Stadtpark_C.mp3"
 project: das_fluestern_der_baeume_in_wien
-
 rss_ignore: true
 weight: 7
-
 ---

content/audio/DfdB_Neuwaldegg_E.md

@@ -2,8 +2,6 @@
 title: "Buche - Neuwaldegg"
 file: "DFDB_Neuwaldegg_E.mp3"
 project: das_fluestern_der_baeume_in_wien
-
 rss_ignore: true
 weight: 6
-
 ---

content/audio/Torfinnsvatnet.md

@@ -3,6 +3,4 @@ title: "Torfinnsvatnent - rec 2023"
 file: "Torfinnsvatnent.mp3"
 rss_ignore: true
 weight: 52
-
 ---
-

content/audio/amt_files.md

@@ -5,5 +5,4 @@ recorder:
 details: ""
 rss_ignore: true
 weight: 14
-
 ---

content/audio/atlantic_avenue.md

@@ -5,5 +5,4 @@ recorder:
 details: ""
 rss_ignore: true
 weight: 59
-
 ---

content/audio/barrage_mettlach.md

@@ -1,8 +1,6 @@
 ---
 title: "Barrage, Saar - rec 2016"
 file: "barrage_mettlach.mp3"
-
 rss_ignore: true
 weight: 56
-
 ---

content/audio/c-line.md

@@ -1,8 +1,6 @@
 ---
 title: "C-Line, Tokyo - rec 2019"
 file: "c-line.mp3"
-
 rss_ignore: true
 weight: 58
-
 ---

content/audio/einsiedlerpark.md

@@ -1,7 +1,7 @@
 ---
 title: "Einsiedlerpark"
 file: "einsiedlerpark.mp3"
-image: "einsiedlerpark.jpg"
+#image: "einsiedlerpark.jpg"
 microphone: ""
 recorder: ""
 details: "Soundscape Composition"

content/audio/image/kickers.jpg

@@ -2,8 +2,8 @@
 ---
 title: "Kickers 2282"
 file: "the_kickers_2282.mp3"
+image: "kickers.jpg"
 project: kickers
 rss_ignore: true
 weight: 15
-
 ---

content/audio/image/pipedream.jpg

@@ -1,6 +1,5 @@
 ---
 title: "Woodpecker, Mettlach - rec 2019"
 file: "mettlach_woodpecker_2019.mp3"
-
 rss_ignore: true
 ---

content/audio/kickers.md

@@ -6,5 +6,4 @@ microphone: ""
 details: ""
 rss_ignore: true
 weight: 
-
 ---

content/audio/mettlach_woodpecker.md

@@ -1,6 +1,5 @@
 ---
 title: "Takao Berg, Hachioji - rec 2019"
 file: "takao_berg.mp3"
-
 rss_ignore: true
 ---

content/audio/rec_omv_mannswoerth.md

@@ -4,6 +4,5 @@ file: "Triangeln.mp3"
 project: triangeln
 rss_ignore: true
 weight: 12
-
 ---
 

content/audio/takao_berg.md

@@ -1,5 +1,5 @@
 ---
-title: "live Zacherlfabrik velak 20th bday<br>Vienna 2024"
+title: "live Zacherlfabrik velak 20th bday&gt;Vienna 2024"
 file: "velak_bday_resonantplay_HP.mp3"
 image: "velak20.jpg"
 microphone: ""

content/audio/triangeln.md

@@ -5,12 +5,11 @@ weight: 1
 video: { start: 0 }
 rss_ignore: true
 ---
-Das Flüstern der Bäume in Wien
+> (The whispering of the trees in Vienna)
 
-(The whispering of the trees in Vienna)
 
-Ongoing series
-Four Duets
+**Ongoing series**  
+**Four Duets**
 
 The Whispering of the Trees in Vienna are site-specific compositions. For each tree I selected
 an instrument and for three compositions I collaborated with a musician.
@@ -19,16 +18,16 @@ gating the specific sound of each tree, their surroundings, the history, the cul
 The series was created in the following constellations while each duet consists of a certain tree
 and the regarding musician
 
-N°1 A cherry tree on the man-made nature reserve on the Danube Island
+* **N°1**: A cherry tree on the man-made nature reserve on the Danube Island
 Nava Hemyari (Voice)
 
-N°2 The Caucasian wingnut in the heart of Vienna‘s inner city
+* **N°2**: The Caucasian wingnut in the heart of Vienna‘s inner city
 Vincent Singer (Cello)
 
-N°3 A beech tree with a view of Vienna in Hernals, Neuwaldegg
+* **N°3**: A beech tree with a view of Vienna in Hernals, Neuwaldegg
 Frederic Stritter (Synthesizer)
 
-N°4 A 196 years old gray poplar
+* **N°4**: A 196 years old gray poplar
 Nina Bauer (Gitarre)
 
 A print of the tree bark serves as a graphic notation. It is played with processed sounds of the
@@ -46,14 +45,11 @@ The impressions, drawings and the sound material of the respective tree serves a
 tion for the compositions of each duet. These approaches are supplemented by the respective
 musician.
 
-I am pleased that the graphic notation of the cherry tree was interpreted by the Punctum Col-
-lective. (https://punctum-collective.art/)
-
+I am pleased that the graphic notation of the cherry tree was interpreted by the [Punctum Collective](https://punctum-collective.art/).
 
 - Vocals: [Nava Hemyari](https://www.navahemyari.com/)
 - Nina Bauer: Gitarre
-![](das_fluestern_der_baeume-1.jpg)
 - Cello: Vinzent Singer
 - Synthesizer: Frederic Stritter
 
-Gefördert von der Stadt Wien Kultur.
+Gefördert von der Stadt Wien Kultur.

content/audio/velak_bday_resonantplay_HP.md

@@ -16,41 +16,33 @@
     {{ end }}
   {{ end }}
 {{ end }}
-{{/*<link rel="stylesheet" href="{{ (resources.Get "css/audio.css").Permalink }}">*/}}
-<script src="{{ (resources.Get "js/audio.js").Permalink }}" async></script>
+<script src="{{ (resources.Get "js/audio.js" | minify).Permalink }}" async></script>
 {{ end }}
 
 {{ define "main" }}
+{{ $baseURL:= .Site.BaseURL }}
 <ol data-type="playlist">
   {{ range $rec := .RegularPages }}
   <li>
     {{ $img := .Params.image }}
     {{ if eq $img nil }}
-      {{/*{{ .Params.project }}*/}}
-    {{ end }}
-    {{ with .Params.image }}
-    {{/*{{ $res_id := print "image/" . }}*/}}
-    {{/*{{ $res := resources.Get $res_id }}*/}}
-    {{/*{{ with $res }}*/}}
-    {{/*<img src="{{ $res.RelPermalink}}"></img>*/}}
-    {{/*{{ else }}*/}}
-    {{/* {{ warnf "image [%s] not found" $res_id }}*/}}
-    {{/*{{ end }}*/}}
-    <img src="image/{{ . }}">
+      {{/*{{ with .Params.project }}*/}}
+      {{/*{{ $img = print "/project/" . "/" "feature.jpg" }}*/}}
+      {{/*{{ end }}*/}}
+      {{/*{{with .Resources.Get $img }}*/}}
+      {{/*{{.}}*/}}
+      {{/*{{ end }}*/}}
+    {{ else }}
+      {{ $img = print "image/" $img }}
     {{ end }}
+    {{ if ne $img nil }}<img src="{{ $img }}">{{ end }}
     <div class="content">
       {{ $path := print "file/" .Params.file }}
       <h6 class="title">{{ .Title | safeHTML }}</h6>
       {{ with .Params.project }}
-      <a href="/project/{{.}}" class="project">{{.}}</a>
+      <a href="{{ $baseURL }}project/{{.}}" class="project">{{.}}</a>
       {{ end }}
-      <div class="text">{{ .Content }}</div>
-      {{/*{{ with .Params.project }}*/}}
-      {{/*<div>*/}}
-        {{/* <span>Project:</span>*/}}
-        {{/* <a href="/project/{{- . -}}"><strong>{{- . -}}</strong></a>*/}}
-        {{/*</div>*/}}
-      {{/*{{ end }}*/}}
+      <div class="text">{{- .Content -}}</div>
     </div>
       <audio src="{{ $path }}" controls></audio>
   </li>

content/project/24h_recording/gallery/IMG_6312.JPG renamed to content/project/24h_recording/gallery/IMG_6312.jpg

@@ -129,7 +129,12 @@ body {
       >div.content {
         max-width: 700px;
       }
-
+      // a {
+      //   border-bottom: 1px solid var(--f_med);
+      //   &:hover, &:focus {
+      //     border-bottom: 1px solid var(--f_high);
+      //   }
+      // }
       >section {
         width: 100%;
         padding: 1rem 0 2rem 0;

content/project/24h_recording/gallery/Einsiedlerpark.JPG renamed to content/project/24h_recording/gallery/einsiedlerpark.jpg

@@ -6,7 +6,7 @@
   --font-mono: "RobotoMono";
 
   --line-height: 1.5;
-  --text-base-size: 16px;
+  --text-base-size: 14px;
   --text-scale-ratio: 1.25;
   --body-font-weight: 500;
   --heading-line-height: 2;
@@ -36,6 +36,9 @@
   --space-xxxl: calc(8.5 * var(--space-unit));
   --space-xxxxl: calc(13.75 * var(--space-unit));
 
+  @media screen and (min-width: breakpoint.$desktop) {
+    --text-base-size: 16px;
+  }
   // @media screen and (min-width: breakpoint.$tablet) {
   //   --text-base-size: 14px;
   // }