Design-Frage: Forum-Radialhintergrund-Abmessungen ändern

Ich habe eine Nachfolgefrage zu diesem Beitrag: Create background gradient overlay on page, making the discussion area white

Beachten Sie, dass am unteren Rand des Forums auf mobilen Geräten der Hintergrund mit den „Vorgeschlagenen Themen

Ich glaube, ich habe einen kleinen Hack gefunden, der vielleicht nicht die beste Lösung ist, aber er macht definitiv das, wonach ich suche. Ich werde ihn hier dokumentieren und hoffen, dass sich jemand meldet, falls dies keine gute Lösung ist!

Das Standard-CSS für den Bereich „Vorgeschlagene Themen

Ach ja, ich habe vergessen, dass background-attachment: fixed auf iOS nicht funktioniert… Sie haben es deaktiviert, weil es anscheinend dazu führt, dass der gesamte Bildschirm beim Scrollen neu gezeichnet wird, was die Leistung beeinträchtigt.

Es gibt Workarounds…

Beispiel-CSS
body.mobile-view {
  background: none;
}

body.mobile-view:after {
  content:"";
  position:fixed;
  left:0;
  top:0;
  right:0;
  bottom:0;
  z-index:-1;
  display:block;
  background: radial-gradient(circle at center, rgba(255,255,255,1) 50%, rgba(255,255,255,0)) fixed, url(https://forums.pickleballist.com/uploads/default/original/1X/e7792afe9a5b7fbd26141c3c21e82b70cd495069.svg) center top / 300px auto;
  background-size:cover;
}

…obwohl sie die Funktionalität aktivieren, sind sie dennoch von den Leistungsproblemen betroffen. Daher solltest du für Mobilgeräte möglicherweise einen ganz anderen Hintergrundansatz versuchen, wenn du damit nicht zufrieden bist.

Brillant! Danke @awesomerobot! Wir schätzen deine genialen Designfähigkeiten immer sehr!