Embed

<div style="font-family: Georgia, serif; background: #fff8f0; padding: 2rem; border-radius: 12px;">
  <h2 style="color: #78350f;">The Front Porch</h2>
  <p style="font-style: italic; color: #92400e;">What do you want to talk about? What is on your heart?</p>

  <form id="postForm" style="margin-top: 1rem;">
    <input type="text" id="author" placeholder="Your name..." style="width:100%; padding:8px; margin-bottom:8px;" />
    <input type="text" id="title" placeholder="Title..." style="width:100%; padding:8px; margin-bottom:8px;" />
    <textarea id="content" placeholder="Share your thoughts..." style="width:100%; padding:8px; height:100px;"></textarea>
    <button type="submit" style="margin-top:8px; background:#d97706; color:white; padding:8px 16px; border:none; border-radius:6px;">Post</button>
  </form>

  <div id="posts" style="margin-top:2rem;"></div>
</div>

<script>
  const form = document.getElementById('postForm');
  const postsDiv = document.getElementById('posts');
  let posts = JSON.parse(localStorage.getItem('porchPosts') || '[]');

  function renderPosts() {
    postsDiv.innerHTML = '';
    posts.forEach((post, index) => {
      const div = document.createElement('div');
      div.style = "background:#fff; padding:1rem; margin-bottom:1rem; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,0.1);";
      div.innerHTML = `<h3>${post.title}</h3><p>${post.content}</p><small>— ${post.author}</small><br><button onclick="deletePost(${index})" style="margin-top:8px; background:#f87171; color:white; border:none; padding:4px 8px; border-radius:4px;">Delete</button>`;
      postsDiv.appendChild(div);
    });
  }

  function deletePost(index) {
    posts.splice(index, 1);
    localStorage.setItem('porchPosts', JSON.stringify(posts));
    renderPosts();
  }

  form.onsubmit = (e) => {
    e.preventDefault();
    const author = document.getElementById('author').value.trim();
    const title = document.getElementById('title').value.trim();
    const content = document.getElementById('content').value.trim();
    if (author && title && content) {
      posts.unshift({ author, title, content });
      localStorage.setItem('porchPosts', JSON.stringify(posts));
      renderPosts();
      form.reset();
    }
  };

  renderPosts();
</script>



The Porch

The Front Porch
The front porch is a threshold place—neither inside nor outside, but somewhere in between. It’s where rocking chairs creak, silence lingers, and stories find room to breathe. The porchlight glows softly, not to dazzle but to guide, a beacon for those who need rest or companionship.
Here, presence matters more than answers. The porch is a space of spiritual hospitality, where honesty is welcome and resilience is honored. It’s a place to sit without hurry, to share the ache of disappointment and the grace that carries us through.
The front porch is not a stage or a pulpit—it’s a place of belonging. A place where healing is slow, but real. A place where you are invited to sit, to be seen, and to know you are not alone.
