feat(brand): AirCard-IOS – neues Logo und Name
- Name AirCard-IOS in Kopfzeile, Titel, Meta-Angaben (theme-color, apple-mobile-web-app-title) und README - Website-Icon: neues Logo als favicon.svg, favicon-32.png und deckendes apple-touch-icon.png (180 x 180, ohne Rundung) - Kopfzeile zeigt das Logo (28 px, auf schmalen Schirmen 24 px) vor dem Namen - Karten-Marken neu aus dem Logo abgeleitet (einfarbig, currentColor): Symbol mit drei gestaffelten Karten und ausgeschnittenen Wellen, Text als Pfade (Nunito Sans 800); IDs unverändert - Tests: Labels, Marken-Aufbau, Favicon, Icon-Dateien, index.html Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
No files matched your search
@@ -3,12 +3,16 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>AirCard – Kartenmotiv gestalten</title>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>AirCard-IOS – Kartenmotiv gestalten</title>
|
||||
<meta name="theme-color" content="#0F1828" />
|
||||
<meta name="apple-mobile-web-app-title" content="AirCard-IOS" />
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
|
||||
<link rel="icon" href="/favicon-32.png" sizes="32x32" type="image/png" />
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
||||
</head>
|
||||
<body>
|
||||
<header id="app-header">
|
||||
<a class="brand" href="/" data-link>AirCard</a>
|
||||
<a class="brand" href="/" data-link><img src="/favicon.svg" alt="" width="28" height="28" /><span>AirCard-IOS</span></a>
|
||||
<nav class="app-nav" aria-label="Hauptnavigation">
|
||||
<a href="/karten" data-link>Meine Karten</a>
|
||||
</nav>
|
||||
|
||||
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="64" height="64" rx="14" fill="#0F1828"/><g transform="translate(32 32) scale(0.227) translate(-88.655 -32.28)"><path fill="#E8EEF7" fill-rule="evenodd" d="m25.432-5.406 105.64-22.454a26 26 0 0 1 30.837 20.026l9.98 46.951a26 26 0 0 1-20.026 30.838L46.223 92.409a26 26 0 0 1-30.838-20.026l-9.98-46.951A26 26 0 0 1 25.433-5.406m9.318 24.6 39.126-8.316a6 6 0 0 1 2.495 11.738l-39.126 8.316a6 6 0 0 1-2.495-11.738m4.99 23.476 19.563-4.158a6 6 0 0 1 2.495 11.738l-19.563 4.158A6 6 0 0 1 39.74 42.67"/></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><defs><linearGradient id="d1" x1="0" x2="1" y1="0" y2="1"><stop offset="0" stop-color="#2e1e8c"/><stop offset="1" stop-color="#4b2fd6"/></linearGradient><linearGradient id="d2" x1="0" x2="1" y1="0" y2="1"><stop offset="0" stop-color="#5b3bf0"/><stop offset="1" stop-color="#8b6cff"/></linearGradient><linearGradient id="d3" x1="0" x2="1" y1="0" y2="1"><stop offset="0" stop-color="#c4b5ff"/><stop offset=".5" stop-color="#8b6cff"/><stop offset="1" stop-color="#4a2bea"/></linearGradient><linearGradient id="sheen" x1="0" x2="0" y1="0" y2="1"><stop offset="0" stop-color="#fff" stop-opacity=".25"/><stop offset=".5" stop-color="#fff" stop-opacity="0"/></linearGradient><radialGradient id="glow" cx="512" cy="780" r="600" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6b4df5" stop-opacity=".65"/><stop offset="1" stop-color="#6b4df5" stop-opacity="0"/></radialGradient><clipPath id="sq"><rect width="1024" height="1024" rx="232"/></clipPath></defs><rect width="1024" height="1024" fill="#0e0a24" rx="232"/><g clip-path="url(#sq)"><path fill="url(#glow)" d="M0 0h1024v1024H0z"/><rect width="680" height="430" x="172" y="360" fill="url(#d1)" rx="80"/><rect width="680" height="430" x="172" y="360" fill="url(#sheen)" rx="80"/><rect width="680" height="430" x="172" y="510" fill="url(#d2)" rx="80"/><rect width="680" height="430" x="172" y="510" fill="url(#sheen)" rx="80"/><rect width="680" height="430" x="172" y="660" fill="url(#d3)" rx="80"/><rect width="680" height="430" x="172" y="660" fill="url(#sheen)" rx="80"/><g fill="none" stroke="#fff" stroke-linecap="round" stroke-width="32"><path d="M591.1 768.9a44 44 0 0 1 0 62.2m34-96.2a92 92 0 0 1 0 130.2"/><path d="M659 701a140 140 0 0 1 0 198"/></g></g></svg>
|
||||
|
Before Width: | Height: | Size: 579 B After Width: | Height: | Size: 1.7 KiB |
@@ -1 +1 @@
|
||||
<svg viewBox="4.84 -28.43 167.63 121.42" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" fill-rule="evenodd" d="m25.432-5.406 105.64-22.454a26 26 0 0 1 30.837 20.026l9.98 46.951a26 26 0 0 1-20.026 30.838L46.223 92.409a26 26 0 0 1-30.838-20.026l-9.98-46.951A26 26 0 0 1 25.433-5.406m9.318 24.6 39.126-8.316a6 6 0 0 1 2.495 11.738l-39.126 8.316a6 6 0 0 1-2.495-11.738m4.99 23.476 19.563-4.158a6 6 0 0 1 2.495 11.738l-19.563 4.158A6 6 0 0 1 39.74 42.67"/></svg>
|
||||
<svg viewBox="172 360 680 730" xmlns="http://www.w3.org/2000/svg"><defs><mask id="aircards-symbol-waves" width="680" height="430" x="172" y="660" maskUnits="userSpaceOnUse"><path fill="#fff" d="M172 660h680v430H172z"/><g fill="none" stroke="#000" stroke-linecap="round" stroke-width="32"><path d="M591.1 843.9a44 44 0 0 1 0 62.2m34-96.2a92 92 0 0 1 0 130.2"/><path d="M659 776a140 140 0 0 1 0 198"/></g></mask></defs><g fill="currentColor"><path fill-opacity=".45" d="M252 360h520a80 80 0 0 1 80 80v150a80 80 0 0 0-80-80H252a80 80 0 0 0-80 80V440a80 80 0 0 1 80-80"/><path fill-opacity=".7" d="M252 510h520a80 80 0 0 1 80 80v150a80 80 0 0 0-80-80H252a80 80 0 0 0-80 80V590a80 80 0 0 1 80-80"/><rect width="680" height="430" x="172" y="660" mask="url(#aircards-symbol-waves)" rx="80"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 471 B After Width: | Height: | Size: 794 B |
@@ -1 +1 @@
|
||||
<svg viewBox="-2 -145.4 828.21 147.61" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M29.4 0H-2l64.8-141h25L152.6 0h-31.2l-13.2-30.6H42.4zm46-108H75L52.6-54.8H98zm118.2-9.2H161v-28.2h32.6zM192.4 0h-30.2v-98.2h30.2zm54.2 0h-30.8v-98.2h29.6V-81q2.8-7.2 8.6-11.8 8-6.4 21.4-7.4l8.8-.6 1.8 25.4-17 1.8q-11.4 1-16.9 6.6t-5.5 16.2zm122.6 2.2q-22.8 0-39-9t-24.9-25.3-8.7-38.5 8.7-38.4 24.9-25.2 39-9q14 0 26.8 4.4t21 12l-9.6 24.6q-9-7-18.1-10.3t-19.1-3.3q-20 0-30.4 11.7t-10.4 33.5T339.8-37t30.4 11.8q10 0 19.1-3.3t18.1-10.3l9.6 24.6q-8.2 7.6-21 12t-26.8 4.4m95 0q-10.8 0-19.4-4.2t-13.4-11.4-4.8-16.2q0-10.8 5.6-17.1t18.2-9 33.4-2.7h7.2v-3.4q0-8.8-4-12.5T473.4-78q-8 0-16.9 2.5T438.8-68l-8.2-20.2q5.2-3.6 12.7-6.3t15.7-4.2 15.6-1.5q15.4 0 25.3 4.5t14.9 13.8 5 23.9V0h-28.2v-14.6q-1.4 3.6-3.6 6.4-4 5-10 7.7t-13.8 2.7m26.8-41v-4h-7q-7.8 0-13.1.6t-8.7 2.1-4.9 3.7-1.5 5.6q0 5.6 3.9 9.2T471-18q5.8 0 10.3-2.7t7.1-7.4 2.6-10.7M573.2 0h-30.8v-98.2H572V-81q2.8-7.2 8.6-11.8 8-6.4 21.4-7.4l8.8-.6 1.8 25.4-17 1.8q-11.4 1-16.9 6.6t-5.5 16.2zm88 2.2q-12.8 0-22.5-6.2t-15.1-17.8-5.4-27.4 5.4-27.2T638.7-94t22.5-6.2q11.6 0 20.6 5.6 6.4 4 9.8 9.8V-141h30.2V0h-29.6v-14.8q-3.2 6.6-10 11-9.2 6-21 6m9-22.6q9.8 0 15.8-7.1t6-21.7-6-21.5-15.8-6.9q-9.6 0-15.6 6.9t-6 21.5 6 21.7 15.6 7.1M782.6 2.2Q774 2.2 766 .8T751.4-3t-11.6-6l7.2-19.6q5 3 10.9 5.3t12.3 3.5 12.6 1.2q8.6 0 12.5-2.7t3.9-7.1q0-4-2.6-6t-7.6-2.8L768-41q-12.4-2.2-19.1-9.1t-6.7-17.7q0-10 5.6-17.3t15.5-11.2 22.5-3.9q7.2 0 14 1.2t12.9 3.6 10.9 6.4L816-69.6q-3.8-3-9-5.2t-10.6-3.5-10.2-1.3q-9 0-13 2.9t-4 7.3q0 3.4 2.3 5.7t7.1 3.1l21 3.8q13 2.2 19.8 8.7t6.8 17.7q0 10.2-5.4 17.5T805.6-1.7t-23 3.9"/></svg>
|
||||
<svg viewBox="-2 -145.4 1164.01 147.61" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M29.4 0H-2l64.8-141h25L152.6 0h-31.2l-13.2-30.6H42.4zm46-108H75L52.6-54.8H98zm118.2-9.2H161v-28.2h32.6zM192.4 0h-30.2v-98.2h30.2zm54.2 0h-30.8v-98.2h29.6V-81q2.8-7.2 8.6-11.8 8-6.4 21.4-7.4l8.8-.6 1.8 25.4-17 1.8q-11.4 1-16.9 6.6t-5.5 16.2zm122.6 2.2q-22.8 0-39-9t-24.9-25.3-8.7-38.5 8.7-38.4 24.9-25.2 39-9q14 0 26.8 4.4t21 12l-9.6 24.6q-9-7-18.1-10.3t-19.1-3.3q-20 0-30.4 11.7t-10.4 33.5T339.8-37t30.4 11.8q10 0 19.1-3.3t18.1-10.3l9.6 24.6q-8.2 7.6-21 12t-26.8 4.4m95 0q-10.8 0-19.4-4.2t-13.4-11.4-4.8-16.2q0-10.8 5.6-17.1t18.2-9 33.4-2.7h7.2v-3.4q0-8.8-4-12.5T473.4-78q-8 0-16.9 2.5T438.8-68l-8.2-20.2q5.2-3.6 12.7-6.3t15.7-4.2 15.6-1.5q15.4 0 25.3 4.5t14.9 13.8 5 23.9V0h-28.2v-14.6q-1.4 3.6-3.6 6.4-4 5-10 7.7t-13.8 2.7m26.8-41v-4h-7q-7.8 0-13.1.6t-8.7 2.1-4.9 3.7-1.5 5.6q0 5.6 3.9 9.2T471-18q5.8 0 10.3-2.7t7.1-7.4 2.6-10.7M573.2 0h-30.8v-98.2H572V-81q2.8-7.2 8.6-11.8 8-6.4 21.4-7.4l8.8-.6 1.8 25.4-17 1.8q-11.4 1-16.9 6.6t-5.5 16.2zm88 2.2q-12.8 0-22.5-6.2t-15.1-17.8-5.4-27.4 5.4-27.2T638.7-94t22.5-6.2q11.6 0 20.6 5.6 6.4 4 9.8 9.8V-141h30.2V0h-29.6v-14.8q-3.2 6.6-10 11-9.2 6-21 6m9-22.6q9.8 0 15.8-7.1t6-21.7-6-21.5-15.8-6.9q-9.6 0-15.6 6.9t-6 21.5 6 21.7 15.6 7.1m138-21.4h-61.8v-23.8h61.8zM866.6 0h-31v-141h31zm93.6 2.2q-15.6 0-28.5-5.2t-22.1-14.8-14.1-23-4.9-29.8q0-16.6 4.9-29.9t14.1-22.8 22.1-14.7 28.5-5.2q15.8 0 28.6 5.2t22 14.6 14.2 22.8 5 29.8q0 16.6-5 30t-14.2 23-22 14.8-28.6 5.2m0-26.4q12 0 20.2-5.5t12.7-16 4.5-24.9q0-14.6-4.4-25t-12.8-15.8-20.2-5.4q-11.6 0-20 5.4t-12.8 15.8-4.4 25q0 14.4 4.4 24.9t12.8 16 20 5.5m144.2 26.4q-11 0-21.3-1.9T1064-5.1t-15.4-8.3l9-24.4q6.4 4.4 13.8 7.6t15.8 4.9 17.2 1.7q14.6 0 20.8-4.5t6.2-11.3q0-3.8-1.9-6.6t-6.2-4.9-11.7-3.5l-22.6-4.8q-19.2-4-28.5-13.7t-9.3-25.5q0-13.6 7.3-23.6t20.2-15.6 29.7-5.6q9.8 0 18.8 1.9t16.6 5.5 13.2 8.6l-9 22.8q-8-6.4-18-9.7t-21.8-3.3q-8.4 0-14.3 2.2t-9 6.2-3.1 9.2q0 5.8 4.2 9.4t14.6 5.8l22.6 4.8q19.6 4.2 29.2 13.5t9.6 24.5q0 13.2-7.1 23.1t-20 15.4-30.5 5.5"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,49 @@
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { resolve } from 'node:path';
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import indexHtml from '../index.html?raw';
|
||||
|
||||
const publicFile = (name: string) => readFileSync(resolve(import.meta.dirname, '../public', name));
|
||||
|
||||
/** Breite, Höhe und Farbtyp aus dem IHDR-Block eines PNG (Farbtyp 2 = RGB ohne Alphakanal, 6 = RGBA). */
|
||||
function pngInfo(buf: Buffer) {
|
||||
expect(buf.subarray(0, 8).toString('hex')).toBe('89504e470d0a1a0a');
|
||||
expect(buf.subarray(12, 16).toString('ascii')).toBe('IHDR');
|
||||
return { width: buf.readUInt32BE(16), height: buf.readUInt32BE(20), colorType: buf[25] };
|
||||
}
|
||||
|
||||
describe('Name und Kopfbereich', () => {
|
||||
it('Titel und Meta-Angaben nennen AirCard-IOS', () => {
|
||||
expect(indexHtml).toContain('<title>AirCard-IOS – Kartenmotiv gestalten</title>');
|
||||
expect(indexHtml).toContain('<meta name="theme-color" content="#0F1828" />');
|
||||
expect(indexHtml).toContain('<meta name="apple-mobile-web-app-title" content="AirCard-IOS" />');
|
||||
});
|
||||
|
||||
it('Icon-Links: SVG, 32-px-PNG, Apple-Touch-Icon', () => {
|
||||
expect(indexHtml).toContain('<link rel="icon" href="/favicon.svg" type="image/svg+xml" />');
|
||||
expect(indexHtml).toContain('<link rel="icon" href="/favicon-32.png" sizes="32x32" type="image/png" />');
|
||||
expect(indexHtml).toContain('<link rel="apple-touch-icon" href="/apple-touch-icon.png" />');
|
||||
});
|
||||
|
||||
it('Kopfzeile: dekoratives Logo (28 x 28) links vom Namen, beides im Markenlink', () => {
|
||||
expect(indexHtml).toContain(
|
||||
'<a class="brand" href="/" data-link><img src="/favicon.svg" alt="" width="28" height="28" /><span>AirCard-IOS</span></a>',
|
||||
);
|
||||
});
|
||||
|
||||
it('Fußzeilen-Hinweis bleibt unverändert', () => {
|
||||
expect(indexHtml).toContain(
|
||||
'Inoffizielles Hobbyprojekt. Keine Verbindung zu Apple, Visa, Mastercard, UnionPay, American Express, JCB oder Discover. Alle Marken gehören ihren Inhabern.',
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Icon-Dateien', () => {
|
||||
it('favicon-32.png ist 32 x 32', () => {
|
||||
expect(pngInfo(publicFile('favicon-32.png'))).toMatchObject({ width: 32, height: 32 });
|
||||
});
|
||||
|
||||
it('apple-touch-icon.png ist 180 x 180 und deckend (RGB ohne Alphakanal, kein transparenter Rand)', () => {
|
||||
expect(pngInfo(publicFile('apple-touch-icon.png'))).toEqual({ width: 180, height: 180, colorType: 2 });
|
||||
});
|
||||
});
|
||||
@@ -29,7 +29,7 @@ describe('Registers', () => {
|
||||
|
||||
it('Labels stehen im Wortlaut der Vorlage in Reihenfolge', () => {
|
||||
expect(NETWORK_MARKS.map((m) => m.label)).toEqual(NETWORK_LABELS);
|
||||
expect(BRAND_MARKS.map((m) => m.label)).toEqual(['AirCards · Symbol', 'AirCards · Text', 'Apple']);
|
||||
expect(BRAND_MARKS.map((m) => m.label)).toEqual(['AirCard-IOS · Symbol', 'AirCard-IOS · Text', 'Apple']);
|
||||
});
|
||||
|
||||
it('BRAND_MARKS: Logo-Gruppe, feste Reihenfolge', () => {
|
||||
@@ -51,7 +51,7 @@ describe('Registers', () => {
|
||||
it('getNetworkMark / getBrandMark finden den Eintrag', () => {
|
||||
for (const id of NETWORK_IDS) expect(getNetworkMark(id).id).toBe(id);
|
||||
expect(getBrandMark('apple').id).toBe('apple');
|
||||
expect(getBrandMark('aircards-text').label).toBe('AirCards · Text');
|
||||
expect(getBrandMark('aircards-text').label).toBe('AirCard-IOS · Text');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -163,12 +163,62 @@ describe('maxH', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('AirCard-IOS-Marken', () => {
|
||||
const symbol = getBrandMark('aircards-symbol').svg;
|
||||
const text = getBrandMark('aircards-text').svg;
|
||||
|
||||
it('Symbol: drei Karten mit Deckkraft .45/.7/1, Wellen als Maske aus der vorderen Karte geschnitten', () => {
|
||||
expect(symbol).toContain('fill-opacity=".45"');
|
||||
expect(symbol).toContain('fill-opacity=".7"');
|
||||
expect(symbol).toMatch(/<mask\b[^>]*\bid="aircards-symbol-[\w-]+"/);
|
||||
expect(symbol).toMatch(/<rect\b[^>]*\bmask="url\(#aircards-symbol-[\w-]+\)"/);
|
||||
expect(symbol).not.toMatch(/fill-opacity="1"/);
|
||||
});
|
||||
|
||||
it('Symbol: enge viewBox um die drei Karten (680 x 730)', () => {
|
||||
expect(svgAspect(symbol)).toBeCloseTo(680 / 730, 3);
|
||||
});
|
||||
|
||||
it('Text: nur Pfade, ein breites Wortlogo', () => {
|
||||
expect(text).toContain('<path');
|
||||
expect(svgAspect(text)).toBeGreaterThan(6);
|
||||
});
|
||||
|
||||
it('Marken sind rein Pfad/Form: kein <text>, keine Schrift, keine externen Verweise', () => {
|
||||
for (const svg of [symbol, text]) {
|
||||
expect(svg).not.toContain('<text');
|
||||
expect(svg).not.toContain('font-family');
|
||||
expect(svg).not.toContain('<style');
|
||||
expect(svg).not.toMatch(/(?:xlink:)?href\s*=/);
|
||||
expect(svg).not.toMatch(/url\(\s*['"]?(?!#)/);
|
||||
}
|
||||
});
|
||||
|
||||
it('Marken verwenden als einzige Farbe currentColor (Masken-Weiß/-Schwarz ausgenommen)', () => {
|
||||
for (const svg of [symbol, text]) {
|
||||
const colours = [...svg.matchAll(/\b(?:fill|stroke)="([^"]+)"/g)].map((h) => h[1].toLowerCase());
|
||||
for (const c of colours) expect(['currentcolor', 'none', '#fff', '#000'], c).toContain(c);
|
||||
}
|
||||
expect(text).not.toMatch(/#(?:fff|000)/i);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Favicon', () => {
|
||||
it('hat feste Farben und kein currentColor', () => {
|
||||
it('ist das neue Logo: 1024er Raster, feste Farben, kein currentColor, keine Metadaten', () => {
|
||||
expect(favicon).not.toContain('currentColor');
|
||||
expect(favicon).toContain('#E8EEF7');
|
||||
expect(favicon).toContain('#0F1828');
|
||||
expect(favicon).toMatch(/viewBox="0 0 64 64"/);
|
||||
expect(favicon).toMatch(/viewBox="0 0 1024 1024"/);
|
||||
expect(favicon).toContain('#0e0a24');
|
||||
expect(favicon).toContain('#8b6cff');
|
||||
for (const bad of ['<metadata', '<title', '<desc', 'sodipodi', 'inkscape', '<script', '<image', '<text', 'xlink:href']) {
|
||||
expect(favicon, bad).not.toContain(bad);
|
||||
}
|
||||
});
|
||||
|
||||
it('jedes url(#…) zeigt auf eine id derselben Datei', () => {
|
||||
const defined = new Set([...favicon.matchAll(/\bid="([^"]+)"/g)].map((h) => h[1]));
|
||||
const refs = [...favicon.matchAll(/url\(\s*['"]?#([^)'"\s]+)/g)].map((h) => h[1]);
|
||||
expect(refs.length).toBeGreaterThan(0);
|
||||
for (const ref of refs) expect(defined.has(ref), ref).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -63,8 +63,8 @@ const NETWORK_TABLE: Record<NetworkId, NetworkEntry> = {
|
||||
};
|
||||
|
||||
const BRAND_TABLE: Record<Exclude<BrandId, 'none'>, NetworkEntry> = {
|
||||
'aircards-symbol': { group: 'Logo', label: 'AirCards · Symbol', svg: aircardsSymbol, tint: true, maxH: 100 },
|
||||
'aircards-text': { group: 'Logo', label: 'AirCards · Text', svg: aircardsText, tint: true, maxH: 100 },
|
||||
'aircards-symbol': { group: 'Logo', label: 'AirCard-IOS · Symbol', svg: aircardsSymbol, tint: true, maxH: 100 },
|
||||
'aircards-text': { group: 'Logo', label: 'AirCard-IOS · Text', svg: aircardsText, tint: true, maxH: 100 },
|
||||
apple: { group: 'Logo', label: 'Apple', svg: apple, tint: true, maxH: 100 },
|
||||
};
|
||||
|
||||
|
||||
@@ -57,11 +57,35 @@ a {
|
||||
}
|
||||
|
||||
.brand {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
color: var(--text);
|
||||
font-size: 1.35rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.01em;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.brand img {
|
||||
display: block;
|
||||
flex: none;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
/* Schmale Bildschirme: Marke etwas kleiner, damit sie samt „Meine Karten“ in die erste Kopfzeile passt */
|
||||
@media (max-width: 599px) {
|
||||
.brand {
|
||||
gap: 8px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.brand img {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.app-nav a {
|
||||
|
||||