rosy/244fdd3b-9edb-4e80-864b-de7399c0350e
1
0
Fork 0
generated from mountainridge-xyz/vite-webapp
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
rosy
2026-05-06 11:57:15 +00:00
commit 0b8205f247
9 changed files with 616 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.agentsignore
+4
View File
@@ -0,0 +1,4 @@
package-lock.json
/node_modules
/target
/dist
.gitignore
+277
View File
@@ -0,0 +1,277 @@
/target
### JetBrains template
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
# User-specific stuff
.idea/**/workspace.xml
.idea/**/tasks.xml
.idea/**/usage.statistics.xml
.idea/**/dictionaries
.idea/**/shelf
# AWS User-specific
.idea/**/aws.xml
# Generated files
.idea/**/contentModel.xml
# Sensitive or high-churn files
.idea/**/dataSources/
.idea/**/dataSources.ids
.idea/**/dataSources.local.xml
.idea/**/sqlDataSources.xml
.idea/**/dynamic.xml
.idea/**/uiDesigner.xml
.idea/**/dbnavigator.xml
# Gradle
.idea/**/gradle.xml
.idea/**/libraries
# Gradle and Maven with auto-import
# When using Gradle or Maven with auto-import, you should exclude module files,
# since they will be recreated, and may cause churn. Uncomment if using
# auto-import.
# .idea/artifacts
# .idea/compiler.xml
# .idea/jarRepositories.xml
# .idea/modules.xml
# .idea/*.iml
# .idea/modules
# *.iml
# *.ipr
# CMake
cmake-build-*/
# Mongo Explorer plugin
.idea/**/mongoSettings.xml
# File-based project format
*.iws
# IntelliJ
out/
# mpeltonen/sbt-idea plugin
.idea_modules/
# JIRA plugin
atlassian-ide-plugin.xml
# Cursive Clojure plugin
.idea/replstate.xml
# SonarLint plugin
.idea/sonarlint/
# Crashlytics plugin (for Android Studio and IntelliJ)
com_crashlytics_export_strings.xml
crashlytics.properties
crashlytics-build.properties
fabric.properties
# Editor-based Rest Client
.idea/httpRequests
# Android studio 3.1+ serialized cache file
.idea/caches/build_file_checksums.ser
### Rust template
# Generated by Cargo
# will have compiled files and executables
debug/
target/
# Remove Cargo.lock from gitignore if creating an executable, leave it for libraries
# More information here https://doc.rust-lang.org/cargo/guide/cargo-toml-vs-cargo-lock.html
Cargo.lock
# These are backup files generated by rustfmt
**/*.rs.bk
# MSVC Windows builds of rustc generate these, which store debugging information
*.pdb
# RustRover
# JetBrains specific template is maintained in a separate JetBrains.gitignore that can
# be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
# and can be added to the global gitignore or merged into this file. For a more nuclear
# option (not recommended) you can uncomment the following to ignore the entire idea folder.
#.idea/
### Linux template
*~
# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*
# KDE directory preferences
.directory
# Linux trash folder which might appear on any partition or disk
.Trash-*
# .nfs files are created when an open file is removed but is still being accessed
.nfs*
### Node template
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
.cache
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
### macOS template
# General
.DS_Store
.AppleDouble
.LSOverride
# Icon must end with two \r
Icon
# Thumbnails
._*
# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent
# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk
agent.md
+45
View File
@@ -0,0 +1,45 @@
# Mountainridge Craft Webapp – AI Coding Agent Instructions
**Purpose**
This is the **single source of truth**.
Every AI coding agent **must** follow these rules exactly.
Any deviation breaks the template contract.
## Core Overview
- HTML, Tailwind CSS, and Vanilla JS **CSR-only** responsive website
- Styling: **Standalone TailwindCSS** + **DaisyUI** components (no `tailwind.config.js`)
- Corporate theme: **"mountainridge"** (locked in `styles.css`)
## Agent Tool Usage (Mandatory)
All agents have the following **injected tools** and **must** use them exclusively:
- `craft_build` – full build / serve / watch / desktop package (Cargo + Trunk + Tauri)
- `craft_git_commit` and `craft_git_push` - Git commit & push all or specific set of files
- `craft_create_issie` - create issues for the craft in the repo
**Never** execute raw shell commands (`npm`, `vite`, `git`, etc.).
All build and git operations are fully wrapped — repo details are irrelevant.
## Project Structure & Immutable Rules
| Path | Purpose | Modification Rules |
|--------------------|--------------------------------------------------------|---------------------------------------------------------------------|
| `./assets/` | Extra CSS, fonts, images, static assets | Add only |
| `./src/main.js` | Entrypoint for the webapp and vite. | Make sure it is always compabatible with `vite build` |
| `./src/styles.css` | Global stylesheet + full "mountainridge" DaisyUI theme | Extend only – never overwrite theme block |
| `./index.html` | HTML entry point | **Immutable section** (see below) – only meta/title changes allowed |
## Immutable / Protected Elements (Never Change)
**`./index.html`** – these exact lines **must remain untouched** (required for vite.js):
```html
<link rel="stylesheet" href="/src/styles.css">
<script type="module" src="/src/main.js"></script>
```
**`./src/styles.css`** – never delete or replace the `"daisyui/theme"` block.
assets/mridge-craft-icon.webp
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 117 KiB

index.html
+14
View File
@@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en" data-theme="mountainridge">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>MountainRidge.xyz - Mini App</title>
<link rel="stylesheet" href="/src/styles.css">
<script type="module" src="/src/main.js"></script>
</head>
<body class="flex w-1 h-1">
<h1>Hello world</h1>
</body>
</html>
package.json
+13
View File
@@ -0,0 +1,13 @@
{
"dependencies": {
"daisyui": "^5.5.18"
},
"scripts": {
"build-craft": "npm install && vite build"
},
"devDependencies": {
"vite": "^7.3.1",
"tailwindcss": "^4.2.1",
"@tailwindcss/vite": "^4.2.1"
}
}
src/main.js
View File
src/styles.css
+252
View File
@@ -0,0 +1,252 @@
@import "tailwindcss";
@plugin "daisyui" {
themes: mountainridge --default;
darkTheme: mountainridge;
base: true;
styled: true;
utils: true;
logs: false;
}
@plugin "daisyui/theme" {
name: "mountainridge";
default: true;
prefersdark: true;
color-scheme: "dark";
font-family: "Geist", system-ui, sans-serif;
/* Backgrounds — charcoal scale */
--color-base-100: oklch(16% 0.02 214);
--color-base-200: oklch(13% 0.02 214);
--color-base-300: oklch(10% 0.02 214);
--color-base-content: oklch(92% 0.005 214);
/* Primary — sea-grass green rgb(88, 191, 177) */
--color-primary: oklch(72% 0.097 183);
--color-primary-content: oklch(13% 0.02 214);
/* Secondary — glacier light blue rgb(94, 150, 159) */
--color-secondary: oklch(60% 0.055 205);
--color-secondary-content: oklch(13% 0.02 214);
/* Accent — flamingo pink rgba(253, 117, 127) */
--color-accent: oklch(72% 0.155 14); /* flamingo pink */
--color-accent-content: oklch(13% 0.02 214);
/* Neutral — charcoal slate */
--color-neutral: oklch(28% 0.02 214);
--color-neutral-content: oklch(80% 0.01 214);
/* Semantic */
--color-info: oklch(60% 0.055 205);
--color-info-content: oklch(13% 0.02 214);
--color-success: oklch(72% 0.097 183);
--color-success-content: oklch(13% 0.02 214);
--color-warning: oklch(68% 0.16 42); /* alpenglow orange */
--color-warning-content: oklch(13% 0.02 214);
--color-error: oklch(72% 0.155 14); /* flamingo pink */
--color-error-content: oklch(13% 0.02 214);
/* Shape */
--radius-selector: 1.5rem;
--radius-field: 0.48rem;
--radius-box: 0.48rem;
--size-selector: 0.25rem;
--size-field: 0.25rem;
--border: 1px;
--depth: 1;
--noise: 0;
}
:root {
all: inherit;
color: var(--color-base-content); /* DaisyUI's base text color */
font-family: 'Geist', Sans, serif;
/* creating the perfect shadow according to twitter/X
- https://codepen.io/jh3y/pen/yLWgjpd
- https://x.com/jh3yy/status/1796208073830232574
*/
--tint: 214;
--alpha: 4;
--base: hsl(var(--tint, 214) 80% 27% / calc(var(--alpha, 4) * 1%));
--shade: hsl(from var(--base) calc(h + 8) 25 calc(l - 5));
--perfect-shadow: 0 0 0 1px var(--base),
0 1px 1px -0.5px var(--shade),
0 3px 3px -1.5px var(--shade),
0 6px 6px -3px var(--shade),
0 12px 12px -6px var(--base),
0 24px 24px -12px var(--base);
--shade-active: hsla(173, 41%, 53%, 0.66);
--base-active: hsl(var(--tint, 214) 80% 27% / calc(var(--alpha, 4) * 1%));
--perfect-shadow-active: 0 0 0 1px var(--base-active),
0 1px 1px -0.5px var(--shade-active),
0 3px 3px -1.5px var(--shade-active),
0 6px 6px -3px var(--shade-active),
0 12px 12px -6px var(--base-active),
0 24px 24px -12px var(--base-active);
--perfect-shadow-thin-active: 0 0 0 1px var(--base-active),
0 1px 2px -0.5px var(--shade-active),
0 2px 4px -1px var(--shade-active),
0 4px 8px -2px var(--shade-active);
--shade-active-warn: rgba(253, 117, 127, 0.66);
--perfect-shadow-warn: 0 0 0 1px var(--shade-active-warn),
0 1px 1px -0.5px var(--shade-active-warn),
0 3px 3px -1.5px var(--shade-active-warn),
0 6px 6px -3px var(--shade-active-warn),
0 12px 12px -6px var(--base-active),
0 24px 24px -12px var(--base-active);
--base-thin: hsl(var(--tint, 214) 80% 27% / calc(var(--alpha, 4) * 1%));
--shade-thin: hsl(from var(--base-thin) calc(h + 8) 25 calc(l - 5));
--perfect-shadow-thin: 0 0 0 1px var(--base-thin),
0 1px 2px -0.5px var(--shade-thin),
0 3px 6px -1px var(--shade-thin);
--perfect-shadow-light: 0px 6px 20px -4px rgba(0, 0, 0, 0.40), 0px 0px 30px -8px rgba(123, 94, 248, 0.10);
/* === DARK BACKGROUND SHADOWS === */
/* Tinted with glacier blue for atmosphere */
--tint-dark: 205;
--alpha-dark: 30;
--base-dark: hsl(var(--tint-dark) 60% 60% / calc(var(--alpha-dark) * 1%));
--shade-dark: hsl(from var(--base-dark) calc(h + 8) 70 calc(l + 10));
/* Full shadow — for cards, modals, elevated surfaces */
--perfect-shadow-dark: 0 0 0 1px hsl(205 40% 50% / 15%),
0 1px 1px -0.5px var(--base-dark),
0 3px 3px -1.5px var(--base-dark),
0 6px 6px -3px var(--shade-dark),
0 12px 12px -6px var(--shade-dark),
0 24px 24px -12px var(--base-dark);
/* Thin shadow — for buttons, inputs, small elements */
--perfect-shadow-thin-dark: 0 0 0 1px hsl(205 40% 50% / 12%),
0 1px 2px -0.5px var(--base-dark),
0 3px 6px -1px var(--shade-dark);
/* Active/focus state — sea-grass green glow */
--shade-active-dark: hsla(183, 35%, 55%, 0.45); /* sea-grass green */
--perfect-shadow-thin-active-dark: 0 0 0 1px hsla(183, 35%, 55%, 0.3),
0 1px 2px -0.5px var(--shade-active-dark),
0 2px 4px -1px var(--shade-active-dark),
0 4px 8px -2px var(--shade-active-dark);
/* Warning/error active state — flamingo pink glow */
--shade-active-warn-dark: rgba(253, 117, 127, 0.45);
--perfect-shadow-warn-dark: 0 0 0 1px rgba(253, 117, 127, 0.3),
0 1px 1px -0.5px var(--shade-active-warn-dark),
0 3px 3px -1.5px var(--shade-active-warn-dark),
0 6px 6px -3px var(--shade-active-warn-dark),
0 12px 12px -6px var(--shade-active-warn-dark);
--mountain-white-dark: rgb(245, 242, 242); /* ≈ 80% – popular "dark mode off-white" */
--mountain-white: rgb(255, 252, 252, 1);
--ghost-white: rgb(248, 248, 255, 1);
/* Very subtle darkening – still very bright */
--mountain-white-darker-1: rgb(245, 242, 242); /* ≈ 96% brightness */
--mountain-white-darker-2: rgb(235, 232, 232); /* ≈ 92% */
/* Noticeably darker but still clearly a very light / "off-white" */
--mountain-white-darker-3: rgb(230, 227, 227); /* ≈ 90% */
--mountain-white-darker-4: rgb(220, 217, 217); /* ≈ 86% */
--mountain-white-darker-5: rgb(204, 201, 201); /* ≈ 80% – popular "dark mode off-white" */
/* Deeper / moodier off-whites – start feeling more greyish */
--mountain-white-darker-6: rgb(189, 186, 186); /* ≈ 74% */
--mountain-white-darker-7: rgb(170, 167, 167); /* ≈ 67% – quite smoky now */
--mountain-white-darker-8: rgb(150, 147, 147); /* ≈ 59% – very muted/dark off-white */
--charcoal-deep: rgb(15, 20, 25);
--charcoal-dark: rgb(25, 30, 35); /* +10 */
--charcoal-medium: rgb(35, 40, 48); /* +20ish */
--charcoal-soft: rgb(45, 50, 58); /* noticeably lighter but still moody */
--charcoal-slate: rgb(55, 60, 68); /* good background / surface color */
--charcoal-lighter: rgb(70, 75, 85); /* readable dark gray, modern UI feel */
--deep-night-black: rgb(8, 18, 28);
--abyss-black: rgb(6, 15, 22);
--bs-dark: var(--charcoal-medium); /* changes the base dark color */
--bs-dark-rgb: 35, 40, 48;
--bs-blue: var(--glacier-blue);
/* custom colors */
--flamingo-pink: rgba(253, 117, 127, 1);
--sea-grass-green: rgba(88, 191, 177, 1);
--mountain-darkgray: rgb(12, 31, 49, 1);
--mountain-gray: rgb(102, 133, 139, 1);
--mountain-lightgray: rgb(121, 152, 155, 1);
--glacier-blue: rgb(28, 80, 101);
--glacier-darkblue: rgb(12, 39, 49);
--glacier-lightblue: rgb(94, 150, 159);
--glacier-blue-rgb: 94, 150, 159;
/* borders, corners, and shadows */
--perfect-border-radius: 0.48em;
--backdrop-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 1px 3px 0 rgba(0, 0, 0, 0.19);
--backdrop-transition: all 0.3s ease;
/* global overwrites of bootstrap vars */
--text-bg-primary-badge-color: var(--glacier-blue);
/* White to Darker Blue diagonal gradient */
--gradient-white-dark-blue: linear-gradient(
142deg,
var(--ghost-white) 0%,
var(--ghost-white) 55%,
var(--glacier-lightblue) 67%,
var(--glacier-lightblue) 75%,
var(--glacier-blue) 100%
);
--gradient-dark: linear-gradient(135deg, var(--mountain-white) 0%, var(--mountain-darkgray) 100%);
}
* {
scrollbar-width: none;
}
h1, h2, h3 {
font-weight: 300;
}
h4, h5, h6, p, body {
font-weight: 400;
}
.btn {
box-shadow: var(--perfect-shadow-thin-dark);
transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
}
.btn:hover {
transform: scale(1.1) translateY(-2px);
box-shadow: var(--perfect-shadow-thin-active-dark);
}
.btn:not(.btn-ghost):not(.btn-outline):hover {
transform: scale(1.1) translateY(-2px);
box-shadow: var(--perfect-shadow-thin-active-dark);
}
vite.config.js
+11
View File
@@ -0,0 +1,11 @@
import {defineConfig} from 'vite'
import tailwindcss from '@tailwindcss/vite'
export default defineConfig({
plugins: [
tailwindcss(),
],
build: {
outDir: 'dist'
}
})