thusfar

netherphp · Oct 3, 2024 · 42be8e0 · 42be8e0
1 parent b74e129
commit 42be8e0
Show file tree

Hide file tree

Showing 4 changed files with 119 additions and 114 deletions.
diff --git a/app/www/themes/default/area/blog/view.phtml b/app/www/themes/default/area/blog/view.phtml
@@ -26,17 +26,22 @@ use Nether\User;
  * @var Database\ResultSet             $Profiles (use $Related)
  */
 
+$PostTags = $Post->GetTags();
+$PostURL = $App->RewriteURL($Post->GetURL(), $PostTags);
+$PostDateFancy = Common\Date::FromDateString($Post->DateCreated)->Get(Common\Values::DateFormatFancyDate);
+
 ////////////////////////////////////////////////////////////////////////////////
 ////////////////////////////////////////////////////////////////////////////////
 
 // these should be set in then pulled from the blog settings.
 
 $CSSVars = new Common\Datastore([
-	'--atl-blog-bg0'   => 'var(--theme-grey-lt)',   // graphic wash tone
-	'--atl-blog-bg1'   => 'var(--theme-orange)',    // titlebar bg colour
-	'--atl-blog-bg2'   => 'var(--theme-grey-lt)',   // titlebar bg colour2
-	'--atl-blog-fg1'   => 'var(--theme-black)',     // titlebar text colour
-	'--atl-blog-fgh4'  => 'var(--theme-orange-alt)' // h4 text colour
+	'--atl-blog-bg0'   => 'var(--theme-grey-lt)',    // graphic wash tone
+	'--atl-blog-bg1'   => 'var(--theme-orange)',     // titlebar bg colour
+	'--atl-blog-bg2'   => 'var(--theme-grey-lt)',    // titlebar bg colour2
+	'--atl-blog-fg1'   => 'var(--theme-black)',      // titlebar text colour
+	'--atl-blog-fg2'   => 'var(--theme-orange-alt)', // accent text colours
+	'--atl-blog-fgh4'  => 'var(--theme-orange-alt)'  // h4 text colour
 ]);
 
 $CSSVars->RemapKeyValue(fn(string $K, string $V)=> "{$K}: {$V};");
@@ -46,7 +51,7 @@ $CSSVars->RemapKeyValue(fn(string $K, string $V)=> "{$K}: {$V};");
 
 ?>
 
-<hr id="_deleteme_PostInfo" class="d-none"
+<hr id="PostInfo" class="d-none"
 	data-blog-id="<?php $Util->Print($Post->Blog->ID) ?>"
 	data-blog-uuid="<?php $Util->Print($Post->Blog->UUID) ?>"
 	data-post-id="<?php $Util->Print($Post->ID) ?>"
@@ -60,86 +65,86 @@ $CSSVars->RemapKeyValue(fn(string $K, string $V)=> "{$K}: {$V};");
 		<?php $Surface->Area('blog/widgets/blog-header', $__SCOPE) ?>
 	</div>
 
-	<!-- POST HEADER -->
-	<div class="container mb-4">
+	<!-- POST HEADING -->
+	<div class="container atl-blog-post-header mb-4">
 		<div class="row">
 
 			<!-- POST TITLE -->
 			<div class="col">
-				<div class="atl-blog-dateline">
-					<?php $Util->Print(Common\Date::FromDateString($Post->DateCreated)->Get(Common\Values::DateFormatFancyDate)) ?>
+				<div class="atl-blog-post-dateline">
+					<?php $Util->Print($PostDateFancy) ?>
 				</div>
-				<div class="atl-blog-title">
-					<h3><a href="<?php $Printer($App->RewriteURL($Post->GetURL(), $Post->GetTags())) ?>" class="border-0"><?php $Printer($Post->Title) ?></a></h3>
+				<div class="atl-blog-post-title">
+					<h3><a href="<?php $Util->Print($PostURL) ?>" class="border-0"><?php $Util->Print($Post->Title) ?></a></h3>
 				</div>
