Anpassung Megamenü mit Modul

    Joomla Version
    5.0.1
    PHP Version
    PHP 8.2.x
    Hoster
    FC-Hosting
    Link (URL) zur Seite mit dem Problem
    https//vnv-urbex.de

    Hallo,

    ich stelle gerade einige Menüeinträge auf das Mega Menü um. In einem habe ich drei Spalten eingefügt. In der Ersten und Zweiten befinden sich die Submenüs und in der Dritten ein Modul mit eigenem Inhalt. Eine Überschrift mit etwas Text und Button. Den Text habe ich mit der Klasse "nav-submenu" an das Aussehen der Menüeinträge angepasst.


    Nun hätte ich noch gern diesen orangefarbenen Strich und die Überschrift im Stil der anderen wie zum Beispiel Deutschland. Damit komme ich aber nicht weiter und bräuchte eure Hilfe.


    Hier der Link zur Seite und dann handelt es sich um den Menüeintrag "Luftschutzstollen".



    Vieln Dank

    Versuche es mal hiermit:

    Code
    #mod-custom280:hover p {
    text-transform: uppercase;
    font-size: 0.94rem;
    font-weight: bolder;
    font-family: "Open Sans Regular", Arial, Helvetica, sans-serif
    border-bottom: 1px solid #fe6700;
}

    Das muss sicher noch ein wenig angepasst werden, aber grundsätzlich sollte es in die richtige Richtung gehen.

    Sauberer wäre es, wenn Du Deinem Modul eine Klasse als Modulklassensuffix mitgeben würdest, welche Du dann statt der ID #mod-custom280 nutzen könntest.

    Hallo, ich habe mir jetzt in meiner custom.css folgende Klasse erstellt.


    #meinmodulmegamenu:hover p {
     text-transform: uppercase;
     font-size: 0.94rem;
     font-weight: bolder;
     font-family: "Open Sans Regular", Arial, Helvetica, sans-serif
     border-bottom: 1px solid #fe6700;
    }


    Und die Moduleinstellungen wie folgt eingestellt.



    Dies scheint aber falsch zu sein, da sich nicht ändert. Was mache ich falsch? Habs auch schon mit . statt # probiert. Viele Grüße

    Anfangs hatte ich es auch mit dem Punkt probiert, dachte dann das wäre vielleicht doch falsch und setzte wieder die # davor. Aber auch mit Punkt ändert sich einfach nichts. Muss ich beim Header Tag noch etwas ändern?


    Die Klasse lässt sich ja auch finden, aber in der rechten Spalten finden sich die Regeln nicht.


    Hallo,


    mich wunderte, dass ein Code nicht funktionierte.

    Grund ist: In der Zeile 306 (custom.css) fehlt die abschließende Klammer } (media queries).

    Code
    .meinmodulmegamenu h3 {
text-transform: uppercase;
font-size:0.94rem;
font-weight: bolder;
font-family: "Open Sans Regular", Arial, Helvetica, sans-serif;
border-bottom: 1px solid #fe6700; 
 }

    falls Du es so meinst?



    Liebe Grüße & Gute Nacht .........

    Christine

    Kann es sein, dass Du (versehentlich) den Titel des Moduls anzeigst? Der war nämlich in Deinem ursprünglichen Post noch nicht drauf.


    Vielleicht probierst Du es mal mit meinem Vorschlag aus #2, also direkt mit der ID des Elements!? Damit hatte ich beim Testen in den Browser-Entwicklertools (weitgehend) Erfolg. Wenn das funktionieren sollte, kannst Du es immer noch mit einer eigenen Klasse optimieren.


    Übrigens: Hast Du JCH Optimize oder ein anderes Kompressionstool aktiviert? Das macht das Testen nämlich nicht leichter.

    Hallo, ich zeige momentan den Modultitel an und habe in das Modul eine Überschrift H3 eingefügt. Ich habe beide Codes in der CSS eingefügt.


    Ich habe den Cache deaktiviert und nutze kein JCH oder Ähnliches. Außerdem lösche ich Browsercache und Astriodcache. Egal, was ich versuche, es ändert sich gar nichts. Ich habe auch ein neues Modul erstellt, alle Einstellungen im Modul belassen und nur meine Klasse eingefügt.



    Liegt es vielleicht am Astriod Framework?

    In deiner custom.css Datei fehlt diesen Code:


    Code
    .meinmodulmegamenu h3 {
text-transform: uppercase;
font-size:0.94rem;
font-weight: bolder;
font-family: "Open Sans Regular", Arial, Helvetica, sans-serif;
border-bottom: 1px solid #fe6700; 
}


    Was leider bisher nicht funktioniert, ist das "bolder". Ich habe bereits ein !important eingefügt, aber der Text wird nicht angepasst. Mit

    font-weight: 700; wird der Text zwar größer, aber das ist nicht das gewünschte Ergebnis.


    Vielleicht hat da noch jemand eine Idee, bei den anderen Überschriften ist es auch mit bolder gelöst.


    Einen schönes Restwochenende