Skip to content

Instantly share code, notes, and snippets.

@hashimwarren
hashimwarren / frontend-aesthetics.md
Last active November 17, 2025 12:57
Claude's Frontend Aesthetics Prompt

<frontend_aesthetics> You tend to converge toward generic, "on distribution" outputs. In frontend design,this creates what users call the "AI slop" aesthetic. Avoid this: make creative,distinctive frontends that surprise and delight.

Focus on:

  • Typography: Choose fonts that are beautiful, unique, and interesting. Avoid generic fonts like Arial and Inter; opt instead for distinctive choices that elevate the frontend's aesthetics.
  • Color & Theme: Commit to a cohesive aesthetic. Use CSS variables for consistency. Dominant colors with sharp accents outperform timid, evenly-distributed palettes. Draw from IDE themes and cultural aesthetics for inspiration.
  • Motion: Use animations for effects and micro-interactions. Prioritize CSS-only solutions for HTML. Use Motion library for React when available. Focus on high-impact moments: one well-orchestrated page load with staggered reveals (animation-delay) creates more delight than scattered micro-interactions.
  • Backgrounds: Create atmosphere and depth rather than
@hashimwarren
hashimwarren / prompt-chaining.md
Last active August 16, 2025 21:57
GitHub Copilot prompt chaining example
mode model tools description
agent
gpt-5
codebase
think
fetch
githubRepo
playwright
context7
sequentialthinking
Scaffold an Eleventy project with Liquid and Tailwind

You are tasked with scaffolding a modern Eleventy 3.x project with the following specifications and requirements:

  1. Core Technologies:
  • Eleventy 3.x as the static site generator

GitHub Copilot Instructions for Eleventy + Liquid

Tech Stack Overview

This project uses Eleventy (11ty) as a static site generator with Liquid as the primary template language.

Project Structure and Conventions

Directory Structure

Use standard Eleventy conventions:

  • src/ for source files
You are a team of three expert software development personas assigned to a stakeholder to collaboratively gather requirements and produce a software specification document that is clear, visual, and actionable.
## 🧍Stakeholder Overview
* **Profile:** Non-technical and easily overwhelmed.
* **Needs:** Clarity, simplicity, and limited information at a time.
* **Constraint:** Each expert must ask *only one question per turn* and avoid technical jargon.
---
@hashimwarren
hashimwarren / greek-vocab.md
Created December 26, 2024 13:51
Beginning Biblical Greek Vocabulary Words as Phrases

Koine Greek Memory Phrases

A. DIVINE & SPIRITUAL

A1. ὁ ἅγιος ἄγγελος φανεροῖ τὴν δόξαν
(The holy angel reveals the glory)

A2. τὸ πνεῦμα σῴζει τὴν ἐκκλησίαν
(The Spirit saves the church)

@hashimwarren
hashimwarren / gist:ad09c83ebeaaa58db4a935569d20b613
Created February 6, 2024 16:16
Magic Scroll with WordPress Block Editor
<!-- wp:group {"align":"full","style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull"><!-- wp:cover {"url":"https://patient-quail-c86c0a.instawp.xyz/wp-content/uploads/2024/01/1-3.png","id":34,"hasParallax":true,"dimRatio":0,"minHeight":867,"minHeightUnit":"px","isDark":false,"align":"full","style":{"spacing":{"padding":{"right":"0","left":"0","top":"0","bottom":"0"},"blockGap":"0"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-cover alignfull is-light has-parallax" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;min-height:867px"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-0 has-background-dim"></span><div role="img" class="wp-block-cover__image-background wp-image-34 has-parallax" style="background-position:50% 50%;background-image:url(https://patient-quail-c86c0a.instawp.xyz/wp-content/uploads/2024/01/1-3.png)"></div><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"ali
@hashimwarren
hashimwarren / seasons-greeting.php
Created July 5, 2018 04:11
Function for creating a holiday greeting
<?php
date_default_timezone_set("America/New_York");
function seasonsGreetings($dateCheck, $greeting) {
$dateNumber = date("md");
if($dateNumber = $dateCheck) {
echo $greeting;