updating naming conventions

_layouts/default.html

@@ -24,6 +24,8 @@
 <link rel="stylesheet" href="{{site.baseurl}}/css/hp.css">
 <link rel="stylesheet" href="{{site.baseurl}}/css/matter.css">
 <link rel="stylesheet" href="{{site.baseurl}}/css/fonts/fonts.css">
+<link rel="stylesheet" href="https://use.typekit.net/cbr6gcc.css">
+
 
 
 <!-- ++++++++++ SIDE-BAR NAV STATES ++++++++++ -->

_layouts/post.html

@@ -14,10 +14,17 @@
 		</div>
 -->
 		<header>
+			{% if page.entity %}
 			<h3>
 				{{page.entity}} / {{page.category}}
 			</h3>
-
+			{% else %}
+			<h3>
+				{{page.category}}
+			</h3>
+				{% endif %}
+
+
 			<time itemprop="dateCreated" datetime="{{page.date}}">
 				{{ page.loc }} + {{page.type}}
 			</time> 

css/styles.css

@@ -71,9 +71,82 @@ body {
 		padding: 20px 20px 0px 20px;
 	}
 
+
+
+article img {
+    width: 100%;
+    background-size: cover;
+    border-radius: 4px;
+}
+
+}
+
+.tu_01 {
+	display: flex;
+	flex-direction: row;
+	gap: 20px;
+	padding: 40px 40px 0px 40px;
+}
+
+@media screen and (max-width: 1000px) {
+
+	.tu_01 {
+		display: flex;
+		flex-direction: row;
+		gap: 20px;
+		padding: 20px 20px 0px 20px;
+	}
+
 }
 
 
+.tu_inner_01 {
+	display: flex;
+	flex-direction: row;
+
+}
+
+
+.tu_02 {
+	display: flex;
+	flex-direction: column;
+	gap: 0px;
+	padding: 40px 40px 0px 40px;
+}
+
+
+@media screen and (max-width: 1000px) {
+
+	.tu_02 {
+		display: flex;
+		flex-direction: column;
+		gap: 0px;
+		padding: 20px 20px 0px 20px;
+	}
+
+}
+
+.tu_03 {
+	display: flex;
+	flex-direction: row;
+	gap: 20px;
+	padding: 20px 40px 0px 40px;
+}
+
+@media screen and (max-width: 1000px) {
+
+	.tu_03 {
+		display: flex;
+		flex-direction: row;
+		gap: 20px;
+		padding: 20px 20px 0px 20px;
+	}
+
+}
+
+
+
+
 
 /* –––––––––––––––––– FOOTER –––––––––––––––––– */
 
@@ -3122,7 +3195,7 @@ HOME UPDATE
     background-size: cover;
     background-position: center;
     background-position-y: center;
-    border: solid 1px #DDDDDD;
+/*    border: solid 1px #DDDDDD;*/
 }
 
 .thumb_post img {
@@ -3664,3 +3737,42 @@ MOBILE MARGIN UPDATE
 	background-color: #FFFFFF;
 }
 
+.tu_font {
+	font-family: "orator-std", monospace;
+	font-weight: 400;
+	font-style: normal;
+	font-size: 80px;
+	line-height: 80px;
+	letter-spacing: 4px;
+	color: #52602B;
+	text-align: center;
+	padding: 0;
+	margin: 0;
+/*	text-transform: uppercase;*/
+}
+
+.tu_font2 {
+font-family: "orator-std", monospace;
+    font-weight: 400;
+    font-style: normal;
+    font-size: 80px;
+    line-height: 68px;
+    letter-spacing: 4px;
+    color: #52602B;
+    text-align: center;
+    padding: 0;
+    margin: 0;
+}
+
+.tu_center {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    magin: 20px auto;
+    gap: 10px;
+    background-color: #F4FFD9;
+    padding: 80px 0px;
+    border-radius: 8px;
+}
+}
+

index.html

@@ -9,8 +9,11 @@
 <section class="home_section">
 
 	<header class="home_header">
+		{% if post.entity %}
 		<h3><a href="{{site.baseurl}}{{post.url}}" title="it's ok.">{{post.entity}} / {{post.category}}</a></h3>
-
+		{% else %}
+		<h3><a href="{{site.baseurl}}{{post.url}}" title="it's ok.">{{post.category}}</a></h3>
+		{% endif %}
 		<!-- <time itemprop="dateCreated" datetime="{{post.date}}">
 			{{post.date | date: "%Y"}} + {{ post.loc }}
 		</time> -->

projects/_posts/2023-01-01-00.md

@@ -3,7 +3,7 @@ layout: post
 title: AK / Lulldull / Booklist
 entity: Lulldull
 category: Booklist
-target: booklist-ongoing
+target: booklist
 loc: California
 date: 2023-01-01
 type: Product
@@ -13,7 +13,7 @@ size: Large
 tags: [data, product, ux, system, california, books, collections, database, css, ongoing]
 image: thumbs/booklist.png
 hidden: false
-permalink: /booklist/ongoing
+permalink: /booklist
 ---
 
 <div class="bg_color_none">

projects/_posts/2024-01-01-00_turnupside.md

@@ -0,0 +1,124 @@
+---
+layout: post
+title: AK / Turn Upside
+entity: 
+category: Turn Upside
+target: booklist-ongoing
+loc: California
+date: 2024-01-01
+type: Product
+role: –
+team: –
+size: Medium
+tags: [design, tools, product, process, production, ai]
+image: thumbs/turn_upside.png
+hidden: false
+permalink: /turn_upside
+---
+
+<div class="bg_color_none">
+  <div class="large_words">
+  An ai-enhanced tool to help product designers envision different arrangements of elements.
+  </div>
+</div>
+
+## The function is simple, input a single modular design and receive an array of rearrangements based on that design. The work is inherently the designer's with a little help seeing the possibilities. 
+
+
+
+{% highlight html %}
+This project is currently in production.
+{% endhighlight %}
+
+---
+
+
+<div class="tu_center">
+  <div>
+    <div class="tu_font2">turn upside</div>
+  </div>
+  <div>          
+    <div class="tu_font">TURNUP SIDE</div>
+  </div>
+  <div>
+    <div class="tu_font" style="transform: rotate(180deg);">TURNUP SIDE</div>            
+  </div>
+  <div>           
+    <div class="tu_font2" style="transform: rotate(180deg);">turn upside</div>
+  </div>
+</div>
+
+
+<div class="bg_color_none" style="width: 80%; margin: auto">
+  <div class="large_words">
+  I'm always trying to turn things upside down and see if they look any better.<br>
+  - Tibor Kalman
+  </div>
+</div>
+
+       
+
+
+
+
+
+<div class="tu_01">
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/000.png" alt="turn_upside">
+  </div>
+</div>
+
+
+
+
+
+<div class="tu_01">
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_001.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_002.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_003.png" alt="turn_upside">
+  </div>
+</div>
+
+
+<div class="tu_03">
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_003.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_005.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_006.png" alt="turn_upside">
+  </div>
+</div>
+
+<div class="tu_03">
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_007.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_008.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/large_009.png" alt="turn_upside">
+  </div>
+</div>
+
+
+
+<div class="tu_02">
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/big_001.png" alt="turn_upside">
+  </div>
+  <div class="tu_inner_01">
+    <img src="{{site.baseurl}}/images/projects/turn_upside/big_002.png" alt="turn_upside">
+  </div>
+</div>
+
+
+