Title: CSS Klassen
Last modified: July 22, 2024

---

# CSS Klassen

 *  Resolved [guenniun](https://wordpress.org/support/users/guenniun/)
 * (@guenniun)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/css-klassen/)
 * Hallo zusammen,
 * vorweg möchte ich Yannik für dieses Plugin danken, es erleichtert vieles und 
   ist auch simpel in der Bedienung – eigentlich. 🙂
 * Ich versuche gerade die CSS Klassen für das Plugin an meine Bedürfnisse anzupassen.
   Dabei habe ich den Inhalt aus der rh4a-public.css mir angeguckt und die manche
   Klassen wiedergefunden, die ich individualisieren möchte… aber eben nicht alle.
   Leider finde ich auch zu dem Plugin keine Dokumentation, die mir die Klassen 
   definiert und vermittelt.
 * [@yannik](https://wordpress.org/support/users/yannik/), könntest du bitte sowas
   liefern?
 * LG
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcss-klassen%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Author [Yannick Zipf](https://wordpress.org/support/users/yannickzipf/)
 * (@yannickzipf)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/css-klassen/#post-17908395)
 * Hallo [@guenniun](https://wordpress.org/support/users/guenniun/) ,
 * auf die Schnelle kann ich folgendes liefern.
 * Nächste Spiele:
    - .rh4a-next-match-wrapper (div): Wrapper, in dem **alle** nächsten Spiele enthalten
      sind
    - .rh4a-next-match (div): enthält **ein** nächstes Spiel
    - .rh4a-next-match-class (span): Liga des nächsten Spiels
    - .rh4a-next-match-datetime (span): Datum und Uhrzeit des nächsten Spiels
    - .rh4a-next-match-clubs (span): Spielpaarung des nächsten Spiels
    - .rh4a-next-match-location (span): Halle und Adresse des nächsten Spiels
 * Tabelle:
    - .rh4a-standing (table): Tabelle (im wahrsten Sinne des Wortes)
    - .rh4a-own-team-row (tr): Zeile, die das eigene Team enthält
 * Spielplan:
    - .rh4a-timetable (table): Spielplan
    - .rh4a-own-team-row (tr): Zeile, die das eigene Team enthält
    - .rh4a-own-team-span (span): Name des eigenen Teams
    - .rh4a-location-wrapper (div): Wrapper für die Halle und Adresse des Spiels(
      enthält das Icon und das Popover)
    - .rh4a-location-icon (span): Location-Icon
    - .rh4a-location-popover (div): Wrapper für Popover
    - .rh4a-location-name (span): Name der Halle
 * Ich hoffe, das hilft.
 * Viele Grüße
   Yannick
 *  Thread Starter [guenniun](https://wordpress.org/support/users/guenniun/)
 * (@guenniun)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/css-klassen/#post-17910860)
 * Hallo Yannick,
 * vielen Dank für die schnelle Reaktion – mega!
 * Ich habe bei euch auf der Seite gesehen, wie du das mit dem hovern bei deinen
   Posts gelöst hast. Ich finde das absolut schick! hast du einen Tipp für mich,
   wie du das gemacht hast?! 🙂
 * LG
 *  Plugin Author [Yannick Zipf](https://wordpress.org/support/users/yannickzipf/)
 * (@yannickzipf)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/css-klassen/#post-17910978)
 * Hallo,
 * die Idee habe ich auch von einer anderen Website. Genutzt habe ich die Bootstrap
   Cards ([https://getbootstrap.com/docs/5.3/components/card/](https://getbootstrap.com/docs/5.3/components/card/))
 *     ```wp-block-code
       <article <?php post_class($post_css_classes." mb-2"); ?> id="post-<?php the_ID(); ?>">	<a href="<?php echo get_permalink(); ?>" class="card shadow-lg">		<div class="card-front">			<?php if(has_post_thumbnail()) { ?>		  		<figure class="mb-0">					<div class="card-img" style="background-image:url(<?php the_post_thumbnail_url("medium_large"); ?>);"></div>				</figure>		  	<?php } ?>			<div class="card-body">				<small class="text-uppercase"><?php echo get_the_date(); ?></small>				<?php 					the_title( '<h3 class="card-title">', '</h3>' ); 					if(!has_post_thumbnail()) {						echo get_the_content('');					}				?>			</div>			<span class="sr-only sr-only-focusable">Weiterlesen</span>		</div>		<div class="card-back">			<div class="card-body">				<?php the_title( '<h3>', '</h3>' ); ?>				<?php echo get_the_content(''); ?>			</div>			<div class="card-footer">				<i class="fas fa-arrow-right"></i>			</div>		</div>   	</a></article>
       ```
   
 * Folgendes CSS:
 *     ```wp-block-code
       .card-back {position:absolute;top:0;width:100%;height:100%;transform:translate(-100.5%,0);transition:transform 0.4s ease-in-out;color:$light;}article .card-back {background:$dark;}.card-back:hover,.card-front:hover + .card-back {transform:translate(0,0);}.card-front {flex-grow:1;background:$light;color:$dark;figure {width:100%;padding-bottom:67%;overflow:hidden;position:relative;div.card-img {width:100%;height:100%;position:absolute;left:0;top:0;background-repeat: no-repeat;background-size:cover;background-position: center center;}}}.card {overflow:hidden;height:100%;color:$body-color;.card-title {margin-bottom:0;}}.card:hover {text-decoration: none;color:$body-color;}.card-footer {background-color:transparent;position:absolute;bottom:0;i {font-size:25pt;}}
       ```
   
 * Mit ein bisschen Reverse Engineering kriegst du das bestimmt zum Laufen.
 * Viele Grüße
   Yannick

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘CSS Klassen’ is closed to new replies.

 * ![](https://ps.w.org/results-for-handball4all/assets/icon.svg?rev=2697326)
 * [Results for Handball4All](https://wordpress.org/plugins/results-for-handball4all/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/results-for-handball4all/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/results-for-handball4all/)
 * [Active Topics](https://wordpress.org/support/plugin/results-for-handball4all/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/results-for-handball4all/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/results-for-handball4all/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)

 * 3 replies
 * 2 participants
 * Last reply from: [Yannick Zipf](https://wordpress.org/support/users/yannickzipf/)
 * Last activity: [1 year, 10 months ago](https://wordpress.org/support/topic/css-klassen/#post-17910978)
 * Status: resolved