Welcher CSS hack? Die drei CSS Anweisungen die das Flex Layout anpassen?
Dazu weiß ich nicht ob das auch mobil gut ist so.
Beiträge von Syntafin
-
-
Frohes neues Jahr
ich beginne meines mit Kopfschmerzen, hoffentlich bin ich damit alleine. -
So ganz ohne Code kann ich dir dazu nix sagen, Backpack selbst auch noch nie verwendet (bin ja beim LIST/VIST Stack)
-
Oben rechts haben wir einen Style Wechsler eingebaut, damit man mit einem Mausklick zwischen Light und Dark wählen kann
Der Überschreibt übrigens was der Nutzer einstellt:
-
Dein Code hilft zumindest schon mal beim Problem mit dem Hintergrund
-
Grundlegend mein Plan hier mal besser erklärt:
Aktuell unterstützt meine Seite nur den Darkmode, es gibt kein "Light", dürfte auch klar sein weshalb:
Da ist nix "Hell", also will ich da grundsätzlich mal auch an etwas hellerem Arbeiten, nicht jedem gefällt es "dunkel" ja. Aber Grundlegend habe ich auch die Idee mehr Farbvariationen anzubieten. Aktuell ist alles in meinem Lieblingsfarben gehalten, ganz offensichtlich viel Lila und Pink...
Aber was spricht zB etwas mehr Rot, Blau, Orange, Grün, etc? Nichts! Und wenn wir dabei sind, wieso nicht gleich ein AMOLED Modus, mit so viel Schwarz wie nur möglich?Aktuell sieht zB eine Karte so aus:
HTML
Alles anzeigen<template> <div class="h-auto bg-white/10 bg-clip-padding p-4 drop-shadow backdrop-blur-sm backdrop-filter"> <slot /> </div> </template> <script setup> import { usePage } from '@inertiajs/vue3'; import { computed } from 'vue'; const style = usePage().props.featureFlags.cardGradient; const classes = computed(() => { return style ? 'h-auto rounded bg-white/20 bg-gradient-to-b to-white/10 bg-clip-padding p-4 drop-shadow backdrop-blur-sm backdrop-filter' : 'h-auto rounded bg-white/10 bg-clip-padding p-4 drop-shadow backdrop-blur-sm backdrop-filter'; }); </script>Man sieht hier eindeutig das Karten recht einfach gehalten sind ja.
Grundvorstellung also:
Dark: bg-white/10
Light: bg-black/10
AMOLED: bg-blackSähe dann zB so in gänze aus: h-auto bg-black/10 dark:bg-white/10 amoled:bg-black bg-clip-padding p-4 drop-shadow backdrop-blur-sm backdrop-filter
Normalerweise arbeitet Tailwind einfach nach dem was prefers-color-scheme vom Browser vorgibt, man kann das aber auf die Selektor-Strategie ändern, wo durch setzten von dark im HTML-Tag als Klasse dies getoggelt wird (bspw. via JS ja).
Dazu gibts auch ganz gut eine Erklärung in den Docs:HTML
Alles anzeigen<!-- Dark mode not enabled --> <html> <body> <!-- Will be white --> <div class="bg-white dark:bg-black"> <!-- ... --> </div> </body> </html> <!-- Dark mode enabled --> <html class="dark"> <body> <!-- Will be black --> <div class="bg-white dark:bg-black"> <!-- ... --> </div> </body> </html>Mein Ziel ist also, Tailwind so zu erweitern, das wenn ich zB das hier habe:
HTML<!-- AMOLED Mode --> <html class="amoled"> <body> <!-- Will be AMOLED Mode --> <div class="bg-white dark:bg-gray-900 amoled:bg-black"> <!-- ... --> </div> </body </html>Das eben die AMOLED-Klassen gewählt werden, entsprechend erweitert für weitere Selektoren wie red etc.
-
Fast richtig!
Man kann ja via dark steuern was je nach Präferenz des Nutzers gezeigt wird, ändert man das aber in dein Tailwind Settings auf Selektor Modus, kann man das ja "selbst toggeln", mein Plan ist es neben dem vermeitlichen Light-Mode vlt. auch einen AMOLED-Modus zu bringen, das würde ich dann halt gerne damit steuern.
-
Hab leider kein wbb ..
Brauchts nicht für ne Sache vom Core
.Ansonsten, mal eben auf meiner Test-Instanz für das sehr gut gepflegte Plugin herumgespielt, wenn es so passt wie beim ersten Post:
CSS
Alles anzeigen.contentItemList { flex-direction: column; } .contentItemLink { display: flex; } .contentItemImage { width: 30%; } .contentItemContent { width: 70%; }Live hier zu sehen:
Default Ansicht -> WSC Standard Stil auswählen -
Zeig mir nur einen bei hetzner der auf Grund deiner repos Hilfestellung zur Technik am Webspace geben kann bzw die Einstellungen für dich vornimmt.
Damit der Hoster-Thread OT frei bleibt:
Dafür muss ich nur ins Erdgeschoss
da wohnt ein MA von Hetzner der in der passenden Abteilung arbeitet.Aber da ich meine Server nicht administrativ pflege (warum sollte ich... dafür gibts entsprechende Tools), sind die eh von Anfang an korrekt eingestellt und mit allem versorgt was ich brauche.
(Die API von diesem Dienst wird übrigens auch verwendet für die automatische Bereitstellung)
-
Es wird hier grundsätzlich falsch verstanden was ich meine.
Das einbringen solcher Möglichkeiten wäre mMn etwas was ihm helfen würde gegen die großen Player gleichzuziehen, denn was Hetzner da anbietet haben Amazon, Google, DigitalOcean und viele andere auch und auch Firmen suchen sich ihre Hoster nach diesem Prinzip aus.
-
Woltlab verwendet das normale Artikelsystem auf ihrer Seite.
Aber ohne das jetzt Mal zu sehen wie es normalerweise aussieht und wie du es etwa haben willst, kann man schlecht jetzt schauen.
Außer du meinst das das mit dem Bild links und Rest rechts immer so sein sollte.
-
Wie meinst du untereinander? Und wo?
Kannst du das vielleicht anhand eines Screenshots und evtl einen Link zu einer Ansicht erklären?
Dann könnte man sich das mal anschauen.
-
Rein aus Neugier. Was genau machst du damit bzw. was ist der Hintergrund das du einmal die Woche 10 Server erstellst und die nach einer Stunde wieder gelöscht werden. Also würde mich mal interessieren, wofür genau du das machst.
Die dienen als Wegwerfsysteme um einmal wöchentlich sämtliche Daten zu aktualisieren.
Da Square Enix nur eine begrenzte Anzahl an Verbindungen pro Sekunde zulässt, brauchen wir für den Vorgang ein paar mehr.
Die Server werden also erstellt, bekommen direkt ihre Liste mit die sie zu erledigen haben, machen ihres und senden es an unseren Hauptserver, anschließend löscht dieser diese wieder.
-
Mal für dich als vergleich, da ich Hetzner derzeit verwende für die Automatisierte Provisionierung:
Es braucht da schon die Möglichkeiten den bestellten "Server" vorab konfigurieren zu können und direkt einzubinden.
Beispielsweiße ordere ich via der API von Hetzner 1x pro Woche 10 CAX11 Server und die werden automatisch mit NGINX, TinyProxy und unserem Webscraper provisioniert, nach ca. 1h löscht es das System dann wieder. -
Weiterhin aber keine API zur Abwicklung von Bestellungen.... damit weiterhin nicht "brauchbar" heutzutage wenn man auf Unattended Services setzt.
-
Ja... durch ein anderes Thema drauf gekommen.
Schon jemand Erfahrung mit gemacht wie man ähnlich des dark Modifier was anderes einbauen kann?
Die Idee des AMOLED/OLED Modus kam mir wieder ein, das würd ich dann halt gerne ähnlich lösen.Also das man am Ende zB bg-white dark:bg-gray-900 amoled:bg-black machen könnte
. -
Es wäre unmenschlich von uns wenn wir euch keinen Darkmode zur Verfügung stellen würden
Denkt an die OLED Nutzer!!!!
-
Den nutze ich aktuell auch, wer kein Darkmode zur Verfügung stellt in 2024 gehört bestraft
. -
Aber wenn ihr einen „einfachen“ bzw. leicht zu verstehen Framework kennt haut raus
Für deine Anwendungszwecke:
LaravelFürs Templating dann einfach Blade verwenden, solls interaktiv werden schau dir Livewire an, das ist wie JS, nur ohne JS dann.
-
Auch von mir ein willkommen