-				<div class="atl-blog-tags">
-					<?php $Surface->Area('widgets/tag-buttons', [ 'Tags'=> $Post->GetTags() ]) ?>
+				<?php if($PostTags->Count()): ?>
+				<div class="atl-blog-post-tags">
+					<?php $Surface->Area('widgets/tag-buttons', [ 'Tags'=> $PostTags ]) ?>
 				</div>
+				<?php endif; ?>
 			</div>
 
 			<?php if($Route->IsUserAdmin()): ?>
 			<div class="col-auto">
-				<?php echo Atlantis\UI\Dropdown::FromSurfaceWith($Surface, [
-					'Menu' => $AdminMenu
-				]) ?>
+				<?php echo Atlantis\UI\Dropdown::FromSurfaceWith($Surface, [ 'Menu'=> $AdminMenu ]) ?>
 			</div>
 			<?php endif; ?>
 
 		</div>
 	</div>
 
-	<div class="pt-0 pb-4">
-		<div class="container atl-blog-post-container">
+	<!-- POST BODY -->
+	<div class="container atl-blog-post-container">
 
-			<?php if(!$Post->Enabled): ?>
-			<div class="alert alert-primary text-center p-2 mb-4">
-				This post is in DRAFT mode.
-			</div>
-			<?php endif; ?>
+		<?php if(!$Post->Enabled): ?>
+		<div class="alert alert-info text-center p-2 mb-4">
+			This post is in DRAFT mode.
+		</div>
+		<?php endif; ?>
 
-			<?php if($Post->HasPostImage()): ?>
-			<div class="row justify-content-center mb-4">
-				<div class="col-12">
-					<img class="rounded" src="<?php $Util->Print($Post->GetPostImageURL('lg')) ?>" alt="<?php $Util->Print($Post->Title) ?>" style="width:100%;" />
-				</div>
+		<?php if($Post->HasPostImage()): ?>
+		<div class="row justify-content-center mb-4">
+			<div class="col-12">
+				<img class="rounded" src="<?php $Util->Print($Post->GetPostImageURL('lg')) ?>" alt="<?php $Util->Print($Post->Title) ?>" style="width:100%;" />
 			</div>
-			<?php endif; ?>
+		</div>
+		<?php endif; ?>
 
-			<?php
-			match($Post->Editor) {
-				'editorjs'
-				=> $Surface->Area('blog/views/editorjs', $__SCOPE),
+		<?php
+		match($Post->Editor) {
+			'editorjs'
+			=> $Surface->Area('blog/views/editorjs', $__SCOPE),
 
-				'link'
-				=> $Surface->Area('blog/views/link', $__SCOPE),
+			'link'
+			=> $Surface->Area('blog/views/link', $__SCOPE),
 
-				default
-				=> $Surface->Area('blog/views/html', $__SCOPE)
-			};
-			?>
+			default
+			=> $Surface->Area('blog/views/html', $__SCOPE)
+		};
+		?>
 
-			<?php if(isset($Photos) && $Photos->Total): ?>
-			<!-- PHOTOS -->
-			<div class="mb-8">
-				<h4 class="text-uppercase mb-0">Photos (<?php $Util->Print($Photos->Total) ?>)</h4>
-				<hr class="mt-1 mb-3" />
+		<?php if(isset($Photos) && $Photos->Total): ?>
+		<!-- PHOTOS -->
+		<div class="mb-8">
+			<h4 class="text-uppercase mb-0">Photos (<?php $Util->Print($Photos->Total) ?>)</h4>
+			<hr class="mt-1 mb-3" />
 
-				<?php echo Atlantis\UI\Gallery::FromDataset($Surface, $Photos) ?>
-			</div>
-			<?php endif; ?>
+			<?php echo Atlantis\UI\Gallery::FromDataset($Surface, $Photos) ?>
+		</div>
+		<?php endif; ?>
 
