reusable logos snippets

liquet/css/logos.css

@@ -0,0 +1,14 @@
+#logos {
+    margin: 1.5em 0 0 0;
+}
+
+#logos img {
+    height: 2em;
+    width: 2em;
+    margin: 0 .5em;
+    transition: var(--animation);
+}
+
+#logos img:hover {
+    transform: scale(1.15);
+}

liquet/index.php

@@ -1,39 +1,29 @@
-<?php get_header();
+<?php
+include_once( 'logos.php' );
+include_once( 'tags.php' );
 
-$tags = get_tags(['orderby' => 'count', 'order' => 'desc']);
+get_header();
-//$tags = array_map(function ($tag) {
+
-//    return [
+$tags = get_tags( [ 'orderby' => 'count', 'order' => 'desc' ] );
-//        'name' => $tag->name,
-//        'slug' => $tag->slug,
-//        'count' => $tag->count,
-//    ];
-//}, $tags)
 ?>
     <div id="home">
         <div class="flex container vertical middle" id="list-header">
             <div id="header">
-                <a href="<?= get_bloginfo('wpurl'); ?>">
+                <a href="<?= get_bloginfo( 'wpurl' ); ?>">
-                    <h1><?= get_bloginfo('name'); ?></h1>
+                    <h1><?= get_bloginfo( 'name' ); ?></h1>
-                    <h3><?= get_bloginfo('description'); ?></h3>
+                    <h3><?= get_bloginfo( 'description' ); ?></h3>
                 </a>
+				<?php render_links(); ?>
             </div>
         </div>
         <div class="flex container horizontal center" id="list-container">
             <div id="list">
-                <?php if ($tags) { ?>
+				<?php render_all_tags(); ?>
-                    <!--            <div class="flex container horizontal center" id="list-container">-->
-                    <div class="tags">
-                        <?php foreach ($tags as $tag) { ?>
-                            <a class="tag" href="<?= get_tag_link($tag->term_id); ?>"><?= $tag->name; ?> <b><?= $tag->count ?></b></a>
-                        <?php } ?>
-                    </div>
-                    <!--            </div>-->
-                <?php } ?>
                 <br/><br/><br/>
 				<?php
-                while (have_posts()) {
+				while ( have_posts() ) {
 					the_post();
-                    get_template_part('post-preview', get_post_format());
+					get_template_part( 'post-preview', get_post_format() );
 				}
 				?>
             </div>

liquet/logos.php

@@ -0,0 +1,19 @@
+<?php
+
+$links = [ 'medium', 'github', 'twitter', 'website' ];
+
+function render_links() {
+	global $links;
+	?>
+    <div class="flex container horizontal middle center" id="logos"><?php
+	foreach ( $links as $link ) {
+		$saved = get_option( $link . '_url' );
+		if ( $saved ) { ?>
+            <a href="<?= $saved ?>" target="_blank">
+                <img src="<?= get_template_directory_uri() . '/vendor/logos/' . $link . '.png' ?>"
+                     alt="<?= $link; ?>"/>
+            </a>
+		<?php }
+	}
+	?></div><?php
+}

liquet/singular.php

@@ -1,10 +1,12 @@
 <?php
 
+include_once( 'loop-utils.php' );
+include_once( 'logos.php' );
+include_once( 'tags.php' );
+
 get_header();
 the_post();
 
-include_once( 'loop-utils.php' );
-
 $dates = getDates();
 
 ?>
@@ -43,7 +45,9 @@ $dates = getDates();
                         <br><br>
 						<?php the_content(); ?>
                         <br>
-						<?php get_template_part( 'tags-list', get_post_format() ); ?>
+						<?php render_current_tags(); ?>
+                        <hr>
+						<?php render_links(); ?>
                     </div>
                 </div>