TS: CSS 

Hello,

für meine passiven View-Templates benutze ich immer Platzhalter, die dann je nach Rechten, Hauptseite, Modul, Unterseite usw. ausgetauscht werden gegen die vom Backend erzeugten Teile.

z. B.:


<!-- {{PIC-107}} -->   

Die stehen so einfach im Quelltext. Für Attribute und ~werte sehen sie etwas anders aus.

  1. Kann ich die mittels CSS ansprechen und nach meinem Wunsch stylen?
  2. könnte ich mittels CSS auch automatisch einen Link daraus machen, bzw. hinzufügen, der sich am enthaltenen Parameternamen orientiert?

z. B.:


   <a id="L_PIC-107" href="/help/PIC-107">{{PIC-107}}</a>  

Alternativ müsste das alles vom Backend erledigt werden, also vor der Ausgabe z. B. mittels PHP-DOM-Parser.

Liebe Grüße
Tom S.

--
Es gibt nichts Gutes, außer man tut es!
Das Leben selbst ist der Sinn.
  1. Hi,

    für meine passiven View-Templates benutze ich immer Platzhalter, die dann je nach Rechten, Hauptseite, Modul, Unterseite usw. ausgetauscht werden gegen die vom Backend erzeugten Teile.

    z. B.:

    
    <!-- {{PIC-107}} -->   
    
    

    Die stehen so einfach im Quelltext. Für Attribute und ~werte sehen sie etwas anders aus.

    1. Kann ich die mittels CSS ansprechen und nach meinem Wunsch stylen?

    Kommentare können m.W. nicht gestylet werden. Wenn das durch irgendwas ersetzt wird: dann hängt's davon ab, wodurch es ersetzt wird.

    1. könnte ich mittels CSS auch automatisch einen Link daraus machen, bzw. hinzufügen, der sich am enthaltenen Parameternamen orientiert?

    nein, CSS kann nicht aus einem Kommentar einen Link machen.

    Alternativ müsste das alles vom Backend erledigt werden, also vor der Ausgabe z. B. mittels PHP-DOM-Parser.

    Richtig, das ist das, was Du tun solltest.

    cu,
    Andreas a/k/a MudGuard

    1. Hello,

      z. B.:

      
      <!-- {{PIC-107}} -->   
      
      

      Die stehen so einfach im Quelltext. Für Attribute und ~werte sehen sie etwas anders aus.

      1. Kann ich die mittels CSS ansprechen und nach meinem Wunsch stylen?

      Kommentare können m.W. nicht gestylet werden. Wenn das durch irgendwas ersetzt wird: dann hängt's davon ab, wodurch es ersetzt wird.

      Das muss kein Kommentar sein, wenn ich per CSS auch dafür sorgen könnte, dass z. B. der Textteil {{PIC-107}} in einem größeren Text (dann vermutlich einfach in den <main> geschmissen) erkannt und (u. a.) auf hidden gesetzt werden könnte.

      Alternativ müsste das alles vom Backend erledigt werden, also vor der Ausgabe z. B. mittels PHP-DOM-Parser.

      Richtig, das ist das, was Du tun solltest.

      Das geht aber nur dann, wenn das Ganze auch mittels PHP ausgegeben wird. Ich hatte als Ziel, dass die Dateien auch ohne PHP lokal betrachtet werden könnten.

      Liebe Grüße
      Tom S.

      --
      Es gibt nichts Gutes, außer man tut es!
      Das Leben selbst ist der Sinn.
      1. Hallo Tom,

        wie wäre es mit JavaScript?

        Viele Grüße
        Robert

        1. Hello,

          wie wäre es mit JavaScript?

          Das wäre in diesem Falle zulässig. Stimmt!

          Die Kontrollseiten werden ja nur an bestimmten Arbeitsplätzen benutzt, verändert und auf Vollständigkeit getestet.

          Wie müsste denn da die Parametererkennung aussehen? Mit JS und regular Expressions in einem Atemzug stehe ich enorm auf Kriegesfuß.

          Für die Praxis würde das bedeuten, dass das PHP-System die blanken HTML-Seiten ausspuckt, diese einen passenden CSS-Rel-Link enthalten und auch das passende JS-Script anziehen. Damit müssten sie später nicht mehr geändert werden. Außerdem könnte ich Einfluss auf das CSS nehmen, wenn ich z. B. zusätzlich per JSON oder embedded JSON (für den local Storage) Rahmenbedingungen (Größen, Farben, etc.) zur Verfügung stellen würde.

          Die Idee gefällt mir :-)

          Liebe Grüße
          Tom S.

          --
          Es gibt nichts Gutes, außer man tut es!
          Das Leben selbst ist der Sinn.
          1. Hallo Tom,

            Wie müsste denn da die Parametererkennung aussehen? Mit JS und regular Expressions in einem Atemzug stehe ich enorm auf Kriegesfuß.

            Bevor du mit Frameworks wie Angular auf die Seiten schießt, könntest du bspw. span-Elemente verwenden, denen eine bestimmte Klasse geben, so dass diese per CSS nicht angezeigt werden und in JavaScript über diese iterieren

            Für die Praxis würde das bedeuten, dass das PHP-System die blanken HTML-Seiten ausspuckt, …

            Soll dein Beispiel nicht auch offline laufen?

            Viele Grüße
            Robert

            1. Hello,

              Soll dein Beispiel nicht auch offline laufen?

              Offline "laufen" soll es nicht (also keine qualifizierten Responses auf ausgelöste Requests), es soll nur offline sauber angezeigt werden können und eine gewisse Kopplung (entweder online oder offline) zu Hilfedateien bekommen.

              Es handelt sich um die passiven Templates des Views, die angepasst werden müssen. Die Bearbeiter sind durchaus in der Lage, die verschiedensten Editoren zu benutzen und können auch HTML, wissen aber natürlich nicht alle verfügbaren Platzhalter für die Dokumente auswendig oder was sonst noch verstellbar ist.

              Ich möchte das Frontend-System aber so minimalistisch halten bezüglich der Anforderungen an den Client, dass alle Arbeiten auch offline auf einem Tablet o. ä. möglich wären.

              Ich weiß jetzt nur noch nicht, wie ich sicherstellen könnte, dass die CSS- und JS-Dateien im Cache erhalten bleiben würden, bis das Geräte wieder online geht und dann ein Abgleich stattfinden könnte. Außerdem müsste das Arbeitsergebnis auch geschützt bleiben und erst bei Auftrag auf den Server zurückgespielt werden.

              Das Ganze ohne "App". Die Clients verfügen allerdings über reichlich eigenen Speicherplatz und Apps, wie z. B. "TurboClient" o. ä.

              Ich muss das jetzt erstmal sacken lassen. ;-)

              Liebe Grüße
              Tom S.

              --
              Es gibt nichts Gutes, außer man tut es!
              Das Leben selbst ist der Sinn.
              1. Hallo TS,

                Warum nicht

                <!-- {{PIC-107}} -->
                bla bla bla beispiel-html
                <!-- {{/PIC-107}} -->
                
                

                für die passiven Templates. Dann kannst Du mit CSS wie gewünscht arbeiten. Alles innerhalb der Kommentare schmeißt Du dann später bei der Generierung raus und ersetzt es wie gehabt mit dem automatisch generierten HTML.

                Gruß, Nils

                1. Hallo Nils,

                  Warum nicht

                  <!-- {{PIC-107}} -->
                  bla bla bla beispiel-html
                  <!-- {{/PIC-107}} -->
                  
                  

                  für die passiven Templates. Dann kannst Du mit CSS wie gewünscht arbeiten. Alles innerhalb der Kommentare schmeißt Du dann später bei der Generierung raus und ersetzt es wie gehabt mit dem automatisch generierten HTML.

                  Aber mit CSS allein kommst du doch noch immer nicht daran.

                  Viele Grüße
                  Robert

                  1. Hallo Robert,

                    Ja, ich war zu faul, jetzt HTML per Hand zu schreiben. bla bla bla beispiel-HTML sind natürlich irgendwelche Elemente auf die man zugreifen kann.

                    Gruß, Nils

                    1. Man braucht unter Umständen auch eine Regex-Implementierung, die rekursiv matchen kann, da es eventuell templates wie <!-- foo --><!-- foo --><!-- /foo --><!-- /foo --> gibt und man das letzte /foo und nicht das vorletzte matchen will. Weiß nicht, ob PHP so etwas hat, Python ja (siehe dort Recursive patterns).

                      Gruß, Nils

                      1. Hallo Nils-Hero,

                        Vor meinem geistigen Auge tut sich gerade ein Abgrund auf. Man muss diesen unerfahrenen Bearbeitern wirklich klar machen, daß sie die Platzhalter nicht löschen dürfen, etwa:

                        <div style="border:10px solid red;" data-template="bla">ICH BIN EIN PLATZHALTER; WER MICH LÖSCHT WIRD GEFEUERT</div>
                        
                        

                        Gruß, Nils

                        1. Das Matchen kann natürlich auch mittels XPath vonstatten gehen.

                          Gruß, Nils

                        1. Hallo Robert,

                          [Wieso?](m1702162)

                          ich habe deinen Link repariert. Kurzlinks (falls du einen erzeugen wolltest) funktionieren hier so https://forum.selfhtml.org/m1702162. (Nur den Anker zu benutzen – [Wieso?](#m1702162) – könnte auch problematisch sein, weil nicht jeder Nutzer die Nested-Ansicht nutzt.)

                          Gruß
                          Julius

                          1. Hallo Julius,

                            (Nur den Anker zu benutzen – [Wieso?](#m1702162) – könnte auch problematisch sein, weil nicht jeder Nutzer die Nested-Ansicht nutzt.)

                            s/könnte problematisch sein/ist problematisch/

                            Am besten, man verlinkt immer mit vollständiger URL.

                            LG,
                            CK

                          2. Moin Julius,

                            da habe ich wohl das https://… davor vergessen, Mist. Aber Danke, dass du es gesehen und repariert hast 😀

                            Viele Grüße
                            Robert

  2. @@TS

    könnte ich mittels CSS auch …

    Das P in CSS steht für programming language.

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
    1. Hello,

      Das P in CSS steht für programming language.

      Ja danke für die Erinnerung. Herr Turing hat's verschluckt.

      Liebe Grüße
      Tom S.

      --
      Es gibt nichts Gutes, außer man tut es!
      Das Leben selbst ist der Sinn.