#1: added Twemoji Country Flags

This commit is contained in:
Elmar Kresse
2024-04-25 11:54:24 +02:00
parent 5bf2dbcc7a
commit 0bd6b35e8f
9 changed files with 22 additions and 11 deletions

View File

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>HTWKalender</title>
<meta name="description" content="Calendar implementation for the HTWK Leipzig timetable. Evaluation and display of the individual dates in iCal format.">
<meta name="keywords" content="HTWK, calendar, iCal, dates, events, schedule">
<link rel="icon" href="/favicon.ico" sizes="32x32" />
<link rel="icon" type="image/svg+xml" href="/htwk.svg" />
<link rel="mask-icon" href="/htwk-mask.svg" color="#00494c" />

View File

@ -16,6 +16,7 @@
"@tanstack/vue-query": "^5.28.9",
"@tanstack/vue-query-devtools": "^5.28.10",
"@vueuse/core": "^10.9.0",
"country-flag-emoji-polyfill": "^0.1.8",
"pinia": "^2.1.7",
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
@ -4465,6 +4466,11 @@
"url": "https://opencollective.com/core-js"
}
},
"node_modules/country-flag-emoji-polyfill": {
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/country-flag-emoji-polyfill/-/country-flag-emoji-polyfill-0.1.8.tgz",
"integrity": "sha512-Mbah52sADS3gshUYhK5142gtUuJpHYOXlXtLFI3Ly4RqgkmPMvhX9kMZSTqDM8P7UqtSW99eHKFphhQSGXA3Cg=="
},
"node_modules/cross-spawn": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",

View File

@ -21,6 +21,7 @@
"@tanstack/vue-query": "^5.28.9",
"@tanstack/vue-query-devtools": "^5.28.10",
"@vueuse/core": "^10.9.0",
"country-flag-emoji-polyfill": "^0.1.8",
"pinia": "^2.1.7",
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",

View File

@ -49,7 +49,7 @@ $shade900: rgba(map-get($colors, "htwk-schwarz"), 1) !default; //ground surface
$hoverBg: rgba(255, 255, 255, 0.03) !default;
//global
$fontFamily: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !default;
$fontFamily: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !default;
$fontSize: 1rem !default;
$fontWeight: normal !default;
$textColor: $shade000 !default;
@ -887,10 +887,10 @@ $imagePreviewActionIconFontSize: 1.5rem !default;
$imagePreviewActionIconBorderRadius: 50% !default;
:root {
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
font-variation-settings: normal;
--font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-feature-settings: "cv02", "cv03", "cv04", "cv11";
--surface-a: #{$shade800};
--surface-b: #{$shade900};

View File

@ -51,7 +51,7 @@ $shade800:#374151 !default; //unused
$shade900:#1f2937 !default; //unused
//global
$fontFamily:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !default;
$fontFamily:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !default;
$fontSize:1rem !default;
$fontWeight:normal !default;
$textColor:$shade700 !default;
@ -881,10 +881,10 @@ $imagePreviewActionIconFontSize:1.5rem !default;
$imagePreviewActionIconBorderRadius:50% !default;
:root {
font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-feature-settings: "cv02","cv03","cv04","cv11";
font-variation-settings: normal;
--font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-feature-settings: "cv02","cv03","cv04","cv11";
--surface-a:#{$shade000};
--surface-b:#{$shade100};

View File

@ -1,8 +1,8 @@
:root {
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
font-variation-settings: normal;
--font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-feature-settings: "cv02", "cv03", "cv04", "cv11";
--surface-a: #2e3639;
--surface-b: black;

View File

@ -1,8 +1,8 @@
:root {
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
font-variation-settings: normal;
--font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-family:"Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, Twemoji Country Flags, Roboto, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
--font-feature-settings: "cv02","cv03","cv04","cv11";
--surface-a:#ffffff;
--surface-b:#f9fafb;

View File

@ -64,7 +64,7 @@ updateLocale(localeStore().locale);
<template #value="slotProps">
<div v-if="slotProps.value" class="flex align-items-center">
<div class="mr-2 flag">{{ displayIcon(slotProps.value) }}</div>
<div>{{ displayCountry(slotProps.value) }}</div>
<div style="font-family: 'Twemoji Country Flags', 'Helvetica', 'Comic Sans', serif;">{{ displayCountry(slotProps.value) }}</div>
</div>
<span v-else>
{{ slotProps.placeholder }}

View File

@ -55,6 +55,9 @@ import Skeleton from "primevue/skeleton";
import Calendar from "primevue/calendar";
import i18n from "./i18n";
import { VueQueryPlugin } from "@tanstack/vue-query";
import { polyfillCountryFlagEmojis } from "country-flag-emoji-polyfill";
polyfillCountryFlagEmojis();
const app = createApp(App);
const pinia = createPinia();