Language menu move.
authorRadek Czajka <rczajka@rczajka.pl>
Wed, 22 Jul 2020 14:12:42 +0000 (16:12 +0200)
committerRadek Czajka <rczajka@rczajka.pl>
Thu, 10 Sep 2020 12:15:11 +0000 (14:15 +0200)
src/wolnelektury/static/img/contrib/language/attribution.txt [new file with mode: 0644]
src/wolnelektury/static/img/contrib/language/language.svg [new file with mode: 0644]
src/wolnelektury/static/scss/main/header.scss
src/wolnelektury/static/scss/main/menu.scss
src/wolnelektury/templates/base/app.html
src/wolnelektury/templates/base/superbase.html

diff --git a/src/wolnelektury/static/img/contrib/language/attribution.txt b/src/wolnelektury/static/img/contrib/language/attribution.txt
new file mode 100644 (file)
index 0000000..bfc9d4d
--- /dev/null
@@ -0,0 +1,6 @@
+OOjs UI icon language-ltr
+
+Author: Mun May Tee-Galloway (Wikimedia Foundation)
+Source: https://creativecommons.org/licenses/by-sa/3.0/deed.en
+License: CC BY-SA 3.0 (https://creativecommons.org/licenses/by-sa/3.0/deed.en)
+
diff --git a/src/wolnelektury/static/img/contrib/language/language.svg b/src/wolnelektury/static/img/contrib/language/language.svg
new file mode 100644 (file)
index 0000000..2b8f5f9
--- /dev/null
@@ -0,0 +1,58 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   inkscape:version="1.0 (6e3e5246a0, 2020-05-07)"
+   sodipodi:docname="language.svg"
+   id="svg6"
+   version="1.1"
+   viewBox="0 0 20 20"
+   height="20"
+   width="20">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10" />
+  <sodipodi:namedview
+     inkscape:current-layer="svg6"
+     inkscape:window-maximized="1"
+     inkscape:window-y="27"
+     inkscape:window-x="0"
+     inkscape:cy="10"
+     inkscape:cx="5.617849"
+     inkscape:zoom="43.7"
+     showgrid="false"
+     id="namedview8"
+     inkscape:window-height="1016"
+     inkscape:window-width="1920"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0"
+     guidetolerance="10"
+     gridtolerance="10"
+     objecttolerance="10"
+     borderopacity="1"
+     bordercolor="#666666"
+     pagecolor="#ffffff" />
+  <title
+     id="title2">
+    language
+  </title>
+  <path
+     style="fill:#bbbbbb;fill-opacity:1"
+     id="path4"
+     d="M20 18h-1.44a.61.61 0 0 1-.4-.12.81.81 0 0 1-.23-.31L17 15h-5l-1 2.54a.77.77 0 0 1-.22.3.59.59 0 0 1-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 0 1-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zm-6.3-1.58a13.43 13.43 0 0 1-2.91-1.41 11.46 11.46 0 0 0 2.81-5.37H12V4H7.31a4 4 0 0 0-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 0 0 5 10.7a17.19 17.19 0 0 1-5 2.1q.56.82.87 1.38a23.28 23.28 0 0 0 5.22-2.51 15.64 15.64 0 0 0 3.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 0 1-2.45 4.45 9.11 9.11 0 0 1-2.46-4.45z" />
+</svg>
index 14516b8..9e6bb6b 100644 (file)
@@ -68,6 +68,9 @@ header#main {
     @include size(top, 3px);
     @include size(left, 255px);
     @include size(font-size, 13px);
+    margin: 0;
+    @include size(line-height, 43px);
+    
 
     @media screen and (min-width: 1024px) {
       display: block;
@@ -83,7 +86,8 @@ header#main {
     @include mono;
 
     #lang-button {
-      display: block;
+        display: block;
+        cursor: pointer;
 
       @include size(font-size, 10px);
       @include size(line-height, 17px);
@@ -100,9 +104,8 @@ header#main {
         }
       }
 
-      .lang-flag {
-        @include size(font-size, 13px);
-        @include size(line-height, 15px);
+      img {
+          vertical-align: middle;
       }
     }
 
@@ -134,7 +137,7 @@ header#main {
       }
     }
 
-    &:hover, &.hover {
+    &.hover {
       #lang-menu-items {
         position: absolute;
         padding: 0;
@@ -146,6 +149,9 @@ header#main {
       }
     }
 
+    @media screen and (min-width: 1024px) {
+        right: 300px;
+    }
   }
 
   #main-menu-toggle {
index 9cb8c32..bbe9d41 100644 (file)
@@ -98,8 +98,10 @@ body.menu-on {
     #user-info {
         @include mono;
         position: absolute;
-        right: 150px;
-        top: 4px;
+        right: 0px;
+        top: 3px;
+        margin: 0;
+        @include size(line-height, 43px);
         @include size(font-size, 10px);
         list-style: none;
 
index b215081..72ca205 100644 (file)
@@ -39,7 +39,7 @@
 
               <div id="lang-menu" class="hoverget">
                 <span id='lang-button' class='hoverclick'>
-                  <span class="lang-flag">⚐</span>
+                 <img src="{% static "img/contrib/language/language.svg" %}" alt="{% trans "Language" %}">
                   <span class="label"> {% trans "Language" %}</span>
                 </span>
                 <div id="lang-menu-items">
index 13cf50d..30bfdda 100644 (file)
@@ -66,7 +66,7 @@
 
               <div id="lang-menu" class="hoverget">
                 <span id='lang-button' class='hoverclick'>
-                  <span class="lang-flag">⚐</span>
+                  <img src="{% static "img/contrib/language/language.svg" %}" alt="{% trans "Language" %}">
                   <span class="label"> {% trans "Language" %}</span>
                 </span>
                 <div id="lang-menu-items">