Browse Source

desk: two-column layout + search field/button height fix

- Top section is now three equal columns: Now spans the first two (col-lg-8)
  with Posts + Today I Learned beneath it (col-md-6 each), and the meta sidebar
  (Edited / Bookmarks / Year) as the third (col-lg-4, no offset so the edges are
  symmetric). Removed the left divider on the sidebar.
- Dropped the Projects, Topics and Tags sections; halved the Posts and TIL pulls
  (35 -> 18) so the left column height roughly matches the sidebar.
- Search actions moved to the left with more top spacing.
- Fixed the search submit button towering over the field: the field inherited a
  20px bottom margin from .entry-content input which stretched the input-group
  (and the button) to 58px โ€” zeroed it so both are 38px; button flex-centers its
  icon. (pull_til_tags()/dw_til_tags_html() added for a TIL tag cloud, currently
  unused after the Tags section was dropped.)
- Rebuilt v4-style.min.css.
windhamdavid 1 week ago
parent
commit
3d4ae04317
4 changed files with 46 additions and 44 deletions
  1. 16 0
      inc/utils.php
  2. 23 44
      page-desk.php
  3. 7 0
      style.css
  4. 0 0
      v4-style.min.css

+ 16 - 0
inc/utils.php

@@ -110,6 +110,22 @@ function pull_til_all() {
 	    echo $li;
 	    echo $li;
 	}
 	}
 }
 }
