Kalender einbinden

Ich habe mal Deinen Kalender probehalber in eine meiner Testsites eingebaut. Das sieht dann so aus:

Der Hintergrund stammt von meinem Template. Hier das CSS für das Simple iCal Block Modul:

.module.kalender h3 {
    font-family: Lato, Arial, Verdana, sans-serif;
    color: #12471e;
    font-size: 1.2rem;
    line-height: 1.6em;
    text-transform: uppercase;
	text-align: center;
}
.kalender .simple_ical_block {
	margin-bottom: -15px;
}
.kalender .list-group-item {
  border: none;
  background-color: unset;
}
.kalender .simple_ical_block .ical_summary, .kalender .simple_ical_block .ical_details {
	font-size: 18px;
    color: rgb(18, 71, 30);
    padding-left: 30px;
    font-weight: normal;
}
.kalender .simple_ical_block .ical_details {
	text-decoration: underline;
}
.kalender .simple_ical_block .list-group-item {
	font-size: 18px;
	color: rgb(130, 73, 19);
	font-weight: bold;
}

Als "CSS-Klasse Modul" hatte ich "kalender" eingetragen. Schriftgrößen, Schriftarten, Farben usw. kannst Du nach Belieben setzen.

Beachte auch meine Einstellungen aus dem Post #48.

@ Rolf Dautrich

sorry, dass ich hier kurz einsteige, aber gibt es mit CSS die Möglichkeit einer Umrandung?

Zitat von friren

... gibt es mit CSS die Möglichkeit einer Umrandung?

z.B. so:

.module.kalender .module_surround {
	border: 3px solid red;
}

Ist aber Template-spezifisch. Du musst halt dem Modul einen Rahmen geben.

Die Testseite sieht gut aus, aber ich hatte mehr an eine solche Umrahmung gedacht (Anhang)

Das funktioniert hiermit nicht. Template ist Cassiopeia

.module.kalender .module_surround { border: 3px solid red; }

Mit Cassiopeia kannst Du mal das versuchen:

.bottom-a.card.kalender {
	border: 3px solid red;
	border-radius: 30px;
}

Die Annahme hier ist, dass das Modul in der Position "bottom-a" angezeigt wird. Sonst entsprechend ändern. Die Klassen findest Du -wie immer- mit den Entwicklertools Deines Browsers.