-			<?php if(isset($Videos) && $Videos->Total): ?>
-			<!-- VIDEOS -->
-			<div class="mb-8">
-				<h4 class="text-uppercase mb-0">Videos (<?php $Util->Print($Videos->Total) ?>)</h4>
-				<hr class="mt-1 mb-3" />
-
-				<?php echo Atlantis\UI\VideoList::FromDataset($Surface, $Videos, ParentUUID: $Post->UUID) ?>
-			</div>
-			<?php endif; ?>
+		<?php if(isset($Videos) && $Videos->Total): ?>
+		<!-- VIDEOS -->
+		<div class="mb-8">
+			<h4 class="text-uppercase mb-0">Videos (<?php $Util->Print($Videos->Total) ?>)</h4>
+			<hr class="mt-1 mb-3" />
 
+			<?php echo Atlantis\UI\VideoList::FromDataset($Surface, $Videos, ParentUUID: $Post->UUID) ?>
 		</div>
+		<?php endif; ?>
+
 	</div>
+
 </div>
 
 <?php if($BlogUser && $BlogUser->CanEdit()): ?>

diff --git a/app/www/themes/default/css/src/elements/blog.css b/app/www/themes/default/css/src/elements/blog.css
@@ -4,11 +4,11 @@
 	--atl-blog-bg0: var(--theme-black);
 
 	/* blog header title bar */
-	--atl-blog-bg1: var(--theme-black);
 	--atl-blog-fg1: var(--theme-white);
-
-	/* blog header title bar */
+	--atl-blog-bg1: var(--theme-black);
 	--atl-blog-bg2: var(--theme-white);
+
+	/* text accents like post date */
 	--atl-blog-fg2: var(--theme-black);
 
 	--atl-blog-fgh1: var(--theme-white);
@@ -92,6 +92,8 @@
 
 /***/
 
+/* make hr's inside of blog posts to be fancy */
+
 .atl-blog-post-container hr {
 	background: linear-gradient(135deg, var(--atl-blog-bg1) 0%, var(--atl-blog-bg2) 100%);
 	border: 0px;
@@ -100,16 +102,33 @@
 	opacity: 1.0;
 }
 
+.atl-blog-post-container h3 hr,
+.atl-blog-post-container h4 hr,
+.atl-blog-post-container h5 hr,
+.atl-blog-post-container h6 hr {
+	display: none;
+}
+
+/* allow headings to be themed wihin posts */
+
 .atl-blog-post-container h1 { color: var(--atl-blog-fgh1); }
 .atl-blog-post-container h2 { color: var(--atl-blog-fgh2); }
 .atl-blog-post-container h3 { color: var(--atl-blog-fgh3); }
 .atl-blog-post-container h4 { color: var(--atl-blog-fgh4); }
 .atl-blog-post-container h5 { color: var(--atl-blog-fgh5); }
 .atl-blog-post-container h6 { color: var(--atl-blog-fgh6); }
 
