This commit is contained in:
2026-04-01 13:47:53 -07:00
parent 88ebb54f1c
commit 8532ba1ad9
11 changed files with 1160 additions and 457 deletions

View File

@ -0,0 +1,680 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Beltaine Market at the Beall Greenhouses | the historic Beall Greenhouses</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<!-- Meta -->
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="canonical" href="/">
<meta name="description" content="the historic Beall Greenhouses">
<meta name="robots" content="index,follow">
<meta property="og:title" content="Beltaine Market at the Beall Greenhouses | the historic Beall Greenhouses">
<meta property="og:type" content="article">
<meta property="og:url" content="/">
<meta property="og:description" content="the historic Beall Greenhouses">
<meta property="og:image" content="/assets/img/logo.jpg">
<meta property="og:image:alt" content="block print in black and orange of a rufous hummingbird in flight with tail flared. the hummingbird holds a banner that reads 'become ungovernable.'">
<meta name="generator" content="Eleventy v3.1.5">
<!-- CSS -->
<style>.artist {
width: 100%;
margin: 2rem 0;
display: grid;
scroll-margin-top: 1rem;
}
.artist:nth-child(odd) {
grid-template:
'imgs h3'
'imgs desc'
'imgs .';
grid-template-columns: 45% auto;
}
.artist:nth-child(even) {
grid-template:
'h3 imgs'
'desc imgs'
'. imgs';
grid-template-columns: auto 45%;
}
@media (max-width: 950px) {
.artist:nth-child(n) {
grid-template:
'imgs'
'h3'
'desc';
}
}
.fit-contain {
object-fit: contain;
grid-area: imgs;
}
.artist img {
max-height: 100%;
max-width: 100%;
border-radius: 1rem;
}
@media (max-width: 950px) {
.artist img {
border-radius: 1rem 1rem 0 0;
border-bottom: .25rem solid var(--color-accent);
}
}
.artist h3 {
grid-area: h3;
text-transform: uppercase;
line-height: 2rem;
}
.artist:nth-child(odd) h3 {
padding-left: .5rem;
}
.artist:nth-child(even) h3 {
padding-right: .5rem;
text-align: right;
}
@media (max-width: 1050px) {
.artist:nth-child(n) h3 {
padding: 0;
}
}
.description {
grid-area: desc;
background-color: var(--color-bg-alt);
border-radius: 0 0 1rem 1rem;
}
.artist:nth-child(odd) .description {
margin-left: 1.75rem;
}
.artist:nth-child(even) .description {
margin-right: 1.75rem;
}
@media (max-width: 950px) {
.artist:nth-child(odd) .description,
.artist:nth-child(even) .description {
margin: 0;
}
}
.description ul {
text-align: center;
list-style: none;
padding: 0 0 1rem;
}
.description ul li {
margin: 0;
}
:root {
color-scheme: light dark;
--color-concrete: #e5e0c7;
--color-concrete-alt: #d1cbab;
--color-green: #142b15;
--color-green-alt: #1a3b1b;
--color-teal-light: #4ba19e;
--color-teal-dark: #0c6a74;
--color-bg: light-dark(var(--color-concrete), var(--color-green));
--color-text: light-dark(var(--color-green), var(--color-concrete));
--color-bg-alt: light-dark(var(--color-concrete-alt), var(--color-green-alt));
--color-text-alt: light-dark(var(--color-green-alt), var(--color-concrete-alt));
--color-accent: light-dark(var(--color-teal-dark), var(--color-teal-light));
--color-accent-flipped: light-dark(var(--color-teal-light), var(--color-teal-dark));
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
background-color: var(--color-text);
color: var(--color-bg);
display: flex;
flex-direction: column;
font-family: Arial, Helvetica, sans-serif;
min-height: 100vh;
}
#content {
background-color: var(--color-bg);
color: var(--color-text);
width: 100%;
flex-grow: 1;
border-radius: 0 0 2rem 2rem;
padding: 1rem 0 2rem;
}
@media (prefers-color-scheme: light) {
.dark-mode {
display: none;
}
}
@media (prefers-color-scheme: dark) {
.light-mode {
display: none;
}
}
header,
main {
width: 65%;
margin: 0 auto 1rem;
}
@media (max-width: 750px) {
header,
main {
width: 92%;
}
}
@media (min-width: 2000px) {
header,
main {
width: 45%;
}
}
img {
display: block;
max-width: 100%;
height: auto;
}
h1, h2, h3, h4, h5, h6 {
color: var(--color-text-alt);
}
h1,
h2 {
font-family: 'Bellota', Arial, Helvetica, sans-serif;
}
h1 {
text-align: center;
margin: 2rem 0;
font-size: 2.2rem;
}
h2 {
margin: 2rem 0 0;
font-size: 1.65rem;
}
h2,
h3 {
border-bottom: .25rem solid var(--color-accent);
}
a {
color: var(--color-text);
font-weight: bold;
text-decoration: underline;
text-decoration-style: solid;
text-decoration-thickness: .25rem;
text-decoration-color: var(--color-accent);
transition: text-decoration-thickness .5s;
border-radius: .1rem;
outline-offset: .1rem;
}
a:hover,
a:active {
text-decoration-thickness: .5rem;
}
a:focus-visible {
text-decoration: none;
outline: solid .25rem var(--color-accent);
}
main p,
main ul {
padding: .8rem;
line-height: 1.5rem;
}
main li {
margin-left: 1rem;
}
main li:not(:last-child) {
padding: 0 0 .5rem;
}
/* styles for sets of <p>s under an h2/3/etc vs alone
this is done as a class rather than just h2 + p to accomodate
for multi-<p> segments which can then be wrapped in <div>s */
.under-header,
.no-header {
background-color: var(--color-bg-alt);
}
.under-header {
border-radius: 0 0 1rem 1rem;
margin-left: 2.5rem;
}
@media (max-width: 750px) {
.under-header {
margin-left: 1.25rem;
}
}
.no-header {
border-radius: 1rem;
}
.two-col {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
.two-col > * {
place-self: start center;
}
@media (max-width: 950px) {
.two-col {
grid-template-columns: 1fr;
}
}
/* top nav */
nav {
position: relative;
margin: 0 auto 1.5rem;
display: grid;
grid-template: "logo nav";
grid-template-rows: 7rem;
grid-template-columns: 7rem auto;
background-image: url("/greenhouse.jpg");
background-size: cover;
background-repeat: no-repeat;
border-radius: 2rem .25rem .25rem 2rem;
}
nav a {
margin: 0;
}
nav a:not(:has(img)) {
display: inline-block;
text-decoration: none;
font-size: 1.2rem;
padding: 0 .25rem;
border: solid .125rem var(--color-accent);
border-radius: .25rem;
background-color: var(--color-bg);
}
@media (any-hover: hover) {
nav a:not(:has(img)):hover {
color: var(--color-bg);
background-color: var(--color-text-alt);
border-color: var(--color-accent-flipped);
outline: .125rem solid var(--color-accent);
outline-offset: 0;
}
}
nav a:not(:has(img)):focus-visible {
outline: solid .125rem var(--color-accent);
outline-offset: .125rem;
}
#skip {
left: -999px;
position: absolute;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
z-index: -99;
}
#skip:focus-visible {
left: -6rem;
width: auto;
height: auto;
overflow: auto;
z-index: 999;
}
@media (max-width: 750px) {
#skip:focus-visible {
left: 5rem;
}
}
nav img {
max-height: 100%;
margin: 0;
border-radius: 2rem;
border: .2rem solid var(--color-accent);
}
@media (any-hover: hover) {
nav img:hover {
border-color: var(--color-accent-flipped);
outline-offset: 0;
outline: .2rem solid var(--color-accent);
}
}
nav a:has(img) {
grid-area: logo;
justify-self: start;
}
nav a:has(img):focus-visible {
border-radius: 2rem;
outline-offset: .2rem;
outline: .2rem solid var(--color-accent);
}
nav a:has(img):focus-visible img {
outline: none;
}
nav ul {
grid-area: nav;
display: flex;
justify-content: space-between;
align-items: flex-end;
flex-flow: column nowrap;
}
nav li {
list-style: none;
}
/* footer */
footer {
width: 95%;
margin: 0 auto;
padding: 1rem 0;
display: flex;
justify-content: center;
}
@media (max-width: 750px) {
footer {
flex-flow: column;
}
}
footer p {
background-color: var(--color-text);
color: var(--color-bg);
text-align: center;
font-size: .9rem;
padding: .25rem;
}
@media (min-width: 751px) {
footer p:nth-child(2)::before {
content: "● " / "";
}
footer p:nth-child(2)::after {
content: " ●" / "";
}
}
footer a {
color: var(--color-bg);
text-decoration-color: var(--color-accent-flipped);
}
footer a:focus-visible {
outline-color: var(--color-accent-flipped);
}</style>
<!-- JS -->
<script type="module"></script>
<!-- Font -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Bellota:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" rel="stylesheet">
</head>
<body>
<div id="content">
<header>
<nav title="background image shows the peak of a dilapidated greenhouse in black and white">
<a href="#main" title="skip to main content" aria-label="skip to main content" id="skip">
skip ↷</a>
<a href="/" aria-label="Beall Greenhouses home" title="Beall Greenhouses home">
<img src="/img/pZQvBRGd3A-500.jpeg" alt="block print in black and orange of a rufous hummingbird in flight with tail flared. the hummingbird holds a banner that reads 'become ungovernable.'" loading="lazy" decoding="async" width="500" height="500">
</a>
<ul>
<li>
<a href="/about/" title="About the Beall Greenhouses">
ⓘ about
</a>
</li>
<li>
<a href="/events/" title="Events at the Beall Greenhouses">
🗓 events
</a>
</li>
<li>
<a href="/artists/" title="Artists in residence at the Beall Greenhouses">
🖌 artists
</a>
</li>
</ul>
</nav>
</header>
<main id="main">
<h1>Beltaine Market at the Beall Greenhouses</h1>
<div class="no-header">
<p>
Our Beltaine Market will be on
<time datetime="2026-05-02 10:00">Saturday, May 2nd, 2026, 10:00am to 5:00pm</time>.
</p>
<p>
Find us in studios in the former cold storage facility at the old Beall
Greenhouses — <a href="https://maps.app.goo.gl/5p1NAArdjX4vaEgw9" target="_blank">18527 Beall Rd SW, Vashon, WA 98070</a>.
</p>
</div>
<h2>Artists and vendors</h2>
<ul id="artists">
<li id="jennifer-hawke" class="artist">
<div class="fit-contain">
<img src="/img/ma-EzXvTaO-1252.jpeg" alt="a 5 picture collage. Image 1 is A green feather emerging from cracked earth, curled in a spiral. Image 2 is Two crane figures with their beaks meeting in the middle where a large circle is suspended in the air. The sky behind it is stormy and full of clouds. The hill they are standing on has a large crack running down the center, with ancient carved stone animal heads around the crack. Image 3 is A vintage map of the Bremerton area. Super imposed throughout the map is a sacred geometry pattern called the Flower of Life. A red Octopus is emerging from the pattern. Image 4 is A bear curled up in a ball with its paw over its eyes. The ground is covered in snow and there are bird tracks in between stones poking out. In the sky above, there is a comet amongst the stars. Image 5 is A vintage map of the Bremerton area. Super imposed throughout the map is a sacred geometry pattern called the Flower of Life. A Dungeness crab is emerging from the pattern." loading="lazy" decoding="async" width="1252" height="1667">
</div>
<h3>Jennifer Hawke</h3>
<div class="description">
<p>Jennifer Hawke came to Vashon Island about 20 years ago from Billings, Montana.</p>
<p>Hawke has a studio at the Beall Greenhouses, and has participated in the Vashon Studio Tour for the last four seasons. They also paint large Sacred Geometry installations on the road during the First Friday Art Walks in the summer months.</p>
<p>Hawke has a degree in Painting and Cast Metals from Montana State University, but they work in many different mediums. Their primary studio work is assemblage using vintage detritus and beach trash.</p>
<p>You may also know Hawke through the Bearded Lady Road Reports, a live broadcast on Facebook dedicated to reporting on road conditions during inclement weather.</p>
<ul>
<li>
<a href="https://www.instagram.com/jenniferhawkestudio" target="_blank">
jenniferhawkestudio on instagram
</a>
</li>
<li>
<a href="https://www.facebook.com/pugetsoundgypsy" target="_blank">
Jennifer Hawke on facebook
</a>
</li>
<li>
<a href="https://www.instagram.com/montana_hawke" target="_blank">
montana_hawke on instagram
</a>
</li>
</ul>
</div>
</li>
<li id="brooke-osment" class="artist">
<div class="fit-contain">
<img src="/img/eagtgkdR5T-3000.jpeg" alt="undefined Image 1 is a triptych of photos of the artist wearing jackets of her own creation. the first jacket is orange and teal wool with a stag graphic appliqued onto the back panel. the second jacket is a woody green leather jacket with fur collar accent, snap epaulettes, and a front lapel detail created from colorful angular leather scraps. the third is a white denim jacket with a central linocut patch stitched in place with intricate topwork and embroidery. pink silk accents, flower details, and direct print work frame the central piece." loading="lazy" decoding="async" width="3000" height="2000">
</div>
<h3>Brooke Osment</h3>
<div class="description">
<p>found art jackets, stitchwork, visible mending</p>
<ul>
<li>
<a href="mailto:bsosment@gmail.com?subject=Beall%20Greenhouses%20Market" target="_blank">
email Brooke
</a>
</li>
</ul>
</div>
</li>
<li id="lee-cattarin" class="artist">
<div class="fit-contain">
<img src="/img/E8IRO5B56Z-2000.jpeg" alt="undefined Image 1 is a four picture collage. two pictures show lee, a white person with curly hair and glasses; in one picture, wearing a colorful knit shawl. the other two frames show lee&#39;s work. 1, two leather card wallets with an elegant swoop on the back in vivid colors of leather; 2, a pile of greeting cards with a block-printed loon spread across front and back of the cards." loading="lazy" decoding="async" width="2000" height="2000">
</div>
<h3>Lee Cattarin</h3>
<div class="description">
<p>multidisciplinary artist and birder</p>
<ul>
<li>
<a href="https://leecat.art" target="_blank">
leecat.art
</a>
</li>
</ul>
</div>
</li>
<li id="gabrielle-wildheart" class="artist">
<div class="fit-contain">
<img src="/img/zopIASfYt0-1200.jpeg" alt="a 4 picture collage. Image 1 is Kundalini Yoniflower Image 2 is Yoniflower Watercolor Image 3 is Aphrodite&#39;s Rose Image 4 is Wild Grandmother" loading="lazy" decoding="async" width="1200" height="1109">
</div>
<h3>Gabrielle Wildheart</h3>
<div class="description">
<p>Gabrielle Wildheart is an interdisciplinary artist, muralist, and ceremonial guide based in the Pacific Northwest. Her work moves between intimate studio painting and large-scale public art. She is known for her surrealistic style, blending traditional craftsmanship with mythic subjects. Her imagery encourages care for the Earth and devotion to the sacredness of life.</p>
<p>Gabrielle is offering prints of her original paintings.</p>
<ul>
<li>
<a href="https://www.gabriellewildheart.com" target="_blank">
gabriellewildheart.com
</a>
</li>
<li>
<a href="mailto:love@gabriellewildheart.com?subject=Beall%20Greenhouses%20Market" target="_blank">
email Gabrielle
</a>
</li>
<li>
<a href="https://www.instagram.com/gabriellewildheart" target="_blank">
gabriellewildheart on instagram
</a>
</li>
</ul>
</div>
</li>
</ul>
</main>
</div>
<footer>
<p>questions?
<a href="mailto:beall.greenhouses@gmail.com">email us!</a>
</p>
<p>brought to you in 2026</p>
<p><a href="/attribution/">site attribution</a></p>
</footer>
<!-- This page `/events/2026-beltaine/` was built on 2026-04-01T20:47:34.573Z -->
</body>
</html>