@awesomeness-js/server 1.1.7 → 1.1.8

package/ui/commonComponent.test.js

@@ -1,27 +0,0 @@
-import componentDependencies from '../src/componentDependencies.js';
-import { expect, test } from 'vitest';
-
-test('component test', () => {
- 
-	const test = componentDependencies([ '_example' ],{
-		showDetails: true
-	});
-
-	expect(test._example.js).toBeDefined();
-	expect(test._example.js).toContain('ui._example');
-	expect(test._example.css).toBeDefined();
-	expect(test._example.js_details).toBeDefined();
-	expect(test._example.css_details).toBeDefined();
-
-	const test2 = componentDependencies([ 'notCommonExample' ],{
-		showDetails: false,
-		customLocation: `./sites/demo.awesomenessjs.com/components`,
-	});
-
-	expect(test2.notCommonExample.js).toBeDefined();
-	expect(test2.notCommonExample.js).toContain('ui.notCommonExample');
-	expect(test2.notCommonExample.css).toBeDefined();
-	expect(test2.notCommonExample.js_details).toBeUndefined();
-	expect(test2.notCommonExample.css_details).toBeUndefined();
-
-});

package/ui/components/blogPost/all.css

@@ -1,371 +0,0 @@
-.blogPost {
-  display: grid;
-  grid-template-columns: 1fr;      /* single column */
-  justify-items: stretch;          /* <— critical */
-  align-items: stretch;            /* optional */
-  width: 100%;
-  margin-inline: auto;             /* center the 800px box */
-  min-width: 0;                    /* avoid overflow issues */
-}
-
-.blogPost h2 {
-	text-transform: inherit;
-	font-size: 1.5em;
-	margin-top: 50px;
-}
-
-.blogPost .break {
-	width: 100%;
-	display: block;
-}
-
-
-.blogPost h3 {
-	font-weight: 300;
-	text-transform: inherit;
-	letter-spacing: 1.3px;
-	text-align: left;
-	color: #777;
-	margin-top: 0px;
-	font-size: 1.1em;
-	margin-bottom: 20px;
-}
-
-.blogPost p {
-	font-size: 1.2em;
-	line-height: 2em;
-	color: #404040;
-}
-
-.blogPost blockquote {
-	background-color: #e6e6e6;
-	margin: 0;
-	padding: 15px 25px;
-	color: #343434;
-	border-radius: 10px;
-}
-
-
-.blogPost blockquote p {
-	font-size: 1.1em;
-	line-height: 1.8 em;
-	margin: 5px;
-}
-
-.blogPost a {
-	color: #0a99ff;
-	text-decoration: none;
-	font-weight: 500;
-	cursor: pointer;
-}
-
-.blogPost a:hover {
-	text-decoration: underline;
-}
-
-.blogPost table {
-	width: 100%;
-	border-collapse: collapse;
-	margin: 25px 0;
-	font-size: 1em;
-	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
-}
-
-.blogPost tr {
-	margin-bottom: 15px;
-}
-
-.blogPost th {
-	text-align: left;
-	padding: 13px 15px;
-	background-color: #dedede;
-	color: #333;
-	font-weight: 600;
-}
-
-.blogPost th:first-child {
-	border-top-left-radius: 6px;
-}
-
-.blogPost th:last-child {
-	border-top-right-radius: 6px;
-}
-
-.blogPost td {
-	padding: 13px 15px;
-	border-bottom: 1px solid #e6e6e6;
-	color: #555;
-	font-weight: 400;
-}
-
-.blogPost ol,
-.blogPost ul {
-	margin: 20px 0;
-	padding-left: 1.5em;
-	font-size: 1em;
-	color: #555;
-	line-height: 1.6;
-}
-
-/* Ordered list numbers */
-.blogPost ol {
-	list-style-type: decimal;
-}
-
-/* Unordered list bullets */
-.blogPost ul {
-	list-style-type: disc;
-}
-
-/* List items */
-.blogPost li {
-	margin-bottom: 8px;
-}
-
-/* List items */
-.blogPost ul li ul {
-	margin-top: 5px;
-}
-
-/* List items */
-.blogPost ul li ul li {
-	margin-bottom: 8px;
-	list-style: circle;
-	font-size: 0.9em;
-	margin-top: 0px;
-}
-
-/* Nested lists get lighter style */
-.blogPost ol ol,
-.blogPost ul ul {
-	margin: 20px 0;
-	font-size: 1em;
-	color: #555;
-	line-height: 1.6;
-	font-size: 1.1em;
-	padding-left: 30px;
-}
-
-.blogPost ol li::marker {
-	font-weight: 600;
-	/* optional: make numbers bolder */
-	padding-right: 10px;
-	/* adds space after number */
-}
-
-.blogPost-header-image {
-    position: relative;
-    min-height: 500px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
-    text-align: center;
-    color: var(--white);
-    background-size: cover;
-    background-position: center;
-    overflow: hidden; /* ensures overlay stays contained */
-	padding-bottom: 5%;
-	margin-bottom: 25px;
-	min-height: 700px;
-}
-
-.app-size-p .blogPost-header-image { min-height: 400px; }
-
-.app-size-d .blogPost-header-image { min-height: 800px; }
-.app-size-xl .blogPost-header-image { min-height: 800px; }
-
-.blogPost-header-image::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-   background: linear-gradient(
-        rgba(0, 0, 0, 0.0) 0%,
-        rgba(0, 0, 0, 0.4) 35%,
-        rgba(0, 0, 0, 0.4) 65%,   
-        rgba(0, 0, 0, 0.0) 100%     
-    );
-    z-index: 0;
-}
-
-
-.blogPost-header-image > * {
-    position: relative;
-    z-index: 1; /* keeps text above the dark overlay */
-}
-
-.blogPost-title{
-	font-weight: 700;
-	font-size: 3em;
-	margin-bottom: 10px;
-	padding: 0px 50px;
-}
-
-.blogPost-subTitle{
-	font-weight: 300;
-	font-size: 1.6em;
-	margin-bottom: 15px;
-	text-transform: none;
-	color: var(--white);
-	padding: 0px 50px;
-}
-
-.app-size-p .blogPost-subTitle{
-	font-size: 1.2em;
-}
-
-
-.blogPost-catDateTime {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    gap: 10px;
-    font-size: 1.05em;
-    color: var(--stone-100);
-    margin-bottom: 20px;
-    letter-spacing: 1px;
-}
-
-.blogPost-catDateTime > * {
-	display: inline;
-}
-
-.blogPost-category {
-	cursor: pointer;
-	text-transform: capitalize;
-}
-
-.app-size-p .blogPost-catDateTime {
-	flex-direction: column;
-	margin-top: 45px;
-}
-
-
-.app-size-p .blogPost-catDateTime > * {
-	display: flex;
-}
-
-.blogPost-category:hover {
-	font-weight: 500;
-}
-
-.blogPost-catDateTime-separator {
-	width: 7px;
-	height: 7px;
-	border-radius: 50%;
-	background-color: var(--stone-100);
-	flex-shrink: 0;
-	margin: 0px 5px;
-}
-
-.app-size-p .blogPost-catDateTime-separator {
-	display: none;
-}
-
-.blogPost-author {
-	display: flex;
-	align-items: center; /* vertically centers image and text */
-	gap: 10px; /* replaces margin-right for cleaner spacing */
-	font-size: 1em;
-	color: var(--white);
-	font-weight: 300;
-	margin-top: 25px;
-	padding-bottom: 40px;
-}
-
-.app-size-p .blogPost-author {
-	flex-direction: column;
-	padding-bottom: 100px;
-}
-
-.app-size-p .blogPost-author-name  {
-    display: block;
-    margin-bottom: 10px;
-}
-
-.blogPost-author-name {
-    font-weight: 500;
-    margin-right: 10px;
-    font-size: 1.1em;
-    letter-spacing: 0.03em;
-}
-.blogPost-author-image {
-	margin-right: 10px;
-	width: 40px;
-	height: 40px;
-	border-radius: 50%;
-	background-color: var(--white);
-	background-size: cover;
-	background-position: center;
-	flex-shrink: 0; /* keeps it from squishing */
-}
-
-.blogPost-next-reads h2,
-.blogPost-next-reads h3 {
-    margin-bottom: 10px;
-}
-
-.blogPost-next-reads li {
-    border: solid 1px var(--stone-200);
-    border-radius: 5px;
-	cursor: pointer;
-}
-
-.blogPost-next-reads li:hover {
-	background-color: var(--blue-100);
-	border-color: var(--blue-300);
-	font-weight: 500;
-}
-
-.blogPost-next-reads li a {
-	font-weight: 400;
-	display: block;
-    padding: 10px;
-}
-
-.blogPost-next-reads li a:hover,
-.blogPost-tags-list .blogPost-tag:hover a {
-	text-decoration: none;
-}
-
-.blogPost-next-reads ul {
-    list-style: none;
-    margin: 0px;
-    padding: 0px;
-}
-
-
-.blogPost-tags-list {
-    position: absolute;
-    bottom: 25px;
-    font-size: 0.8em;
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	flex-wrap: wrap;
-	justify-content: center;
-	padding: 0px 20px;
-}
-
-.blogPost-tag {
-    border: solid 1px var(--stone-200);
-    cursor: pointer;
-    padding: 5px 10px;
-	white-space: nowrap;
-	transition: all 200ms;
-}
-
-.blogPost-tag:hover {
-	color: var(--black);
-	background-color: var(--white);
-}
-
-.blogPost img {
-	max-width: 100%;
-	min-width: 100%;
-	border-radius: 8px;
-	margin: 20px 0px;
-}

