small fixes

themes/buha/assets/scss/generator.scss

@@ -27,9 +27,22 @@ form {
     max-width: 1920px;
 }
 
-.button {
+.generator {
-    font-size: .8em;
+    .button {
-    padding: .5em;
+        font-size: .8em;
+        border-radius: 0;
+        margin: 0;
+        background: var(--background);
+        padding-right: 2em;
+        padding-left: 2em;
+        &:hover {
+            background: var(--background-alt);
+        }
+    }
+    .textarea {
+        margin-top: 0;
+        border-radius: 0;
+    }
 }
 
 p {

themes/buha/content/tools/generator.de.md

@@ -6,6 +6,7 @@ description: "generator"
 type: "tools"
 tool: "generator"
 divide: "Getrennt durch Komma"
+js: ["visibleIf.js","generator.js"]
 forms:
   - to: info@bunteshaus.de
     realnames: false

themes/buha/content/tools/test.de.md

@@ -0,0 +1,6 @@
+---
+title: "Test"
+js: ["test.js"]
+---
+{{< test >}}
+

themes/buha/layouts/partials/tools/generator/form.html

@@ -34,10 +34,10 @@
                     {{ $translation := index $b 1 }}
                     {{ $n := index $b 0 }}
                     {{ $nn := printf "%s;%s" $button_target $n}}
-                    <button class="button" onclick="button({{- $nn -}})" type="button" value="{{ $n }}">{{ $translation }}</button>
+                    <button class="button tabs" onclick="button({{- $nn -}})" type="button" value="{{ $n }}">{{ $translation }}</button>
                 {{ end }}
             </div>
-            <textarea class="w100" name="{{ .title }}" id="{{ .title }}" rows="10" {{ if .placeholder }}placeholder="{{ .placeholder }}"{{ end }}></textarea>
+            <textarea class="w100 textarea" name="{{ .title }}" id="{{ .title }}" rows="10" {{ if .placeholder }}placeholder="{{ .placeholder }}"{{ end }}></textarea>
         </div>
     {{ else if eq .input_type "radio" }}
         <div class="radio {{- if .group }} visibleIf margin_left_1rem" data-visibleif-rule="{{ .group }}group == 'true'{{ end }}">
@@ -182,7 +182,7 @@
                         {{ $direction = .direction }}
                     {{ end }}
                     <div class="margin_left_1rem" style="display: flex; flex: 0 1 auto; flex-wrap: wrap;">
-                        <button class="button" type="button" value="Clear" onclick="clearThis({{ .title }});" />Clear</button>
+                        <button style="background: #8e3333;" class="button" type="button" value="Clear" onclick="clearThis({{ .title }});" />Clear</button>
                         {{ $button_target := .title }}
                         {{ range sort $finale }}
                             {{ if . }}

themes/buha/layouts/shortcodes/generator.html

@@ -2,5 +2,3 @@
 <div class="generator">
   {{ partial "tools/generator/form" (dict "context" . "form" 0) }}
 </div>
-<script defer src="{{ "/js/visibleIf.js" | urlize | relURL }}"></script>
-<script defer src="{{ "/js/generator.js" | urlize | relURL }}"></script>

themes/buha/layouts/shortcodes/test.html

@@ -0,0 +1,4 @@
+<noscript><p><b>Bitte aktiviere Javascript, sonst funktioniert der Generator nicht.</b></p></noscript>
+<div>
+
+</div>

themes/buha/layouts/tools/single.html

@@ -15,5 +15,11 @@
     {{ end }}
     <article>
     {{ .Content }}
+    {{ if .Params.js }}
+        {{ range .Params.js }}
+            {{ $js := printf "/js/%s" . | safeURL }}
+            <script defer src="{{  $js | urlize }}"></script>
+        {{ end }}
+    {{ end }}
     </article>
 {{ end }}

themes/buha/static/js/generator.js

@@ -38,7 +38,7 @@ function Input(str) {
     typeInInputfield(out);
     var end = id.value.length;
     id.setSelectionRange(end, end);
-    id.focus();
+    id.focus({preventScroll: true});
   }
 }
 
@@ -105,7 +105,7 @@ function button(str) {
     typeInTextarea(out);
     var end = id.value.length;
     id.setSelectionRange(end, end);
-    id.focus();
+    id.focus({preventScroll: true});
   }
 }
 

themes/buha/static/js/test.js

@@ -0,0 +1 @@
+