fix: title + styles
This commit is contained in:
parent
f4530c30e2
commit
ee721631b9
16 changed files with 82 additions and 95 deletions
|
|
@ -109,7 +109,7 @@ export default {
|
|||
entryData.forEach((entry) => {
|
||||
const md = mdGenerator()
|
||||
const dateKey = Object.keys(entry).find(key => key.includes('date'))
|
||||
let { title, image, url, slug, link, authors, description, type, content, backdrop, rating, tags } = entry
|
||||
let { artist, authors, backdrop, content, description, image, link, rating, slug, title, url, tags, type } = entry
|
||||
const feedNote = '<hr/><p>This is a full text feed, but not all content can be rendered perfectly within the feed. If something looks off, feel free to <a href="https://coryd.dev">visit my site</a> for the original post.</p>'
|
||||
const processedEntry = { title: title.trim(), date: new Date(entry[dateKey]), content: description }
|
||||
|
||||
|
|
@ -137,6 +137,7 @@ export default {
|
|||
if (rating) processedEntry['rating'] = rating
|
||||
if (tags) processedEntry['tags'] = tags
|
||||
if (type === 'album-release') {
|
||||
if (artist) processedEntry['title'] = `${title} by ${artist}`
|
||||
processedEntry['excerpt'] = 'Check out the new release!'
|
||||
processedEntry['content'] = 'Check out the new release!'
|
||||
}
|
||||
|
|
@ -156,43 +157,45 @@ export default {
|
|||
url: item['url'],
|
||||
type: item['type']
|
||||
}
|
||||
if (item['type'] === 'artist') {
|
||||
normalized['title'] = item['title']
|
||||
normalized['alt'] = `${item['plays']} plays of ${item['title']}`
|
||||
normalized['subtext'] = `${item['plays']} plays`
|
||||
}
|
||||
if (item['type'] === 'album') {
|
||||
normalized['title'] = item['title']
|
||||
normalized['alt'] = `${item['title']} by ${item['artist']}`
|
||||
normalized['subtext'] = `${item['artist']}`
|
||||
}
|
||||
if (item['type'] === 'album-release') {
|
||||
normalized['title'] = item['title']
|
||||
normalized['alt'] = `${item['title']} by ${item['artist']}`
|
||||
normalized['subtext'] = `${item['artist']} / ${item['date']}`
|
||||
}
|
||||
if (item['type'] === 'movie') {
|
||||
normalized['title'] = item['title']
|
||||
normalized['alt'] = item['title']
|
||||
normalized['rating'] = item['rating']
|
||||
normalized['favorite'] = item['favorite']
|
||||
normalized['subtext'] = item.rating ? `${item['rating']} (${item['year']})` : `(${item['year']})`
|
||||
}
|
||||
if (item['type'] === 'book') {
|
||||
normalized['title'] = `${item['title']} by ${item['author']}`
|
||||
normalized['rating'] = item['rating']
|
||||
if (item['rating']) normalized['subtext'] = item['rating']
|
||||
}
|
||||
if (item['type'] === 'tv') {
|
||||
normalized['title'] = item['name']
|
||||
normalized['alt'] = `${item['subtext']} of ${item['name']}`
|
||||
normalized['subtext'] = item['subtext']
|
||||
}
|
||||
if (item['type'] === 'tv-range') {
|
||||
normalized['title'] = item['name']
|
||||
normalized['alt'] = `${item['subtext']} from ${item['name']}`
|
||||
normalized['subtext'] = item['subtext']
|
||||
|
||||
switch (item['type']) {
|
||||
case 'artist':
|
||||
normalized.title = item['title']
|
||||
normalized.alt = `${item['plays']} plays of ${item['title']}`
|
||||
normalized.subtext = `${item['plays']} plays`
|
||||
break
|
||||
case 'album':
|
||||
normalized.title = item['title']
|
||||
normalized.alt = `${item['title']} by ${item['artist']}`
|
||||
normalized.subtext = `${item['artist']}`
|
||||
break
|
||||
case 'album-release':
|
||||
normalized.title = item['title']
|
||||
normalized.alt = `${item['title']} by ${item['artist']}`
|
||||
normalized.subtext = `${item['artist']} / ${item['date']}`
|
||||
break
|
||||
case 'movie':
|
||||
normalized.title = item['title']
|
||||
normalized.alt = item['title']
|
||||
normalized.rating = item['rating']
|
||||
normalized.favorite = item['favorite']
|
||||
normalized.subtext = item.rating ? `${item['rating']} (${item['year']})` : `(${item['year']})`
|
||||
break
|
||||
case 'book':
|
||||
normalized.title = `${item['title']} by ${item['author']}`
|
||||
if (item['rating']) {
|
||||
normalized.rating = item['rating']
|
||||
normalized.subtext = item['rating']
|
||||
}
|
||||
break
|
||||
case 'tv':
|
||||
case 'tv-range':
|
||||
normalized.title = item['name']
|
||||
normalized.alt = `${item['subtext']} ${item['type'] === 'tv' ? 'of' : 'from'} ${item['name']}`
|
||||
normalized.subtext = item['subtext']
|
||||
break
|
||||
}
|
||||
|
||||
return normalized
|
||||
})
|
||||
},
|
||||
|
|
|
|||
12
package-lock.json
generated
12
package-lock.json
generated
|
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "coryd.dev",
|
||||
"version": "24.5.1",
|
||||
"version": "24.5.2",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "coryd.dev",
|
||||
"version": "24.5.1",
|
||||
"version": "24.5.2",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@cdransf/api-text": "^1.5.0",
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
"markdown-it": "^14.1.0",
|
||||
"markdown-it-anchor": "^9.1.0",
|
||||
"markdown-it-footnote": "^4.0.0",
|
||||
"postcss": "^8.4.43",
|
||||
"postcss": "^8.4.44",
|
||||
"postcss-cli": "^11.0.0",
|
||||
"postcss-import": "^16.1.0",
|
||||
"postcss-import-ext-glob": "^2.1.1",
|
||||
|
|
@ -3261,9 +3261,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.4.43",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.43.tgz",
|
||||
"integrity": "sha512-gJAQVYbh5R3gYm33FijzCZj7CHyQ3hWMgJMprLUlIYqCwTeZhBQ19wp0e9mA25BUbEvY5+EXuuaAjqQsrBxQBQ==",
|
||||
"version": "8.4.44",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.44.tgz",
|
||||
"integrity": "sha512-Aweb9unOEpQ3ezu4Q00DPvvM2ZTUitJdNKeP/+uQgr1IBIqu574IaZoURId7BKtWMREwzKa9OgzPzezWGPWFQw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "coryd.dev",
|
||||
"version": "24.5.1",
|
||||
"version": "24.5.2",
|
||||
"description": "The source for my personal site. Built using 11ty (and other tools).",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
"markdown-it": "^14.1.0",
|
||||
"markdown-it-anchor": "^9.1.0",
|
||||
"markdown-it-footnote": "^4.0.0",
|
||||
"postcss": "^8.4.43",
|
||||
"postcss": "^8.4.44",
|
||||
"postcss-cli": "^11.0.0",
|
||||
"postcss-import": "^16.1.0",
|
||||
"postcss-import-ext-glob": "^2.1.1",
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
}
|
||||
|
||||
& a {
|
||||
outline: 0;
|
||||
outline: none;
|
||||
|
||||
&:focus img,
|
||||
&:focus-within img {
|
||||
|
|
|
|||
|
|
@ -32,9 +32,17 @@ input:focus,
|
|||
input:focus-within,
|
||||
textarea:focus,
|
||||
textarea:focus-within {
|
||||
padding: calc(var(--sizing-sm) + 1px);
|
||||
}
|
||||
|
||||
input:focus,
|
||||
input:focus-within,
|
||||
textarea:focus,
|
||||
textarea:focus-within,
|
||||
select:focus,
|
||||
select:focus-within {
|
||||
border: 0;
|
||||
outline: var(--outline-default);
|
||||
padding: calc(var(--sizing-sm) + 1px);
|
||||
}
|
||||
|
||||
select {
|
||||
|
|
@ -43,12 +51,6 @@ select {
|
|||
border-radius: var(--border-radius-slight);
|
||||
background-color: var(--background-color);
|
||||
padding: var(--sizing-xs) var(--sizing-sm);
|
||||
|
||||
&:focus,
|
||||
&:focus-within {
|
||||
border: 0;
|
||||
outline: var(--outline-default)
|
||||
}
|
||||
}
|
||||
|
||||
.search__form {
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@
|
|||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
box-shadow: inset 0 -85px 60px -60px var(--black);
|
||||
box-shadow: var(--box-shadow-media);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: var(--border-default);
|
||||
|
|
|
|||
|
|
@ -24,8 +24,12 @@
|
|||
|
||||
.menu-button-container {
|
||||
display: none;
|
||||
outline: none;
|
||||
margin-left: var(--sizing-md);
|
||||
outline: 0;
|
||||
|
||||
& svg {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:focus-within {
|
||||
|
|
@ -33,10 +37,6 @@
|
|||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
|
||||
& svg {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:hover svg,
|
||||
&:focus svg,
|
||||
&:focus-within svg,
|
||||
|
|
@ -123,7 +123,7 @@
|
|||
|
||||
&:focus a,
|
||||
&:focus-within a {
|
||||
outline: 0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
|
|
|
|||
|
|
@ -20,30 +20,8 @@
|
|||
position: absolute;
|
||||
top: var(--sizing-lg);
|
||||
right: var(--sizing-lg);
|
||||
cursor: pointer;
|
||||
height: var(--sizing-svg-base);
|
||||
width: var(--sizing-svg-base);
|
||||
|
||||
&:focus svg,
|
||||
&:focus-within svg {
|
||||
outline: var(--outline-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
|
||||
& svg {
|
||||
stroke: var(--accent-color);
|
||||
|
||||
&:focus {
|
||||
outline: var(--outline-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
stroke: var(--accent-color-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -60,7 +38,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
.modal-toggle {
|
||||
.modal-toggle,
|
||||
.modal-close {
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
vertical-align: middle;
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
line-height: 1.5;
|
||||
|
||||
& a {
|
||||
outline: 0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
.progress-bar-wrapper {
|
||||
display: flex;
|
||||
height: var(--sizing-lg);
|
||||
width: 100%;
|
||||
background-color: rgba(217, 222, 228, .6);
|
||||
border-radius: var(--border-radius-full);
|
||||
overflow: hidden;
|
||||
height: var(--sizing-lg);
|
||||
width: 100%;
|
||||
|
||||
& .progress-bar {
|
||||
background-color: var(--accent-color);
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
position: absolute;
|
||||
z-index: 1;
|
||||
content: '';
|
||||
box-shadow: inset 0 -120px 60px -60px var(--background-color);
|
||||
box-shadow: var(--box-shadow-text-toggle);
|
||||
width: 100%;
|
||||
height: 20%;
|
||||
bottom: 0;
|
||||
|
|
|
|||
|
|
@ -123,6 +123,10 @@
|
|||
--stroke-width-bold: 2;
|
||||
--inline-margin-bottom: -5px;
|
||||
|
||||
/* shadows */
|
||||
--box-shadow-media: inset 0 -85px 60px -60px var(--black);
|
||||
--box-shadow-text-toggle: inset 0 -120px 60px -60px var(--background-color);
|
||||
|
||||
/* input accent color */
|
||||
accent-color: var(--accent-color);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
& a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
outline: 0;
|
||||
outline: none;
|
||||
|
||||
&:focus svg,
|
||||
&:focus-within svg {
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
& img {
|
||||
max-width: calc(var(--sizing-3xl) * 4);
|
||||
height: auto;
|
||||
|
|
@ -115,10 +114,6 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin: var(--sizing-base) 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
|
|
|
|||
|
|
@ -18,6 +18,10 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 60vh;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@ a:active > .watching.hero::after {
|
|||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
box-shadow: inset 0 -85px 60px -60px var(--black);
|
||||
box-shadow: var(--box-shadow-media);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: var(--border-default);
|
||||
|
|
@ -140,7 +140,7 @@ a:active > .watching.hero::after {
|
|||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
box-shadow: inset 0 -85px 60px -60px var(--black);
|
||||
box-shadow: var(--box-shadow-media);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: var(--border-default);
|
||||
|
|
|
|||
Reference in a new issue