Open Hüfner's outside links in a new tab and crop the tree for the favicon
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
69f7977ecf
commit
14e7a3b310
2 files changed
+37
-10
No files matched your search
@@ -4,7 +4,7 @@
|
||||
* Bereitet die Bilder des Hüfner-Entwurfs für die Mediathek vor.
|
||||
*
|
||||
* Kopiert die Fotos und das Logo aus dem gelieferten Ordner (images/) und schneidet aus dem Logo
|
||||
* den Baum mit den Steinen als quadratisches Seitensymbol (favicon.png) heraus. Der Baum ist im
|
||||
* den Baum (ohne die Steine) als quadratisches Seitensymbol (favicon.png) heraus. Der Baum ist im
|
||||
* Logo links, der Schriftzug rechts; ein Favicon mit Schrift wäre in 32 px unlesbar.
|
||||
*
|
||||
* Aufruf: php scripts/build-huefner-assets.php <Quellordner mit images/> <Zielordner> [<Unterlagen>]
|
||||
@@ -29,23 +29,46 @@ foreach (glob($quelle.'/images/*.{jpg,png}', GLOB_BRACE) ?: [] as $datei) {
|
||||
copy($datei, $ziel.'/'.basename($datei));
|
||||
}
|
||||
|
||||
// Baum und Steine: im 1600 x 607 px großen Logo etwa x 15–500, y 10–560.
|
||||
// Nur der Baum: Krone (grün) und Stamm (dunkel) aus dem linken Teil des Logos, ohne die grauen
|
||||
// Steine - die liefen bisher rechts aus dem Ausschnitt und sind in 32 px nur Rauschen (Umut,
|
||||
// 12.10.2026: „schneide bitte den Baum zurecht“). Der Stamm ist dunkler als die Steine.
|
||||
$logo = imagecreatefrompng($quelle.'/images/logo.png');
|
||||
if (false === $logo) {
|
||||
fwrite(STDERR, "logo.png lässt sich nicht lesen.\n");
|
||||
exit(1);
|
||||
}
|
||||
$punkte = [];
|
||||
[$bx0, $by0, $bx1, $by1] = [PHP_INT_MAX, PHP_INT_MAX, 0, 0];
|
||||
for ($y = 10; $y < 520; ++$y) {
|
||||
for ($x = 10; $x < 500; ++$x) {
|
||||
$c = imagecolorat($logo, $x, $y);
|
||||
if ((($c >> 24) & 127) > 100) {
|
||||
continue;
|
||||
}
|
||||
[$r, $g, $b] = [($c >> 16) & 255, ($c >> 8) & 255, $c & 255];
|
||||
if ($g > $r + 30 || ($r + $g + $b) / 3 < 70) {
|
||||
$punkte[] = [$x, $y, $c];
|
||||
[$bx0, $by0, $bx1, $by1] = [min($bx0, $x), min($by0, $y), max($bx1, $x), max($by1, $y)];
|
||||
}
|
||||
}
|
||||
}
|
||||
$baum = imagecreatetruecolor($bx1 - $bx0 + 1, $by1 - $by0 + 1);
|
||||
imagesavealpha($baum, true);
|
||||
imagealphablending($baum, false);
|
||||
imagefill($baum, 0, 0, imagecolorallocatealpha($baum, 0, 0, 0, 127));
|
||||
foreach ($punkte as [$x, $y, $c]) {
|
||||
imagesetpixel($baum, $x - $bx0, $y - $by0, $c);
|
||||
}
|
||||
$kante = 512;
|
||||
$symbol = imagecreatetruecolor($kante, $kante);
|
||||
imagesavealpha($symbol, true);
|
||||
imagealphablending($symbol, false);
|
||||
imagefill($symbol, 0, 0, imagecolorallocatealpha($symbol, 0, 0, 0, 127));
|
||||
imagealphablending($symbol, true);
|
||||
[$x, $y, $b, $h] = [15, 10, 490, 550];
|
||||
$massstab = min(($kante - 24) / $b, ($kante - 24) / $h);
|
||||
[$b, $h] = [imagesx($baum), imagesy($baum)];
|
||||
$massstab = min(($kante - 32) / $b, ($kante - 32) / $h);
|
||||
$zb = (int) round($b * $massstab);
|
||||
$zh = (int) round($h * $massstab);
|
||||
imagecopyresampled($symbol, $logo, (int) (($kante - $zb) / 2), (int) (($kante - $zh) / 2), $x, $y, $zb, $zh, $b, $h);
|
||||
imagecopyresampled($symbol, $baum, (int) (($kante - $zb) / 2), (int) (($kante - $zh) / 2), 0, 0, $zb, $zh, $b, $h);
|
||||
imagepng($symbol, $ziel.'/favicon.png');
|
||||
echo "Bilder kopiert, Seitensymbol geschnitten: $ziel\n";
|
||||
|
||||
|
||||
@@ -242,6 +242,10 @@ $bild = static function (string $id, array $eintrag, string $alt, array $style =
|
||||
if (null !== $href) {
|
||||
$props['href'] = $href;
|
||||
$props['click'] = 'link';
|
||||
// Adressen nach außen (Instagram, Facebook, WhatsApp, Google) öffnen in neuem Tab.
|
||||
if (str_starts_with($href, 'https://')) {
|
||||
$props['newTab'] = true;
|
||||
}
|
||||
} elseif ($vergroessern) {
|
||||
$props['click'] = 'vergroessern';
|
||||
}
|
||||
@@ -275,7 +279,7 @@ $knopf = static function (string $id, string $inhalt, string $href, string $art
|
||||
.$farbe
|
||||
."&:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.18)}\n"
|
||||
.($pfeil ? "& .button-arrow svg{transform:rotate(45deg)}\n& .button-arrow{display:inline-flex}" : '& .button-arrow{display:none}');
|
||||
$block = ['id' => $id, 'type' => 'button', 'props' => ['text' => $inhalt, 'href' => $href], 'css' => $css];
|
||||
$block = ['id' => $id, 'type' => 'button', 'props' => ['text' => $inhalt, 'href' => $href] + (str_starts_with($href, 'https://') ? ['newTab' => true] : []), 'css' => $css];
|
||||
if ([] !== $style) {
|
||||
$block['style'] = $style;
|
||||
}
|
||||
@@ -591,7 +595,7 @@ $fuss = [
|
||||
['id' => 'fuss-rechtliches', 'type' => 'legal', 'props' => ['label' => 'Rechtliches'],
|
||||
'style' => ['desktop' => ['fontSize' => '14px', 'gap' => '24px', 'color' => '@auf-dunkel']],
|
||||
'css' => $fussLink],
|
||||
$text('fuss-agentur', '<a href="https://kant-it.de">Website by Kant-IT Solutions</a>', ['desktop' => ['fontSize' => '14px', 'margin' => ['bottom' => '0px']]], $fussLink),
|
||||
$text('fuss-agentur', '<a href="https://kant-it.de" target="_blank">Website by Kant-IT Solutions</a>', ['desktop' => ['fontSize' => '14px', 'margin' => ['bottom' => '0px']]], $fussLink),
|
||||
], '24px', ['flexWrap' => 'wrap'], ['rowGap' => '10px', 'columnGap' => '18px']),
|
||||
], '24px', ['justifyContent' => 'space-between', 'flexWrap' => 'wrap', 'rowGap' => '12px', 'borderWidth' => $nurOben('1px'), 'borderStyle' => 'solid', 'borderColor' => '#223027', 'padding' => ['top' => '24px', 'bottom' => '36px']],
|
||||
['flexDirection' => 'column', 'alignItems' => 'flex-start']),
|
||||
@@ -728,7 +732,7 @@ $stellenKarte = static function (string $id, string $titel, string $zeile, strin
|
||||
.'<span class="stelle-mehr" aria-hidden="true"></span>'
|
||||
.'</summary><div class="stelle-inhalt"><ul>'
|
||||
.implode('', array_map(static fn (string $p): string => '<li>'.$p.'</li>', $punkte))
|
||||
.'</ul><p class="stelle-wege"><a href="'.$whatsapp.'?text='.$nachricht.'">Per WhatsApp bewerben</a> <a href="'.$tel.'">Anrufen: '.$telefon.'</a></p></div></details>';
|
||||
.'</ul><p class="stelle-wege"><a href="'.$whatsapp.'?text='.$nachricht.'" target="_blank" rel="noopener">Per WhatsApp bewerben</a> <a href="'.$tel.'">Anrufen: '.$telefon.'</a></p></div></details>';
|
||||
};
|
||||
$helm = '<svg viewBox="0 0 240 150" width="240" height="150"><circle cx="120" cy="80" r="62" fill="#e9f5ed"/><path d="M68 104a52 52 0 0 1 104 0Z" fill="#067f30"/><rect x="113" y="54" width="14" height="48" rx="5" fill="#fff" fill-opacity=".28"/><rect x="52" y="102" width="136" height="13" rx="6.5" fill="#05622a"/></svg>';
|
||||
$lkwBild = '<svg viewBox="0 0 240 150" width="240" height="150"><circle cx="120" cy="80" r="62" fill="#e9f5ed"/><path d="M54 70h92v34H54z" fill="#05622a"/><path d="M148 62h30l18 22v22h-48z" fill="#067f30"/><path d="M158 70h18l12 14h-30z" fill="#e9f5ed"/><rect x="50" y="104" width="150" height="8" rx="3" fill="#17221b"/><circle cx="82" cy="116" r="12" fill="#17221b"/><circle cx="172" cy="116" r="12" fill="#17221b"/></svg>';
|
||||
@@ -758,7 +762,7 @@ $stellenCss = "& .stellen{display:grid;grid-template-columns:repeat(auto-fit,min
|
||||
|
||||
$kontaktKarte = static fn (string $id, string $icon, string $klein, string $wert, ?string $href) => $column($id, [
|
||||
['id' => $id.'-kreis', 'type' => 'column', 'children' => [$symbol($id.'-kreis-icon', $icon, 20)]],
|
||||
$text($id.'-text', $klein.'<br><strong>'.(null === $href ? $wert : '<a href="'.$href.'">'.$wert.'</a>').'</strong>'),
|
||||
$text($id.'-text', $klein.'<br><strong>'.(null === $href ? $wert : '<a href="'.$href.'"'.(str_starts_with($href, 'https://') ? ' target="_blank"' : '').'>'.$wert.'</a>').'</strong>'),
|
||||
]);
|
||||
// Karten mit Link heben sich beim Überfahren; der Link spannt die ganze Karte auf.
|
||||
$kontaktCss = "& > .block-column{position:relative;display:flex;align-items:center;gap:16px;margin-top:0;background:#fff;border-radius:14px;padding:16px 18px;box-shadow:0 6px 18px rgba(20,32,24,.05);transition:transform .2s ease,box-shadow .2s ease}
|
||||
|
||||
Reference in new issue
Block a user