Kieran/zap.stream
5
8
Fork 9
Code Issues 27 Pull Requests 1 Packages Projects 1 Releases Wiki Activity

Use flags directly
Some checks failed
continuous-integration/drone/push Build is failing
Details

Browse Source
This commit is contained in:
Kieran 2023-09-06 16:49:22 +01:00
parent 660fbe746b
commit 4b7e54a16d
Signed by: Kieran
GPG Key ID: DE71CEB3925BE941
2 changed files with 36 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/pages/layout.css
View File

@ -168,10 +168,44 @@ button span.hide-on-mobile {
cursor: pointer;
}
.flag {
.fi {
background-position: 50%;
background-repeat: no-repeat;
width: 30px;
height: 30px;
aspect-ratio: 1;
border-radius: 100%;
background-size: cover;
}
.fi:before {
content: "\00a0";
}
/* [DefaultLocale, "de-DE", "es-ES", "th-TH", "nl-NL", "ja-JP", "fa-IR", "sw-KE", "sv-SE"]; */
.fi-us {
background-image: url("flag-icons/flags/1x1/us.svg");
}
.fi-de {
background-image: url("flag-icons/flags/1x1/de.svg");
}
.fi-es {
background-image: url("flag-icons/flags/1x1/es.svg");
}
.fi-th {
background-image: url("flag-icons/flags/1x1/th.svg");
}
.fi-nl {
background-image: url("flag-icons/flags/1x1/nl.svg");
}
.fi-jp {
background-image: url("flag-icons/flags/1x1/jp.svg");
}
.fi-ir {
background-image: url("flag-icons/flags/1x1/ir.svg");
}
.fi-ke {
background-image: url("flag-icons/flags/1x1/ke.svg");
}
.fi-se {
background-image: url("flag-icons/flags/1x1/se.svg");
}

3
src/pages/layout.tsx
View File

@ -1,4 +1,3 @@
import "flag-icons/css/flag-icons.css";
import "./layout.css";
import { useState } from "react";
@ -32,7 +31,7 @@ export function LayoutPage() {
menuClassName="ctx-menu"
menuButton={
<div className="flex f-center g12">
<div className={`flag fi fi-${lang.split(/[-_]/i)[1]?.toLowerCase()}`}></div>
<div className={`fi fi-${lang.split(/[-_]/i)[1]?.toLowerCase()}`}></div>
<div className="uppercase pointer">
<b>{lang.includes("-") ? lang.split("-")[0] : lang}</b>
</div>