Blog page updates, responsive design prep

kkeles · Jan 11, 2024 · 88981cb · 88981cb
1 parent f146fdb
commit 88981cb
Show file tree

Hide file tree

Showing 12 changed files with 110 additions and 35 deletions.
diff --git a/themes/awsug/assets/css/about.css b/themes/awsug/assets/css/about.css
@@ -71,3 +71,54 @@
 }
 
 /* #endregion */
+
+/* #region RESPONSIVE DESIGN */
+@media (max-width: 1024px) {
+	.about-section {
+		grid-template-columns: 1fr;
+		padding: 1% 3%;
+	}
+
+	.about-left,
+	.about-right {
+		display: flex;
+		flex-direction: column;
+	}
+
+	.about-image {
+		width: 100%;
+		order: 2;
+	}
+
+	.text-area {
+		order: 1;
+	}
+}
+
+@media (max-width: 768px) {
+	:root {
+		--image-height: 300px;
+	}
+
+	.text-area {
+		min-height: 150px;
+	}
+
+	.about-section {
+		padding: 1% 25px;
+	}
+
+	.about-image img {
+		margin: 10px 0px;
+		width: 100% !important;
+	}
+
+	#top-mini-slogan,
+	#slogan-first,
+	#slogan-second {
+		font-size: 20px;
+		text-align: justify;
+	}
+}
+
+/* #endregion */
diff --git a/themes/awsug/assets/css/blog.css b/themes/awsug/assets/css/blog.css
@@ -28,15 +28,38 @@
 
 .blogBanner {
 	height: 300px;
-	width: 750px;
+	width: 40vw;
 	object-fit: cover;
 	border: 2px solid var(--color-primary-gray);
 	border-radius: 10px;
 }
 