package/ui/components/blogPost/headerImage.js

@@ -1,153 +0,0 @@
-// awesomeness import 'tag'
-
-export default ({
-	mdContent,
-	metadata,
-	tagBase = '/tag'
-}) => {
-
-	const $headerImage = $(`<div class="blogPost-header-image"></div>`)
-		.css({ 'background-image': `url(${metadata.image})` });
-
-
-	const $catDateTime = $(`<div class="blogPost-catDateTime"></div>`)
-		.appendTo($headerImage);
-
-
-	if(!metadata.category && metadata?.tags.length > 0){
-
-		metadata.category = metadata.tags[0];
-	
-	}
-
-	if(metadata.category){
-
-		$(`<a href="${tagBase}/${metadata.category}"><div class="blogPost-category">${metadata.category}</div></a>`)
-			.appendTo($catDateTime);
-
-		// add •
-		$(`<div class="blogPost-catDateTime-separator"></div>`)
-			.appendTo($catDateTime);
-	
-	}
-
-	if(metadata.published){
-
-		// make EST default
-
-		let tz = metadata.timezone || 'America/New_York';
-
-		const [ y, m, d ] = metadata.published.split('-').map(Number);
-
-		// Create date in local time (NOT UTC)
-		const date = new Date(y, m - 1, d);
-
-		const options = {
-			year: 'numeric',
-			month: app && app.size && app.size.view !== 'p' ? 'long' : 'short',
-			day: 'numeric',
-			timeZone: tz
-		};
-
-		const formattedDate = date.toLocaleDateString(undefined, options);
-
-		$(`<div class="blogPost-published">${formattedDate}</div>`)
-			.appendTo($catDateTime);
-
-		
-		// add •
-		$(`<div class="blogPost-catDateTime-separator"></div>`)
-			.appendTo($catDateTime);
-	
-	}
-
-	if(!metadata.readTime && mdContent){
-	
-		const wordsPerMinute = 200;
-		const words = mdContent.trim().split(/\s+/).length;
-		const readTime = Math.ceil(words / wordsPerMinute);
-
-		metadata.readTime = readTime;
-
-	}
-
-	if(metadata.readTime){
-
-		$(`<div class="blogPost-readTime"><i class="ico-clock"></i> ${metadata.readTime} min read</div>`)
-			.appendTo($catDateTime);
-	
-	} else {
-
-		console.warn('Read time could not be calculated for blog post:', {
-			metadata,
-			mdContent
-		});
-
-	}
-	
-
-	const $title = $(`<h1 class="blogPost-title"><a target="_blank" href="${metadata.url}">${metadata.title}</a></h1>`)
-		.appendTo($headerImage);
-
-	if(metadata.subTitle){
-
-		$(`<h2 class="blogPost-subTitle">${metadata.subTitle}</h2>`)
-			.appendTo($headerImage);
-		
-	}
-
-
-	if(metadata.author){
-
-		let image;
-
-		let authorName = metadata.author.url ? `<a class="blogPost-author-name" href="${metadata.author.url}" target="_blank" rel="noopener">${metadata.author.name}</a>` : metadata.author.name;
-
-		if(metadata.author.title){
-
-			authorName += `${metadata.author.title}`;
-		
-		}
-
-
-		const $author = $(`<div class="blogPost-author"><span>${authorName}</span></div>`)
-			.appendTo($headerImage);
-
-		if(metadata.author.image){
-
-			image = $(`<div class="blogPost-author-image"></div>`)
-				.css({ 'background-image': `url(${metadata.author.image})` })
-				.prependTo($author);
-				
-		
-		}
-
-	}
-
-
-	if(metadata.tags){
-
-		const $tagsList = $(`<div class="blogPost-tags-list"></div>`)
-			.appendTo($headerImage);
-
-		metadata?.tags?.forEach((tag) => {
-
-			const link = ui.tag.category(tag);
-
-			const $tag = $(`<a href="${tagBase}/${link}"><div class="blogPost-tag ${metadata.tagColor ? metadata.tagColor : ''}">${tag}</div></a>`)
-				.appendTo($tagsList)
-				.on('click', (e) => {
-
-					e.stopPropagation();
-					e.preventDefault();
-					app.page(`${tagBase}/${link}`);
-
-				});
-
-		});
-
-	}
-
-	return $headerImage;
-
-};

package/ui/components/blogPost/index.js

@@ -1,45 +0,0 @@
-export default (post) => {
-
-	let $out = $('<div class="blogPost"></div>');
-
-	if(!post || !post.sections){
-
-		$out.html('hmmm.... something is wrong with this post');
-		
-		return $out;
-	
-	}
-
-	post.sections.forEach((section) => {
-
-		if(
-			typeof ui.blogPost[section.type] !== 'function'
-			&& !typeof section.custom === 'function'
-		){
-
-			console.log(`blogPost section type "${section.type}" not found (not custom either...)`, section);
-
-			return;
-
-		}
-
-		const $sectionContainer = $(`<div class="blogPost-section"></div>`)
-			.appendTo($out);
-
-		const $sectionContent = ui.blogPost[section.type](section.data);
-
-		if(!$sectionContent){
-
-			console.log(`blogPost section type "${section.type}" returned no content`, section);
-
-			return;
-
-		}
-
-		$sectionContent.appendTo($sectionContainer);
-
-	});
-
-	return $out;
-
-};