+// TIL site tag cloud (Docusaurus, /til/posts/tags/) โ€” rendered inline like the WP
+// tags so both can share one block. Local file when present; links point to the TIL site.
+function dw_til_tags_html() {
+	require_once('lib/html_dom.php');
+	$local = ABSPATH . 'til/posts/tags/index.html';
+	return file_exists($local) ? file_get_html($local) : file_get_html('https://davidawindham.com/til/posts/tags/');
+}
+function pull_til_tags() {
+	$html = dw_til_tags_html();
+	if (!$html) return;
+	foreach ($html->find('a[rel=tag]') as $a) {
+		$name = trim(preg_replace('/<span.*$/s', '', $a->innertext)); // drop the trailing count <span>
+		if ($name === '') continue;
+		echo '<a href="' . esc_url($a->href) . '">' . esc_html($name) . '</a>, ';
+	}
+}
 function bookmarks() {
 function bookmarks() {
 	require_once('lib/html_dom.php');
 	require_once('lib/html_dom.php');
 	$url = 'https://davidawindham.com/bookmarks/';
 	$url = 'https://davidawindham.com/bookmarks/';

+ 23 - 44
page-desk.php

@@ -13,41 +13,32 @@ get_header(); ?>
 		</div>
 		</div>
 		<div class="desk" role="main">
 		<div class="desk" role="main">
 			<div class="entry-content">
 			<div class="entry-content">
-				<div class="row mt-3">
-					<div class="col-lg-7">
-						<h4 class="fw-bold mt-4 mb-1">Doing</h4>
+				<div class="row">
+					<div class="col-lg-8">
+						<h4 class="fw-bold mb-1">Now</h4>
 						<ul class="now-doing" style="margin:0">
 						<ul class="now-doing" style="margin:0">
 							<?php now(); ?>
 							<?php now(); ?>
 						</ul>
 						</ul>
+						<div class="row mt-3">
+							<div class="col-md-6 studio-tools">
+								<h4 class="fw-bold">Posts</h4>
+								<ul>
+									<?php $recentposts = get_posts('numberposts=18'); foreach ($recentposts as $post) : setup_postdata($post); ?>
+									<li style="color:#777"><?php echo get_the_date('y/m/d'); ?> - <a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
+									<?php endforeach; ?>
+								</ul>
+							</div>
+							<div class="col-md-6 studio-tools d-lg-block">
+								<h4 class="fw-bold">Today I Learned</h4>
+								<ul>
+									<?php pull_til(18); ?>
+								</ul>
+							</div>
+						</div>
 					</div>
 					</div>
-					<div class="col-lg-4 offset-md-1">
-						<h4 class="fw-bold mt-2">Projects</h4>
-						<ul style="margin:0">
-							<?php $recentposts = get_posts(array( 'category_name' => 'studio', 'numberposts' => 8, 'offset' => 0 ) ); foreach ($recentposts as $post) : setup_postdata($post); ?>
-							<li style="color:#777"><?php echo get_the_date('y/m/d'); ?> - <a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
-							<?php endforeach; ?>
-						</ul>
-					</div>
-				</div>
-				<!-- Desk index row: WP-side archive/topics/tags + halved TIL/Recent Posts/Bookmarks pulls -->
-				<div class="row mt-3">
-					<div class="col-md-4 studio-tools">
-						<h4 class="fw-bold">Recent Posts</h4>
-						<ul>
-							<?php $recentposts = get_posts('numberposts=35'); foreach ($recentposts as $post) : setup_postdata($post); ?>
-							<li style="color:#777"><?php echo get_the_date('y/m/d'); ?> - <a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
-							<?php endforeach; ?>
-						</ul>
-					</div>
-					<div class="col-md-4 studio-tools d-lg-block">
-						<h4 class="fw-bold">Today I Learned</h4>
-						<ul>
-							<?php pull_til(35); ?>
-						</ul>
-					</div>
-					<div class="col-md-4 studio-tools desk-meta">
+					<div class="col-lg-4 studio-tools desk-meta">
 						<?php $sticky = get_option('sticky_posts'); if( !empty($sticky) ){ ?>
 						<?php $sticky = get_option('sticky_posts'); if( !empty($sticky) ){ ?>
-						<h4 class="fw-bold">Recently ( Edited )</h4>
+						<h4 class="fw-bold">Edited</h4>
 						<ul>
 						<ul>
 							<?php $args = array('post_type' => 'post', 'orderby' => 'modified', 'posts_per_page' => 5,'post__in' => $sticky);?>
 							<?php $args = array('post_type' => 'post', 'orderby' => 'modified', 'posts_per_page' => 5,'post__in' => $sticky);?>
 							<?php $stickyposts = get_posts($args); foreach ($stickyposts as $post) : setup_postdata($post); ?>
 							<?php $stickyposts = get_posts($args); foreach ($stickyposts as $post) : setup_postdata($post); ?>
@@ -55,7 +46,7 @@ get_header(); ?>
 							<?php endforeach; ?>
 							<?php endforeach; ?>
 						</ul>
 						</ul>
 						<?php } ?>
 						<?php } ?>
-						<h4 class="fw-bold">Recent Bookmarks</h4>
+						<h4 class="fw-bold mt-4">Bookmarks</h4>
 						<ul>
 						<ul>
 							<?php bookmarks_pull(14); ?>
 							<?php bookmarks_pull(14); ?>
 						</ul>
 						</ul>
@@ -63,18 +54,6 @@ get_header(); ?>
 						<ul class="tags">
 						<ul class="tags">
 							<?php wp_get_archives( array( 'type' => 'yearly', 'format' => 'custom', 'before' => '', 'after' => ',&nbsp;' ) ); ?>
 							<?php wp_get_archives( array( 'type' => 'yearly', 'format' => 'custom', 'before' => '', 'after' => ',&nbsp;' ) ); ?>
 						</ul>
 						</ul>
-						<h4 class="fw-bold">Topics</h4>
-						<ul class="tags">
-							<?php $cats = get_categories( array( 'orderby' => 'name', 'exclude' => array( 1, 7, 44 ) ) ); foreach ( $cats as $cat ) : ?>
-							<a href="<?php echo esc_url( get_category_link( $cat->term_id ) ); ?>" title="<?php echo esc_attr( $cat->name ); ?>"><?php echo esc_html( $cat->name ); ?></a>,
-							<?php endforeach; ?>
-						</ul>
-						<h4 class="fw-bold">Tags</h4>
-						<ul class="tags">
-							<?php $tags = get_tags(); if ( $tags ) : foreach ( $tags as $tag ) : ?>
-							<a href="<?php echo esc_url( get_tag_link( $tag->term_id ) ); ?>" title="<?php echo esc_attr( $tag->name ); ?>"><?php echo esc_html( $tag->name ); ?></a>,
-							<?php endforeach; endif; ?>
-						</ul>
 					</div>
 					</div>
 				</div>
 				</div>
 				<div class="row mt-3 pb-2">
 				<div class="row mt-3 pb-2">
@@ -137,7 +116,7 @@ get_header(); ?>
 						</ul>
 						</ul>
 					</div>
 					</div>
 				</div>
 				</div>
-				<div class="d-flex desk-actions mt-3" style="width:100%;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:.5rem">
+				<div class="d-flex desk-actions" style="width:100%;margin-top:3rem;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:.5rem">
 					<div style="flex:0 0 280px"><?php get_search_form(); ?></div>
 					<div style="flex:0 0 280px"><?php get_search_form(); ?></div>
 					<a href="/desk/posts/" type="button" class="btn btn-dark">The Scroll</a>
 					<a href="/desk/posts/" type="button" class="btn btn-dark">The Scroll</a>
 					<a href="/archive/" type="button" class="btn btn-dark">๐Ÿ‘‰๐Ÿผ The Archive</a>
 					<a href="/archive/" type="button" class="btn btn-dark">๐Ÿ‘‰๐Ÿผ The Archive</a>

+ 7 - 0
style.css

@@ -999,6 +999,9 @@ body.desk .entry-content {
 /* Desk third column (Recently Edited / Bookmarks / Year / Topics / Tags): a clear
 /* Desk third column (Recently Edited / Bookmarks / Year / Topics / Tags): a clear
    line of space between each section. Year/Topics/Tags render inline (their links are
    line of space between each section. Year/Topics/Tags render inline (their links are
    direct children of ul.tags), at the same font size as the rest of the page. */
    direct children of ul.tags), at the same font size as the rest of the page. */
+.desk-meta {
+  border-left: 0; /* right-hand sidebar โ€” no divider on its left edge */
+}
 .desk-meta > ul {
 .desk-meta > ul {
   margin-bottom: 1.25rem;
   margin-bottom: 1.25rem;
 }
 }
@@ -1015,10 +1018,14 @@ body.desk .entry-content {
 	flex: 1 1 auto;
 	flex: 1 1 auto;
 	width: 1%;
 	width: 1%;
 	min-width: 0;
 	min-width: 0;
+	margin: 0; /* cancel the .entry-content input 20px bottom margin that stretched the input-group (and the button) */
 	border-top-right-radius: 0;
 	border-top-right-radius: 0;
 	border-bottom-right-radius: 0;
 	border-bottom-right-radius: 0;
 }
 }
 .desk-actions .input-group .btn {
 .desk-actions .input-group .btn {
+	display: flex;
+	align-items: center;
+	justify-content: center;
 	border-top-left-radius: 0;
 	border-top-left-radius: 0;
 	border-bottom-left-radius: 0;
 	border-bottom-left-radius: 0;
 }
 }

File diff suppressed because it is too large
+ 0 - 0
v4-style.min.css


Some files were not shown because too many files changed in this diff