-.blogIntro {
+.blogAbstract {
 	font-family: 'Amazon Ember';
 	font-weight: 300;
     width: 750px;
     text-align: justify;
 }
+
+.blogInfoArea {
+	display: flex;
+	flex-direction: row;
+	margin-top: 5px;
+}
+
+.blogInfo {
+	display: flex;
+	align-items: center;
+	margin-right: 75px;
+}
+
+.blogInfoIcon {
+	margin-top: 10px;
+}
+
+.blogInfoText {
+	font-family: "Amazon Ember Display";
+    font-size: var(--font-size-details);
+	margin-top: 10px;
+	margin-left: 10px;
+}
diff --git a/themes/awsug/assets/css/navigation.css b/themes/awsug/assets/css/navigation.css
@@ -111,7 +111,7 @@ header img {
 }
 
 .footer-column a:hover {
-  color: var(--color-primary-yellow);
+  color: var(--color-primary-white);
 }
 
 .footer-right {

diff --git a/themes/awsug/content/blog/_index.md b/themes/awsug/content/blog/_index.md
@@ -2,6 +2,6 @@
 title = 'Blog'
 date = 2023-01-01T08:30:00-07:00
 type = "5-blog" # folder containing the html file
-layout = "blog" # name of the html file
+layout = "list" # name of the html file
 draft = false
 +++
diff --git a/...mon-user-data-templates-for-ec2/_index.md → ...mmon-user-data-templates-for-ec2/index.md b/...mon-user-data-templates-for-ec2/_index.md → ...mmon-user-data-templates-for-ec2/index.md
@@ -1,8 +1,9 @@
 +++
 title = 'Common User Data Templates for EC2'
-date = 2023-01-01T09:00:00-07:00
+date = 2023-05-12
 thumbnailURL = ''
-blogIntro = 'A powerful detail that will save time in repetitive creation of EC2 instances.'
+abstract = 'A powerful detail that will save time in repetitive creation of EC2 instances.'
+author = 'Kadir Keles'
 draft = false
 +++
 

diff --git a/themes/awsug/content/blog/my-first-post.md b/themes/awsug/content/blog/my-first-post.md
@@ -1,9 +1,13 @@
 +++
-title = 'My first post'
-date = 2023-01-01T09:00:00-07:00
-thumbnailURL = 'https://oir.mobi/uploads/posts/2019-11/1574939995_audi-tt-belyj-45.jpg'
+title = 'My First Post'
+date = 2022-10-01
+thumbnailURL = 'https://secure.meetupstatic.com/photos/event/7/c/9/7/600_495151895.webp?w=384'
+abstract = ' '
+author = 'Daniel Ciaglia'
 draft = false
+tags = ['red','green']
 +++
 
-Tempor proident minim aliquip reprehenderit dolor et ad anim Lorem duis sint eiusmod. Labore ut ea duis dolor. Incididunt consectetur proident qui occaecat incididunt do nisi Lorem. Tempor do laborum elit laboris excepteur eiusmod do. Eiusmod nisi excepteur ut amet pariatur adipisicing Lorem.
-Occaecat nulla excepteur dolore excepteur duis eiusmod ullamco officia anim in voluptate ea occaecat officia. Cillum sint esse velit ea officia minim fugiat. Elit ea esse id aliquip pariatur cupidatat id duis minim incididunt ea ea. Anim ut duis sunt nisi. Culpa cillum sit voluptate voluptate eiusmod dolor. Enim nisi Lorem ipsum irure est excepteur voluptate eu in enim nisi. Nostrud ipsum Lorem anim sint labore consequat do. Occaecat nulla excepteur dolore excepteur duis eiusmod ullamco officia anim in voluptate ea occaecat officia. Cillum sint esse velit ea officia minim fugiat. Elit ea esse id aliquip pariatur cupidatat id duis minim incididunt ea ea. Anim ut duis sunt nisi. Culpa cillum sit voluptate voluptate eiusmod dolor. Enim nisi Lorem ipsum irure est excepteur voluptate eu in enim nisi. Nostrud ipsum Lorem anim sint labore consequat do.
+Anim eiusmod irure incididunt sint cupidatat. Incididunt irure irure irure nisi ipsum do ut quis fugiat consectetur proident cupidatat incididunt cillum. Dolore voluptate occaecat qui mollit laborum ullamco et. Ipsum laboris officia anim laboris culpa eiusmod ex magna ex cupidatat anim ipsum aute. Mollit aliquip occaecat qui sunt velit ut cupidatat reprehenderit enim sunt laborum. Velit veniam in officia nulla adipisicing ut duis officia.
+
+Exercitation voluptate irure in irure tempor mollit Lorem nostrud ad officia. Velit id fugiat occaecat do tempor. Sit officia Lorem aliquip eu deserunt consectetur. Aute proident deserunt in nulla aliquip dolore ipsum Lorem ut cupidatat consectetur sit sint laborum. Esse cupidatat sit sint sunt tempor exercitation deserunt. Labore dolor duis laborum est do nisi ut veniam dolor et nostrud nostrud.
diff --git a/themes/awsug/content/blog/my-last-post.md b/themes/awsug/content/blog/my-last-post.md
@@ -1,7 +1,9 @@
 +++
 title = 'My Last Post'
-date = 2024-01-07T10:00:00-07:00
+date = 2024-01-07
 thumbnailURL = 'https://secure.meetupstatic.com/photos/event/7/c/9/7/600_495151895.webp?w=384'
+abstract = ' '
+author = 'Timur Bublik'
 draft = false
 tags = ['red','green']
 +++

diff --git a/themes/awsug/content/blog/my-second-post.md b/themes/awsug/content/blog/my-second-post.md
diff --git a/themes/awsug/content/blog/my-third-post.md b/themes/awsug/content/blog/my-third-post.md
diff --git a/themes/awsug/layouts/5-blog/list.html b/themes/awsug/layouts/5-blog/list.html
@@ -3,7 +3,7 @@
 
 {{ .Content }}
 <ul id="blogsGrid">
-	{{ range .Pages.ByPublishDate }}
+	{{ range .Pages.ByPublishDate.Reverse }}
 	<li class="blogObject">
 		<a href="{{ .RelPermalink }}"
 			><h2 class="blogTitle">{{ .LinkTitle }}</h2>
@@ -15,7 +15,21 @@
 			{{ end }} 
 	{{ end }}
 		</a>
-		<p class="blogIntro">{{ .Params.blogIntro }}</p>
+		<div class="blogAbstract">{{ .Params.abstract }}</div>
+		<div class="blogInfoArea">
+			<div class="blogInfo">
+				<div class="blogInfoIcon">
+					<img src="/images/icons/author.png" alt="" />
+				</div>
+				<div class="blogInfoText">{{ .Params.author }}</div>
+			</div>
+			<div class="blogInfo">
+				<div class="blogInfoIcon">
+					<img src="/images/icons/date.png" alt="" />
+				</div>
+				<div class="blogInfoText">{{ dateFormat "January 2, 2006" .Params.date }}</div>
+			</div>
+		</div>
 	</li>
 	{{end}}
 </ul>

diff --git a/themes/awsug/layouts/_default/single.html b/themes/awsug/layouts/_default/single.html
@@ -7,4 +7,4 @@ <h1>{{ .Title }}</h1>
 
   {{ .Content }}
   {{ partial "terms.html" (dict "taxonomy" "tags" "page" .) }}
-{{ end }}
+{{ end }}
diff --git a/themes/awsug/static/images/icons/author.png b/themes/awsug/static/images/icons/author.png