Quellen und Lizenzen · claveon.de ================================= Wetterdaten ----------- Das Wetter in Köln auf der Startseite: Datenbasis Deutscher Wetterdienst (DWD), abgerufen über Bright Sky (https://brightsky.dev). Lizenz: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/deed.de). Änderung: Temperatur auf ganze Grad gerundet. Gestaltungselemente der Startseite (MIT-Lizenz) ----------------------------------------------- Nach Vorlagen auf CodePen, angepasst an die Farben und Schriften von ClaveON: Wettersymbole: "No SVG, Pure CSS Animated Weather Icons" Copyright (c) Prasad D, https://codepen.io/prasad-d/pen/yWWxBM Papierflieger: "Paper Plane Animation (CSS)" Copyright (c) Miguel (mgutiem), https://codepen.io/mgutiem/pen/BaNBONV Leuchtender Rand der Schaltfläche "Termin anfragen": "Shiny call-to-action button" Copyright (c) Ryan Mulligan, https://codepen.io/hexagoncircle/pen/MWMqXbK Für alle drei gilt: Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. Geschwindigkeitsmessung auf /wlan/ (MIT-Lizenz) ----------------------------------------------- Messverfahren: @cloudflare/speedtest 1.14.2, Copyright (c) 2023 Cloudflare, https://github.com/cloudflare/speedtest. Gemessen wird gegen claveon.de, die Ergebnisse werden nicht an Cloudflare gesendet. Anzeige (Bogen mit logarithmischer Skala): nach "Speed Test Gauge Progress with Needle and Ticks", Copyright (c) CodeFronts, https://codefronts.com/components/css-progress-bars/speed-test-gauge/ Für beide gilt die MIT-Lizenz, Wortlaut oben. Karten auf /smartphone-hilfe-koeln/ (MIT-Lizenz) ------------------------------------------------ Die Karten bei "Am Handy klemmt etwas?" (Gegenstand, der aus seiner Farbfläche herausragt, mit Bodenschatten) nach "3D Pop-Out Character Card", Copyright (c) CodeFronts, https://codefronts.com/components/css-cards/3d-pop-out-character-card/ Die MIT-Lizenz gilt, Wortlaut oben. Die Anordnung als aufgefächerte Kartenhand ist eine Idee nach den Service-Karten von truus.co, ohne übernommenen Code. Die Wendekarten bei "Ehrlich gesagt: das machen wir nicht" nach "Pure-CSS 3D Flip Product Card", Copyright (c) CodeFronts, https://codefronts.com/components/css-product-cards/pure-css-3d-flip-product-card/ Ebenfalls MIT-Lizenz. Preisschilder auf /preise/ -------------------------- Die rollenden Ziffern folgen der Technik aus "The Odometer Effect (without JavaScript)", https://frontendmasters.com/blog/the-odometer-effect-in-css Das Schaukeln nutzt die CSS-Funktion linear() wie in "Create complex animation curves in CSS with the linear() easing function", https://developer.chrome.com/docs/css-ui/css-linear-easing-function Die Kurve berechnen wir selbst (gedämpftes Pendel). Eigener Code, kein übernommener Quelltext. Bei "Womit können wir helfen?" wächst eine Kachel zu einem Detailblatt (View Transitions API), nach "Card to Full Page Detail Morph", Copyright (c) CodeFronts, MIT-Lizenz (Wortlaut oben), https://codefronts.com/motion/css-view-transitions/card-to-full-page-detail-morph/ und nach "Dialog view transitions" von Thomas Günther, https://medienbaecker.com/articles/dialog-view-transitions Der Kassenbon bei "Mehrere Sachen auf einmal?" hat seinen gezackten Rand nach "Receipt Printer", Copyright (c) 2025 kokonutUI, MIT-Lizenz (Wortlaut oben), https://kokonutui.com/docs/cards/receipt-printer Der Küchenwecker bei "Kommt noch etwas dazu?" dreht sich mit relativem Ziehen über mehrere Umdrehungen, nach "input-knob" von Google Chrome Labs, Apache-Lizenz 2.0, https://github.com/GoogleChromeLabs/input-knob Die Bedienelemente selbst sind normale Eingabefelder (range) und eine Schaltfläche, nach dem Slider Pattern der W3C ARIA Authoring Practices, https://www.w3.org/WAI/ARIA/apg/patterns/slider/ Eigener Code. Bilder auf der Startseite ------------------------- Der Himmel im Kopf (Sonne und Wolken) und die Szenen auf den Kacheln "Wobei dürfen wir helfen?" (Router auf einem Beistelltisch, Laptop mit Tasse, Handy und Tablet, Drucker, Fernseher auf einem Sideboard, Lautsprecher mit Lampe) und die Gegenstände bei "Festpreise, vorher genannt." (Router mit Repeater, neues Handy mit Karton, Fernseher mit Soundbar, Ordner, Router mit Lupe) und auf dem Handy das Haus bei "Was kostet ein Termin bei Ihnen?" und Sessel, Tischkalender und Türklingel bei "Für wen wir arbeiten" sind mit KI erzeugt (OpenAI, gpt-image-2.5), keine Produktfotos, ohne Personen, Logos oder Marken. Der Aufbau des Kopfes in Ebenen folgt der Idee der Firewatch-Website (Campo Santo), nachgebaut in CSS von Sam Beckham, https://codepen.io/samdbeckham/pen/OPXPNp (MIT-Lizenz, Wortlaut oben). Eigener Code. Bild auf /termin/ ----------------- Die Hausfassaden im Hintergrund sind mit KI erzeugt (OpenAI, gpt-image-2.5): keine bestimmte Straße, ohne Personen, Schilder oder Hausnummern. Bild auf /wlan/ --------------- Das Wohnzimmer im Kopf ist mit KI erzeugt (OpenAI, gpt-image-2.5), die Person ist erfunden. Die Tiefenkarte, mit der sich das Bild beim Scrollen räumlich bewegt, wurde einmalig aus diesem Bild berechnet mit Depth Anything V2 Small (Apple, Core ML, https://huggingface.co/apple/coreml-depth-anything-v2-small, Apache-2.0). Eigener Code. Bilder auf /preise/ ------------------- Die Gegenstände an den Preisschildern (Router, Werkzeugtasche, Laptop mit Maus) und auf den Kacheln (Router, Handy im Karton, Tintenstrahldrucker, Fernseher, Umzugskarton, zwei Laptops, Ordner, Kopfhörer, Mitgliedskarte), der Bondrucker bei "Mehrere Sachen auf einmal?" und bei "Kommt noch etwas dazu?" der Küchenwecker, das Spielzeugauto, das Sparschwein und die Münze sind mit KI erzeugt (OpenAI, gpt-image-2.5), keine Produktfotos, ohne Personen, Logos oder Marken. Bilder auf /wlan/ ----------------- Das Foto im Kopf von /wlan/ ist mit KI erzeugt (OpenAI, gpt-image-2.5) und auf der Seite als "KI-generiertes Bild" gekennzeichnet. Die abgebildete Person gibt es nicht. Die Gegenstände (Sanduhr, Kabel, Bett, Karton, Klemmbrett, Router mit Kabel) sind ebenfalls mit KI erzeugte Darstellungen, keine Produktfotos. Die Gerätefotos unter "Welchen Router empfehlen wir?" sind Herstellerfotos von AVM und TP-Link; für die Seite wurde nur der Hintergrund entfernt. Bilder auf /termin/ ------------------- Die Gegenstände bei "Worum geht es?" (Router, Drucker, Laptop, Handy, Fernseher, Brief, Sprechblase) sind mit KI erzeugt (OpenAI, gpt-image-2.5), keine Produktfotos. Ebenso die drei Gegenstände bei "Fernwartung: so verbinden wir uns" (Handy mit Link, Laptop, Maus mit Haken). Fragen auf /senioren/ --------------------- Die Suche in den häufigen Fragen (Themen mit Anzahl, Suche in Fragen und Antworten mit Markierung, "Ihre Frage ist nicht dabei?") folgt der Vorlage "FAQ category accordion" von Design Lounge (https://www.designlounge.live/p/faq-category-accordion, frei nutzbar, Nennung erbeten). Eigener Code. Karte auf /senioren/ -------------------- Die Karte der Kölner Stadtteile beruht auf dem Datensatz "Stadtteile Köln" der Stadt Köln (Amt für Stadtentwicklung und Statistik, Offene Daten Köln), Datenlizenz Deutschland – Zero – Version 2.0 (https://www.govdata.de/dl-de/zero-2-0). Vereinfacht mit scripts/karte-koeln.mjs. Bilder auf /senioren/ --------------------- Das Foto im Kopf von /senioren/ (ein älteres Paar auf dem Sofa) ist mit KI erzeugt (OpenAI, gpt-image-2.5) und auf der Seite als "KI-generiertes Bild" gekennzeichnet. Die abgebildeten Personen gibt es nicht; sie sind keine Kundinnen oder Kunden von ClaveON. Ebenso das Foto bei "Für Angehörige" (eine Frau am Telefon): die Person gibt es nicht. Die Gegenstände bei "Was es kostet" (Haus, neues Handy, Laptop) und bei "Das ist es" (Sessel, Telefon, Tablet) und bei "Womit wir helfen" (Router, Handy, Computer, Drucker, Fernseher, Fotos) und bei "Drei Themen" (Brief mit Schloss, Handy mit Schild, Tablet mit Videoanruf) und bei "Wichtig zu wissen" (Handy mit Warnung, Brief am Haken, Telefonhörer mit Verbotsschild) und bei "Drei Anlaufstellen" (Cafétisch, Werkzeugkasten, Türklingel) sind ebenfalls mit KI erzeugt (OpenAI, gpt-image-2.5), keine Produktfotos. Bilder auf /smartphone-hilfe-koeln/ ----------------------------------- Alle Bilder dieser Seite sind mit KI erzeugt (OpenAI, gpt-image-2.5): im Kopf ein neues Handy ohne Marke; bei den zwei Angeboten ein Umzugskarton mit einem alten und einem neuen Handy und ein Handy auf einem Kissen; bei "Was kommt mit aufs neue Handy?" die beiden Handys und die Gegenstände für die Daten (Fotos, Adressbuch, Briefe, Postkarten, Tischkalender, Holzklötze, Drehregler, Briefumschlag, Telefon); bei "Am Handy klemmt etwas?" farbige Handys und ein Laptop mit Gegenständen daneben; bei "Ehrlich gesagt: das machen wir nicht" Schraubendreher-Etui, Wasserglas, Einkaufstasche, Vorhängeschloss und Laptop; bei den Fragen ein Gegenstand je Frage (Geldbörse, Handys, Decke, Fotoglas, Notizbuch, Tablet); im Schluss das neue Handy mit Fotos, Adressbuch, Umschlag und Postkarten. Sie zeigen keine Personen, keine Logos und keine echten Geräte einer bestimmten Marke. Bilder in unseren E-Mails ------------------------- Die Bilder in der Bitte um eine Bewertung (Laptop, Handy und Pflanze auf einem Sockel, Sonne, Wolken, Regen) und das blaue Auto in der Nachricht "Ihr Techniker ist unterwegs" sind mit KI erzeugt (OpenAI, gpt-image-2.5), keine Produktfotos. Das Auto ist kein bestimmtes Modell und trägt kein Logo; die Bilder zeigen keine Personen. Schaltflächen der Startseite (GPL-3.0) -------------------------------------- Die runden Schaltflächen ("Circle Bloom" und "Arrow Relay") sind eine Bearbeitung der freien Komponenten Button 30 und Button 26 von Starwind Pro, Copyright (c) Cosmic Web Designs, LLC (https://pro.starwind.dev/components/button/button-30/ und .../button-26/). Lizenz: GNU General Public License, Version 3 (GPL-3.0). Lizenztext: https://claveon.de/lizenzen/gpl-3.0.txt Quelltext unserer Bearbeitung: https://claveon.de/lizenzen/pildora.astro.txt Die Bearbeitung steht unter derselben Lizenz. Sie wird ohne jede Gewährleistung bereitgestellt, soweit gesetzlich zulässig (GPL-3.0, Abschnitte 15 und 16).