From be1252abf8682ab8e1d606d63b016741284ebcc0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ole=20Volds=C3=A6ter?= <ole.voldsater@uib.no>
Date: Tue, 16 Mar 2021 15:04:27 +0100
Subject: [PATCH] =?UTF-8?q?re=20meta#300=20tweaket=20b=C3=B8yningsknappen?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Header.vue | 37 +++++++++++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/src/components/Header.vue b/src/components/Header.vue
index 275c06c..11cc312 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -4,7 +4,7 @@
     <h2 class="article_header">{{header_text}}</h2>
       {{group_list}}
       <details :title="inflect_tooltip" @toggle="toggle()" v-if="group_list">
-        <summary>Bøying</summary>
+        <summary :class="dictionary">bøying</summary>
         <div class="inflection">
           <div v-for="(lemma, index) in inflection_groups_by_lemma" :key="index">
             <h4>{{lemma.lemma}}</h4>
@@ -137,15 +137,20 @@ details {
 
 details > summary {
   position: relative;
-  max-width: 80px;
+  max-width: 130px;
   list-style: none;
   border: solid 2px var(--v-primary-base);
-  border-radius: 4px;
-  padding: 3px;
+  border-radius: 30px;
+  padding: 6px;
   color: var(--v-primary-base);
+  background-color: #ffffff;
   cursor: pointer;
 }
 
+details[open] > summary {
+  box-shadow: 5px 5px 0px var(--v-primary-base)
+}
+
 details > summary:after {
   content: "⌄";
   font-weight: bold;
@@ -155,6 +160,27 @@ details > summary:after {
   margin-right: 3px;
 }
 
+details > summary.bob:before {
+  content: "Se ";
+}
+
+details > summary.nob:before {
+  content: "Sjå ";
+}
+
+details[open] > summary.bob:before, details[open] > summary.nob:before {
+  content: "Skjul  ";
+}
+
+details[open] > summary:after {
+  content: "⌃";
+  font-weight: bold;
+  position: absolute;
+  right: 0;
+  top: 8px;
+  margin-right: 3px;
+}
+
 @keyframes open {
   0% {
     opacity: 0;
@@ -169,6 +195,9 @@ details[open] summary ~ * {
 }
 
 .inflection {
+  color: var(--v-primary-base);
+  background-color: #ffffff;
+  margin-top: 5px;
   overflow: scroll;
 }
 
-- 
GitLab