api fallbacks fully implemented
This commit is contained in:
ManjaroOne666
parent
463a8f6c81
commit
d4f80abb48
24
TODO.md
24
TODO.md
|
|
@ -72,3 +72,27 @@
|
|||
},
|
||||
]
|
||||
```
|
||||
```html
|
||||
<h2 class="heading heading-top">I Imagine Myself</h2>
|
||||
<blockquote class="quote">
|
||||
<p class="quote-text">"As a photographic artist, my creative pursuit is to escape the attempts to categorize, characterize, compartmentalize, explain, or limit my photographic expression. It is always pleasing to see how observers respond with delight to the ultimate visualizations of my quest. My fondest wish is to pursue my life as a photographer, unbridled and always with a resolve to improve and be the best I can, with a constant yearning to be better."</p>
|
||||
</blockquote>
|
||||
<ul class="about-list">
|
||||
<li class="about-list__item">I imagine myself peering from behind a photographer's blind, always observing, but rarely participating.</li>
|
||||
<li class="about-list__item">I have an ephemeral sensation of being a camouflaged moth on a tree.</li>
|
||||
<li class="about-list__item">I imagine seeing my life from that perspective, that tree, as a solitary instant in eternity.</li>
|
||||
<li class="about-list__item">Preserving life's moments and sharing them, makes the most, I think, of my photographic proclivity.</li>
|
||||
<li class="about-list__item">I get great satisfaction from the responses viewers have to these images of my perceived realities.</li>
|
||||
<li class="about-list__item">As an artist and photographer, this is my mantra.</li>
|
||||
<li class="about-list__item">I am convinced that my creative potential escapes the propensity to categorize, characterize, compartmentalize, explain, or limit my photographic expression.</li>
|
||||
<li class="about-list__item">I will succeed in a career as a photographer, and I always resolve to improve, and be the best I can; however, I want to be much better than that.</li>
|
||||
</ul>
|
||||
<h2 class="heading">The Essence of the Image</h2>
|
||||
<p>The photographer Marc Leopold was born in Chicago, Illinois in 1964. He credits his artistry in photography to the benevolence of renowned mentors, and to his own constant search for the resources, intricacies and techniques that capture the essence of the image.</p>
|
||||
<p>While Marc's work tends toward nature and representational photography, he also uses his talents in both formal and commercial situations. He works, there, to achieve the same essence that he strives for when shooting nature.</p>
|
||||
<p>Marc's images are in many private collections and corporate and educational institutions. They have also appeared in a number of publications. His photographs appear in several books, including 'Two Weeks the Raven Sings', by David Reston, and in 'Once we Talk', by Jayne deVeres.</p>
|
||||
<p>Marc has also published in a wide variety of magazines and newspapers, including The International Review of Irish American Art, Erik Tweeds' Two Worlds Magazine, EVE Magazine, Parfolio, Essence, The Chicago Tribune, Chicago Derry News, Business News Today, and One Day Journal.</p>
|
||||
<p>In addition to this media exposure, Marc has exhibited at The Chicago College of Art, The Irish American Museum in Detroit, The Sur Dez Gallery in San Antonio, Phoenix City Gallery in Arizona, Wellner Department stores nationwide, Torren Gallery in California, and The Tide Gallery in Boston, and elsewhere.</p>
|
||||
<p>Marc's artistic philosophy is based on his ability to capture a fleeting moment, a solitary instant in eternity, where he feels almost transparent, like a camouflaged moth in the midst of a lush green forest, defining for posterity through his photography an elusive moment in life, captured to share with others.</p>
|
||||
|
||||
```
|
||||
|
|
|
|||
|
|
@ -122,6 +122,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
.background-overlay {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.background-tint {
|
||||
background-color: rgba($color__primary-100, .7);
|
||||
}
|
||||
|
|
@ -133,6 +143,15 @@
|
|||
box-shadow: 0 0 64px 64px $color;
|
||||
}
|
||||
|
||||
.no-content-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.no-content-text {
|
||||
color: $color__neutral-800;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,27 +1,8 @@
|
|||
<template>
|
||||
<ContentPage heading="About Me" class="about">
|
||||
<div class="about-content">
|
||||
<h2 class="heading heading-top">I Imagine Myself</h2>
|
||||
<blockquote class="quote">
|
||||
<p class="quote-text">"As a photographic artist, my creative pursuit is to escape the attempts to categorize, characterize, compartmentalize, explain, or limit my photographic expression. It is always pleasing to see how observers respond with delight to the ultimate visualizations of my quest. My fondest wish is to pursue my life as a photographer, unbridled and always with a resolve to improve and be the best I can, with a constant yearning to be better."</p>
|
||||
</blockquote>
|
||||
<ul class="about-list">
|
||||
<li class="about-list__item">I imagine myself peering from behind a photographer's blind, always observing, but rarely participating.</li>
|
||||
<li class="about-list__item">I have an ephemeral sensation of being a camouflaged moth on a tree.</li>
|
||||
<li class="about-list__item">I imagine seeing my life from that perspective, that tree, as a solitary instant in eternity.</li>
|
||||
<li class="about-list__item">Preserving life's moments and sharing them, makes the most, I think, of my photographic proclivity.</li>
|
||||
<li class="about-list__item">I get great satisfaction from the responses viewers have to these images of my perceived realities.</li>
|
||||
<li class="about-list__item">As an artist and photographer, this is my mantra.</li>
|
||||
<li class="about-list__item">I am convinced that my creative potential escapes the propensity to categorize, characterize, compartmentalize, explain, or limit my photographic expression.</li>
|
||||
<li class="about-list__item">I will succeed in a career as a photographer, and I always resolve to improve, and be the best I can; however, I want to be much better than that.</li>
|
||||
</ul>
|
||||
<h2 class="heading">The Essence of the Image</h2>
|
||||
<p>The photographer Marc Leopold was born in Chicago, Illinois in 1964. He credits his artistry in photography to the benevolence of renowned mentors, and to his own constant search for the resources, intricacies and techniques that capture the essence of the image.</p>
|
||||
<p>While Marc's work tends toward nature and representational photography, he also uses his talents in both formal and commercial situations. He works, there, to achieve the same essence that he strives for when shooting nature.</p>
|
||||
<p>Marc's images are in many private collections and corporate and educational institutions. They have also appeared in a number of publications. His photographs appear in several books, including 'Two Weeks the Raven Sings', by David Reston, and in 'Once we Talk', by Jayne deVeres.</p>
|
||||
<p>Marc has also published in a wide variety of magazines and newspapers, including The International Review of Irish American Art, Erik Tweeds' Two Worlds Magazine, EVE Magazine, Parfolio, Essence, The Chicago Tribune, Chicago Derry News, Business News Today, and One Day Journal.</p>
|
||||
<p>In addition to this media exposure, Marc has exhibited at The Chicago College of Art, The Irish American Museum in Detroit, The Sur Dez Gallery in San Antonio, Phoenix City Gallery in Arizona, Wellner Department stores nationwide, Torren Gallery in California, and The Tide Gallery in Boston, and elsewhere.</p>
|
||||
<p>Marc's artistic philosophy is based on his ability to capture a fleeting moment, a solitary instant in eternity, where he feels almost transparent, like a camouflaged moth in the midst of a lush green forest, defining for posterity through his photography an elusive moment in life, captured to share with others.</p>
|
||||
<div class="about-content" :class="{ 'no-content-container': isNoContent }">
|
||||
<h2 class="heading heading-top">{{ title }}</h2>
|
||||
<div v-html="body"></div>
|
||||
</div>
|
||||
<BackgroundImageLoader slot="background"
|
||||
class="background"
|
||||
|
|
@ -56,8 +37,26 @@ export default {
|
|||
},
|
||||
|
||||
async asyncData ({ $axios }) {
|
||||
const { imageUrl } = await $axios.$get('/api/v1/page/about')
|
||||
return { imageUrl }
|
||||
try {
|
||||
const isNoContent = false
|
||||
let { title, imageUrl, body } = await $axios.$get('/api/v1/about')
|
||||
if (!body || body.length < 1) {
|
||||
throw new Error('No body in response')
|
||||
} else if (!imageUrl || imageUrl.length < 1) {
|
||||
imageUrl = '/img/default-about.jpg'
|
||||
}
|
||||
return { title, imageUrl, body, isNoContent }
|
||||
} catch {
|
||||
return {
|
||||
title: 'Coming Soon',
|
||||
imageUrl: '/img/default-about.jpg',
|
||||
body: `<div class="no-services">
|
||||
<p class="no-conttent-text">Please check back, I will be updating this page shortly.</p>
|
||||
</div>
|
||||
`,
|
||||
isNoContent: true,
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
|
|
@ -77,14 +76,14 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.about-content .quote {
|
||||
.about-content /deep/ blockquote {
|
||||
font-size: 1.4em;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1.5rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.quote-text {
|
||||
.about-content /deep/ blockquote p {
|
||||
color: $color__neutral-700;
|
||||
text-shadow: 0 0 3px #000;
|
||||
}
|
||||
|
|
@ -99,7 +98,7 @@ export default {
|
|||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.content .about-list {
|
||||
.about-content /deep/ ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
|
|
@ -109,7 +108,7 @@ export default {
|
|||
margin-bottom: 4.5rem;
|
||||
}
|
||||
|
||||
.about-list__item {
|
||||
.about-content /deep/ li {
|
||||
position: relative;
|
||||
padding: 1.25rem 0 1.25rem;
|
||||
|
||||
|
|
@ -138,7 +137,11 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.background-overlay {
|
||||
.about-content /deep/ h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about-content /deep/ .background-overlay {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -6,13 +6,13 @@
|
|||
:image-urls="backgroundImageUrls"
|
||||
:active-index="activeIndex"
|
||||
>
|
||||
<div slot="overlay" class="background-tint background preloader-overlay"></div>
|
||||
<div slot="overlay" class="background-tint background-overlay"></div>
|
||||
</BackgroundImagePreloader>
|
||||
<BackgroundImageLoader v-else slot="background"
|
||||
class="background"
|
||||
:image-url="imageUrl"
|
||||
>
|
||||
<div slot="overlay" class="background-tint background preloader-overlay"></div>
|
||||
<div slot="overlay" class="background-tint background-overlay"></div>
|
||||
</BackgroundImageLoader>
|
||||
|
||||
<ul v-if="services.length > 0" class="services-list">
|
||||
|
|
@ -263,9 +263,5 @@ export default {
|
|||
color: $color__neutral-900;
|
||||
font-size: 2.0em;
|
||||
}
|
||||
|
||||
.preloader-overlay {
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 193 KiB |
Loading…
Reference in New Issue