[SOLVED] CSS Klasse für Modul: UIkit 3 Gallery with Text
- Pedro de Maciot
- Offline Topic Author
- Senior Boarder
- Posts: 54
- Thank you received: 1
CSS Klasse für Modul: UIkit 3 Gallery with Text was created by Pedro de Maciot
Posted 4 months 3 days ago #34950
Hallo Joomlaplates Team,
ich möchte in meiner Galerie bei den Bildern den Text unten anfügen. Wie kann ich für dieses Modul eine CSS Klasse festlegen, die dann nur für dieses Modul gilt.
Bis jetzt habe ich es noch nicht geschafft, unter Custom CSS die richtigen Steuerelemente einzufügen. Ich möchte die Schrift undTypografie ändern.
Beispiel:
.moduletable gallerytext {
font-family: "Open Sans"
font-size: 14px;
line-height: 16px;
font-color: black;
}
Die Textänderung soll aber nur unter den Bildern erfolgen und nicht in der Lightbox.
Url: peter-wiegner.de
Viele Grüße
Pedro de Maciot, Lanzarote
ich möchte in meiner Galerie bei den Bildern den Text unten anfügen. Wie kann ich für dieses Modul eine CSS Klasse festlegen, die dann nur für dieses Modul gilt.
Bis jetzt habe ich es noch nicht geschafft, unter Custom CSS die richtigen Steuerelemente einzufügen. Ich möchte die Schrift undTypografie ändern.
Beispiel:
.moduletable gallerytext {
font-family: "Open Sans"
font-size: 14px;
line-height: 16px;
font-color: black;
}
Die Textänderung soll aber nur unter den Bildern erfolgen und nicht in der Lightbox.
Url: peter-wiegner.de
Viele Grüße
Pedro de Maciot, Lanzarote
The topic has been locked.
Replied by WM-Loose on topic CSS Klasse für Modul: UIkit 3 Gallery with Text
Posted 4 months 3 days ago #34951
Bitte verwenden Sie die dafür die neue Gallery with text:
demo.joomlaplates.de/uikit/gallery/gallery-text.html
demo.joomlaplates.de/uikit/gallery/gallery-text.html
by WM-Loose
The topic has been locked.
- joomlaplates
- Offline
- Moderator
- Posts: 8807
- Thank you received: 1732
Replied by joomlaplates on topic CSS Klasse für Modul: UIkit 3 Gallery with Text
Posted 4 months 2 days ago #34952
Hallo, welchen Text meinen sie denn? Den Text in der Lightbox?
Wenn ja, das sollte wie folgt gehen.
Vergeben sie dem Module ein Modul class suffix > meine-gallery
Danach in die CSS folgenden Code
Wenn ja, das sollte wie folgt gehen.
Vergeben sie dem Module ein Modul class suffix > meine-gallery
Danach in die CSS folgenden Code
Code:
.meine-gallery .uk-lightbox-caption {
font-family: "Open Sans"
font-size: 14px;
line-height: 16px;
font-color: black;
}
Dokumentation:
www.joomlaplates.de/dokumentation.html
www.joomlaplates.de/dokumentation.html
by joomlaplates
The topic has been locked.
- Pedro de Maciot
- Offline Topic Author
- Senior Boarder
- Posts: 54
- Thank you received: 1
Replied by Pedro de Maciot on topic CSS Klasse für Modul: UIkit 3 Gallery with Text
Posted 3 months 4 weeks ago #34953
Hallo Moderator,
danke für den Code. Das werde ich so testen.
Eine weitere Frage dazu: Meine Besucher der Website "reklamieren" dass der Text in der Lightbox so weit unten am Rand des schwarzen Backgrounds ist und dann auch noch schnell wieder verschwindet! Das finden wenige hilfreich....
Kann ich den Text länger einblenden, kann ich den Text hochrücken unter das Bild mit einem festen Abstand zu Bild?
Das wäre toll, ist aber sicher kompliziert?
Herzliche Grüße
Pedro de Maciot
Live-Url: peter-wiegner.de/kunst-galerien/galerie-2020-2022
(und dann auf das jeweilige Bild klicken, damit die Lightbox öffnet)
danke für den Code. Das werde ich so testen.
Eine weitere Frage dazu: Meine Besucher der Website "reklamieren" dass der Text in der Lightbox so weit unten am Rand des schwarzen Backgrounds ist und dann auch noch schnell wieder verschwindet! Das finden wenige hilfreich....
Kann ich den Text länger einblenden, kann ich den Text hochrücken unter das Bild mit einem festen Abstand zu Bild?
Das wäre toll, ist aber sicher kompliziert?
Herzliche Grüße
Pedro de Maciot
Live-Url: peter-wiegner.de/kunst-galerien/galerie-2020-2022
(und dann auf das jeweilige Bild klicken, damit die Lightbox öffnet)
The topic has been locked.
Replied by WM-Loose on topic CSS Klasse für Modul: UIkit 3 Gallery with Text
Posted 3 months 4 weeks ago #34954
Test verschwindet ja nur nach einiger Zeit, wenn man die Maus nicht bewegt, was eigentlich normal ist.
Den Text höher setzen kann man z.B. mit diesem Code in custom css:
.uk-transition-toggle:hover [class*="uk-transition-slide"], .uk-transition-toggle:focus [class*="uk-transition-slide"], .uk-transition-toggle [class*="uk-transition-slide"]:focus-within, .uk-transition-active.uk-active [class*="uk-transition-slide"] {
padding-bottom: 3%;
}
Ich habe mal 3% als Wert genommen aber Sie können das selbst ja anpassen wie es Ihnen beliebt.
Mt dem % Wert einfach mal rumspielen.
Den Text höher setzen kann man z.B. mit diesem Code in custom css:
.uk-transition-toggle:hover [class*="uk-transition-slide"], .uk-transition-toggle:focus [class*="uk-transition-slide"], .uk-transition-toggle [class*="uk-transition-slide"]:focus-within, .uk-transition-active.uk-active [class*="uk-transition-slide"] {
padding-bottom: 3%;
}
Ich habe mal 3% als Wert genommen aber Sie können das selbst ja anpassen wie es Ihnen beliebt.
Mt dem % Wert einfach mal rumspielen.
by WM-Loose
The topic has been locked.
- Pedro de Maciot
- Offline Topic Author
- Senior Boarder
- Posts: 54
- Thank you received: 1
Replied by Pedro de Maciot on topic [SOLVED] CSS Klasse für Modul: UIkit 3 Gallery with Text
Posted 3 months 4 weeks ago #34955
Thank you!
Besten Dank!
Topic ist gelöst!
Kommentar: Das mit den Captions in der Lightbox höher setzen ( Ihre 3%) ist perfekt.
So kann man diesen Teil auch noch individuell gestalten. Klasse!
Die Schrift selbst habe ich für die Lightbox generell so perfekt an meine Wünsche angepasst:
Das wird sogar von Google Chrome akzeptiert!
.uk-lightbox-caption {
font-family: Open Sans;
font-size: 18px;
line-height: 22px;
font-weight: bold;
font-color: white;
}
Die Schrift im Modul Uikid 3 Gallery mit Text unter dem Bild (Content) verändern lässt sich so abweichend von der allgemeinen Body Schrift so einstellen:
Code:
.my-galleries-content .uk-lightbox-caption {
font-family: Open Sans;
font-size: 14px;
line-height: 16px;
}
Mit dem Suffix im Module (my-galleries-content) funktioniert das im Bereich "Elements" bei "Content CSS".
Herzlichen Dank.
Pedro de Maciot
peter-wiegner.de
Besten Dank!
Topic ist gelöst!
Kommentar: Das mit den Captions in der Lightbox höher setzen ( Ihre 3%) ist perfekt.
So kann man diesen Teil auch noch individuell gestalten. Klasse!
Die Schrift selbst habe ich für die Lightbox generell so perfekt an meine Wünsche angepasst:
Das wird sogar von Google Chrome akzeptiert!
.uk-lightbox-caption {
font-family: Open Sans;
font-size: 18px;
line-height: 22px;
font-weight: bold;
font-color: white;
}
Die Schrift im Modul Uikid 3 Gallery mit Text unter dem Bild (Content) verändern lässt sich so abweichend von der allgemeinen Body Schrift so einstellen:
Code:
.my-galleries-content .uk-lightbox-caption {
font-family: Open Sans;
font-size: 14px;
line-height: 16px;
}
Mit dem Suffix im Module (my-galleries-content) funktioniert das im Bereich "Elements" bei "Content CSS".
Herzlichen Dank.
Pedro de Maciot
peter-wiegner.de
Last Edit:3 months 4 weeks ago
by Pedro de Maciot
Last edit: 3 months 4 weeks ago by WM-Loose.
The topic has been locked.