-.atl-blog-post-container h3 hr,
-.atl-blog-post-container h4 hr,
-.atl-blog-post-container h5 hr,
-.atl-blog-post-container h6 hr {
-	display: none;
+.atl-blog-post-dateline {
+	color: var(--atl-blog-fg2);
+	font-size: 0.8em;
+	font-weight: bold;
+	text-transform: uppercase;
+}
+
+.atl-blog-post-title {
+	margin-bottom: 0.5rem;
+}
+
+.atl-blog-post-tags .btn {
+	border-radius: 4px;
 }
diff --git a/app/www/themes/default/css/src/ext-blog.css b/app/www/themes/default/css/src/ext-blog.css
@@ -1,14 +1,6 @@
-.atl-blog-dateline {
-	font-size: 0.8em;
-	font-weight: bold;
-	opacity: 0.5;
-	margin-bottom: 0.5rem;
-	text-transform: uppercase;
-}
 
-.atl-blog-title {
-	margin-bottom: 0.5rem;
-}
+
+
 
 .atl-blog-img {
 	text-align: center;
@@ -34,13 +26,4 @@
 	border: 0px !important;
 }
 
-.atl-blog-tags .btn {
-	border-radius: 3px;
-}
-
-
-h2.atl-editorjs-header hr {
-
-}
-
 
diff --git a/app/www/themes/default/css/styles.css b/app/www/themes/default/css/styles.css
@@ -1,5 +1,5 @@
 /*//
-@date 2024-10-03 20:28:31 UTC
+@date 2024-10-03 20:37:58 UTC
 @files 43 [
     "src\/imports.css",
     "src\/main.css",
@@ -2562,18 +2562,6 @@ code.cli {
 /*//////////////////////////////////////////////////////////////////////////////
 //// src/ext-blog.css ////////////////////////////////////////////////////////*/
 
-.atl-blog-dateline {
-	font-size: 0.8em;
-	font-weight: bold;
-	opacity: 0.5;
-	margin-bottom: 0.5rem;
-	text-transform: uppercase;
-}
-
-.atl-blog-title {
-	margin-bottom: 0.5rem;
-}
-
 .atl-blog-img {
 	text-align: center;
 	margin-bottom: 2rem;
@@ -2598,15 +2586,6 @@ code.cli {
 	border: 0px !important;
 }
 
-.atl-blog-tags .btn {
-	border-radius: 3px;
-}
-
-
-h2.atl-editorjs-header hr {
-
-}
-
 /*//////////////////////////////////////////////////////////////////////////////
 //// src/fx-text.css /////////////////////////////////////////////////////////*/
 
@@ -2951,11 +2930,11 @@ is being used and then prefixing all these with that theme name, if i recall. */
 	--atl-blog-bg0: var(--theme-black);
 
 	/* blog header title bar */
-	--atl-blog-bg1: var(--theme-black);
 	--atl-blog-fg1: var(--theme-white);
-
-	/* blog header title bar */
+	--atl-blog-bg1: var(--theme-black);
 	--atl-blog-bg2: var(--theme-white);
+
+	/* text accents like post date */
 	--atl-blog-fg2: var(--theme-black);
 
 	--atl-blog-fgh1: var(--theme-white);
@@ -3039,6 +3018,8 @@ is being used and then prefixing all these with that theme name, if i recall. */
 
 /***/
 
+/* make hr's inside of blog posts to be fancy */
+
 .atl-blog-post-container hr {
 	background: linear-gradient(135deg, var(--atl-blog-bg1) 0%, var(--atl-blog-bg2) 100%);
 	border: 0px;
@@ -3047,18 +3028,35 @@ is being used and then prefixing all these with that theme name, if i recall. */
 	opacity: 1.0;
 }
 
+.atl-blog-post-container h3 hr,
+.atl-blog-post-container h4 hr,
+.atl-blog-post-container h5 hr,
+.atl-blog-post-container h6 hr {
+	display: none;
+}
+
+/* allow headings to be themed wihin posts */
+
 .atl-blog-post-container h1 { color: var(--atl-blog-fgh1); }
 .atl-blog-post-container h2 { color: var(--atl-blog-fgh2); }
 .atl-blog-post-container h3 { color: var(--atl-blog-fgh3); }
 .atl-blog-post-container h4 { color: var(--atl-blog-fgh4); }
 .atl-blog-post-container h5 { color: var(--atl-blog-fgh5); }
 .atl-blog-post-container h6 { color: var(--atl-blog-fgh6); }
 
-.atl-blog-post-container h3 hr,
-.atl-blog-post-container h4 hr,
-.atl-blog-post-container h5 hr,
-.atl-blog-post-container h6 hr {
-	display: none;
+.atl-blog-post-dateline {
+	color: var(--atl-blog-fg2);
+	font-size: 0.8em;
+	font-weight: bold;
+	text-transform: uppercase;
+}
+
+.atl-blog-post-title {
+	margin-bottom: 0.5rem;
+}
+
+.atl-blog-post-tags .btn {
+	border-radius: 4px;
 }
 
 /*//////////////////////////////////////////////////////////////////////////////