diff --git a/public/brush-stroke.jpg b/public/brush-stroke.jpg new file mode 100644 index 0000000..25616b9 Binary files /dev/null and b/public/brush-stroke.jpg differ diff --git a/public/favicon.svg b/public/favicon.svg index 733f4fb..a63e348 100644 --- a/public/favicon.svg +++ b/public/favicon.svg @@ -1,130 +1,203 @@ - - - - - image/svg+xml - - - - - - - - - - - - - - - - - - - - - - - - - - + + diff --git a/src/App.css b/src/App.css index 613607d..f4bb93a 100644 --- a/src/App.css +++ b/src/App.css @@ -5,23 +5,17 @@ text-align: center; } -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.solid:hover { - filter: drop-shadow(0 0 2em #61dafbaa); +#root::before { + z-index: -1; + content: ''; + position: absolute; + inset: 0; + background: gray; + mask-image: url('brush-stroke.jpg'); + mask-size: cover; + mask-repeat: no-repeat; } -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; +.prompt { + font-size: min(3rem, 10vmin); } diff --git a/src/App.tsx b/src/App.tsx index 24b5f67..0d4d364 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,34 +1,43 @@ -import { createSignal } from 'solid-js' -import solidLogo from './assets/solid.svg' -import appLogo from '/favicon.svg' -import PWABadge from './PWABadge.tsx' +import { createSignal, onMount } from 'solid-js' import './App.css' +import parts from './parts.json' +import PWABadge from './PWABadge' + +const pick = (source: string[]) => { + return source[Math.floor(source.length * Math.random())] +} + +const getPrompt = () => { + let prompt = "" + do { + prompt += pick(parts.adjective) + ' ' + } while (Math.random() > 0.8) + if (Math.random() > 0.5) { + prompt += pick(parts.mod) + ' ' + } + while (Math.random() > 0.75) { + prompt += pick(parts.animal) + '/' + } + prompt = prompt.slice(0, -1) + prompt += " " + pick(parts.jobs) + return prompt +} function App() { - const [count, setCount] = createSignal(0) + const [suggestion, setSuggestion] = createSignal("") + onMount(() => { + setSuggestion(getPrompt()) + }) return ( <> -
- - - - - - -
-

drawing-prompt

-
- -

- Edit src/App.tsx and save to test HMR -

-
-

- Click on the Vite and Solid logos to learn more -

+

Your Prompt:

+
{suggestion()}
+ ) diff --git a/src/PWABadge.module.css b/src/PWABadge.module.css index 0d4f9ae..aa0568f 100644 --- a/src/PWABadge.module.css +++ b/src/PWABadge.module.css @@ -20,7 +20,7 @@ .Message { margin-bottom: 8px; } -.Toast-button { +.ToastButton { border: 1px solid #8885; outline: none; margin-right: 5px; diff --git a/src/parts.json b/src/parts.json new file mode 100644 index 0000000..0d4f1ee --- /dev/null +++ b/src/parts.json @@ -0,0 +1,430 @@ +{ + "adjective": [ + "agreeable", + "aloof", + "ambitious", + "angry", + "animated", + "antagonistic", + "anxious", + "apprehensive", + "awestruck", + "belligerent", + "calm", + "carefree", + "caring", + "cheerful", + "combative", + "dark", + "defensive", + "dejected", + "eager", + "energetic", + "erratic", + "excited", + "fearful", + "festive", + "friendly", + "fun", + "gloomy", + "glum", + "grateful", + "gregarious", + "heartbroken", + "hopeful", + "hostile", + "idyllic", + "impatient", + "indignant", + "invigorated", + "lighthearted", + "lively", + "lonely", + "loving", + "melancholy", + "mischievous", + "miserable", + "mournful", + "mysterious", + "nervous", + "nostalgic", + "ominous", + "optimistic", + "outgoing", + "overwhelmed", + "passionate", + "peaceful", + "perky", + "pessimistic", + "playful", + "realistic", + "reflective", + "resentful", + "restless", + "romantic", + "sad", + "sentimental", + "serious", + "shy", + "silly", + "solemn", + "strange", + "tender", + "tense", + "thankful", + "transcendent", + "unaffected", + "uneasy", + "unfriendly", + "unstable", + "unsteady", + "vivacious", + "wretched" + ], + "mod": [ + "plush", + "robot", + "vampire", + "zombie", + "wooden", + "virtual", + "military", + "aquatic", + "ancient", + "future", + "super" + ], + "animal": [ + "albatross", + "alligator", + "antelope", + "arctic", + "armadillo", + "baboon", + "badger", + "bat", + "beagle", + "bear", + "beaver", + "bison", + "blue whale", + "boar", + "brill", + "buffalo", + "bull", + "camel", + "capybara", + "carp", + "cat", + "chameleon", + "cheetah", + "chihuahua", + "chimpanzee", + "chinchillas", + "cobra", + "cow", + "crab", + "crocodile", + "crow", + "deer", + "dodo", + "dog", + "dolphin", + "donkey", + "duck", + "eagle", + "eel", + "elephant", + "elk", + "emu", + "fish", + "flamingo", + "fox", + "frog", + "frog", + "giant", + "giraffe", + "goat", + "goose", + "gorilla", + "haddock", + "hammerhead", + "hamster", + "hare", + "hawk", + "hedgehog", + "hen", + "hermit", + "herring", + "hippopotamus", + "horse", + "ibex", + "iguana", + "jackal", + "jaguar", + "jellyfish", + "kangaroo", + "koala", + "lemur", + "leopard", + "lion", + "lizard", + "llama", + "lynx", + "mammoth", + "meerkat", + "mole", + "monkey", + "mouse", + "mule", + "newt", + "orangutan", + "ostrich", + "otter", + "owl", + "panda", + "panther", + "peacock", + "pigeon", + "pike", + "porcupine", + "possum", + "pufferfish", + "rabbit", + "racoon", + "rat", + "rhinoceros", + "salamander", + "salmon", + "sardines", + "shark", + "sheep", + "sloth", + "snake", + "squirrel", + "swan", + "tiger", + "toad", + "tortoise", + "tuna", + "turtle", + "vulture", + "whale", + "wolf", + "wombat", + "zebra" + ], + "jobs": [ + "accountant", + "actor", + "actuary", + "administrator", + "advertising manager", + "aerospace engineer", + "agent", + "agricultural engineer", + "air traffic controller", + "anthropologist", + "archeologist", + "architect", + "art director", + "astronomer", + "athlete", + "auditor", + "baker", + "banking analyst", + "barista", + "bartender", + "bioinformatics scientist", + "biologist", + "biomedical engineer", + "blacksmiths", + "board member", + "broker", + "business analyst", + "buyer", + "naval captain", + "carpenter", + "cashier", + "chef", + "chemical engineer", + "chemist", + "chief executive", + "childcare worker", + "choreographer", + "civil engineer", + "cleaner", + "clergy", + "compliance manager", + "computer scientist", + "concierge", + "conservation worker", + "construction manager", + "construction worker", + "consultant", + "cook", + "copywriter", + "cosmetologist", + "courier", + "craftsperson", + "curator", + "customer experience designer", + "customer service", + "data analyst", + "data architect", + "data scientist", + "database administrator", + "dental assistant", + "dentist", + "development manager", + "director", + "ecommerce seller", + "economist", + "electrical engineer", + "electrician", + "emergency medical technician", + "energy engineer", + "engineer", + "entrepreneur", + "environmental engineer", + "environmental science", + "epidemiologist", + "equipment operator", + "event planner", + "executive management", + "farmer", + "fashion designer", + "financial analyst", + "financial controller", + "financial manager", + "firefighter", + "fishery worker", + "fitness trainer", + "flight attendant", + "floral designer", + "forestry worker", + "funeral attendant", + "game designer", + "gardener", + "general manager", + "geographer", + "government worker", + "hair stylist", + "health educator", + "homemaker", + "hotel manager", + "human resources", + "import/export specialist", + "industrial designer", + "information designer", + "information scientist", + "information technology manager", + "installation & maintenance worker", + "interpreter", + "journalist", + "laboratory technician", + "laborer", + "landscape architect", + "landscaping", + "lawyer", + "legal secretary", + "librarian", + "lifeguard", + "logistics engineer", + "management consultant", + "manicurist", + "manufacturing engineer", + "manufacturing worker", + "marketing analyst", + "marketing manager", + "mathematician", + "mechanical engineer", + "medical administrator", + "medical assistant", + "medical technician", + "medical technologist", + "mental health counselor", + "midwife", + "miner", + "musician", + "nanny", + "network administrator", + "nurse", + "occupational health & safety specialist", + "occupational therapist", + "office clerk", + "operations analyst", + "operations manager", + "optometrist", + "performance artist", + "personal care aid", + "pharmacist", + "photographer", + "physician", + "physicist", + "pilot", + "plumber", + "police officer", + "politician", + "producer", + "product designer", + "production manager", + "professor", + "program manager", + "project manager", + "promotion manager", + "property manager", + "public relations", + "purchasing manager", + "quality assurance manager", + "quality control analyst", + "railroad engineer", + "reporter", + "researcher", + "restaurant manager", + "rigger", + "robotics engineer", + "sales engineer", + "sales manager", + "salesperson", + "scientist", + "service attendant", + "service manager", + "shop salesperson", + "small business owner", + "social worker", + "sociologist", + "software architect", + "software developer", + "solar energy technician", + "space scientist", + "statistician", + "steel worker", + "stonemason", + "supervisor", + "surgeon", + "surveyor", + "system administrator", + "systems analyst", + "tailor", + "teacher", + "technical support", + "technical writer", + "technician", + "technology architect", + "testing engineer", + "tour guide", + "translator", + "transportation engineer", + "truck driver", + "tutor", + "urban designer", + "veterinarian", + "visual designer", + "waiter", + "web developer", + "wind energy engineer", + "writer", + "zoologist" + ] +}