continued cleanup and fleshing out content
This commit is contained in:
32
css/main.css
32
css/main.css
@ -44,6 +44,13 @@ main {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (min-width: 1800px) {
|
||||||
|
header,
|
||||||
|
main {
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#wip {
|
#wip {
|
||||||
background-color: light-dark(var(--color-dark), var(--color-light));
|
background-color: light-dark(var(--color-dark), var(--color-light));
|
||||||
color: light-dark(var(--color-light), var(--color-dark));
|
color: light-dark(var(--color-light), var(--color-dark));
|
||||||
@ -83,13 +90,15 @@ h2 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
color: light-dark(var(--color-dark), var(--color-light));
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
text-decoration: solid underline .25rem light-dark(var(--color-orange-dark), var(--color-orange-light));
|
text-decoration: solid underline .25rem light-dark(var(--color-orange-dark), var(--color-orange-light));
|
||||||
transition: text-decoration-thickness .5s;
|
transition: text-decoration-thickness .5s;
|
||||||
margin: 0 .25rem;
|
margin: 0 .25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
a:hover,
|
||||||
|
a:active {
|
||||||
text-decoration-thickness: .5rem;
|
text-decoration-thickness: .5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -100,12 +109,12 @@ a:focus {
|
|||||||
border-radius: .1rem;
|
border-radius: .1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content p {
|
main > p {
|
||||||
margin: .5rem 0 0 2.5rem;
|
margin: .5rem 0 0 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 650px) {
|
@media (max-width: 650px) {
|
||||||
#content p {
|
main > p {
|
||||||
margin-left: 1.25rem;
|
margin-left: 1.25rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -114,10 +123,9 @@ a:focus {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
}
|
row-gap: 2rem;
|
||||||
|
column-gap: 1rem;
|
||||||
.artist {
|
margin: 2rem 0;
|
||||||
margin: .5rem 0 0 1.25rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.artist img {
|
.artist img {
|
||||||
@ -136,8 +144,14 @@ a:focus {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.artist h3 {
|
.artist h3,
|
||||||
|
.artist p {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
margin-top: .25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artist h3 {
|
||||||
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
@ -165,6 +179,6 @@ footer a:focus {
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
gap: 1rem;
|
column-gap: 3rem;
|
||||||
margin: 0 0 1rem;
|
margin: 0 0 1rem;
|
||||||
}
|
}
|
||||||
|
|||||||
17
index.html
17
index.html
@ -21,8 +21,8 @@
|
|||||||
<header>
|
<header>
|
||||||
<div id="wip"><p>under construction! information is incomplete and may be incorrect</p></div>
|
<div id="wip"><p>under construction! information is incomplete and may be incorrect</p></div>
|
||||||
|
|
||||||
<img id="dark-logo" src="/img/dark-logo.png" alt="Linework icon depicting a sunrise or sunset with two clouds">
|
<img id="dark-logo" src="/img/dark-logo.png" alt="Linework icon depicting a sunrise or sunset with two clouds, in a blue and orange color scheme">
|
||||||
<img id="light-logo" src="/img/light-logo.png" alt="Linework icon depicting a sunrise or sunset with two clouds">
|
<img id="light-logo" src="/img/light-logo.png" alt="Linework icon depicting a sunrise or sunset with two clouds, in a blue and orange color scheme">
|
||||||
<h1>Solstice Market at the Beall Greenhouses</h1>
|
<h1>Solstice Market at the Beall Greenhouses</h1>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
@ -52,11 +52,15 @@
|
|||||||
<div class="artist">
|
<div class="artist">
|
||||||
<img src="/img/lee.jpg" alt="a block print in black ink on white paper depicting a grinning and very fat raccoon, waving one little paw">
|
<img src="/img/lee.jpg" alt="a block print in black ink on white paper depicting a grinning and very fat raccoon, waving one little paw">
|
||||||
<h3>Lee Cattarin</h3>
|
<h3>Lee Cattarin</h3>
|
||||||
|
<p>multidisciplinary artist and birder</p>
|
||||||
|
<p><a href="https://leecat.art">leecat.art</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="artist">
|
<div class="artist">
|
||||||
<img src="/img/greenhouse2.jpg" alt="a dilapidated greenhouse">
|
<img src="/img/greenhouse2.jpg" alt="a dilapidated greenhouse">
|
||||||
<h3>Brooke Osment</h3>
|
<h3>Brooke Osment</h3>
|
||||||
|
<p>found art jackets, fashion items, visible mending</p>
|
||||||
|
<p><a href="mailto:bsosment@gmail.com?subject=Beall%20Greenhouses%20Market">email Brooke</a></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
@ -64,15 +68,14 @@
|
|||||||
<footer>
|
<footer>
|
||||||
<div id="contacts">
|
<div id="contacts">
|
||||||
<p>
|
<p>
|
||||||
Website questions or feedback? Email
|
Website questions or feedback?
|
||||||
<a href="mailto:lee.cattarin@gmail.com?cc=montanahawke@gmail.com&subject=Beall%20Greenhouses%20Market">
|
<a href="mailto:lee.cattarin@gmail.com?cc=montanahawke@gmail.com&subject=Beall%20Greenhouses%20Market">
|
||||||
Lee
|
email Lee
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<p>|</p>
|
<p>Market questions?
|
||||||
<p>Market questions? Email
|
|
||||||
<a href="montanahawke@gmail.com?subject=Beall%20Greenhouses%20Market">
|
<a href="montanahawke@gmail.com?subject=Beall%20Greenhouses%20Market">
|
||||||
Hawke
|
email Hawke
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user