Reorganize repo: compartmentalize scripts by client/project

Move 150+ scripts from root and scripts/ into client/project directories:
- clients/dataforth/scripts/ (110 files: AD2, sync, SSH, DB, DOS scripts)
- clients/bg-builders/scripts/ (14 files: Lesley mgmt, Exchange, termination)
- clients/internal-infrastructure/scripts/ (10 files: GDAP, Gitea, backups)
- projects/msp-tools/scripts/ (9 files: CIPP, MSP onboarding, Datto)
- projects/gururmm-agent/scripts/ (3 files: API test, JWT, record counts)
- clients/glaztech/scripts/ (1 file: CentraStage removal)

Also reorganized:
- VPN scripts → infrastructure/vpn-configs/
- Retrieved API/JS files → api/
- Forum posts → projects/community-forum/forum-posts/
- SSH docs → clients/internal-infrastructure/docs/
- NWTOC/CTONW docs → projects/wrightstown-smarthome/docs/
- ACG website files → projects/internal/acg-website-2025/
- Dataforth docs → clients/dataforth/docs/
- schema-retrieved.sql → docs/database/

Deleted 24 tmp_*.ps1 one-off debug scripts (preserved in git history).
Root reduced from 220+ files to 62 items (docs + directories only).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-20 17:15:07 -07:00
parent 98ea867d2c
commit 5cbd49ce24
207 changed files with 49 additions and 547 deletions

View File

@@ -0,0 +1,273 @@
# Arizona Computer Guru Redesign - Change Log
## Version 2.0.0 - "Desert Brutalism" (2026-02-01)
### MAJOR CHANGES FROM PREVIOUS VERSION
---
## Typography Transformation
### BEFORE
- Inter (generic, overused)
- Standard weights
- Minimal letter-spacing
- Conservative sizing
### AFTER
- **Space Grotesk** - Geometric brutalist headings
- **IBM Plex Sans** - Warm technical body text
- **JetBrains Mono** - Monospace tech accents
- Negative letter-spacing (-0.03em to -0.01em)
- Bolder sizing (H1: 3.5-5rem vs 2rem)
- Uppercase dominance
---
## Color Palette Evolution
### BEFORE
```css
--color2: #f57c00 /* Generic orange */
--color1: #1b263b /* Navy blue */
--color3: #0d1b2a /* Dark blue */
```
### AFTER
```css
--sunset-copper: #D4771C /* Warmer, deeper orange */
--midnight-desert: #0A0F14 /* Near-black with blue undertones */
--canyon-shadow: #2D1B14 /* Deep brown */
--sandstone: #E8D5C4 /* Warm neutral */
--neon-accent: #00FFA3 /* Cyberpunk green - NEW */
```
**Impact:** Shifted from blue-heavy to warm desert palette with unexpected neon accent
---
## Visual Effects Added
### Geometric Transforms
- **NEW:** `skewY(-2deg)` on cards and boxes
- **NEW:** `skewX(-5deg)` on navigation hovers
- **NEW:** Angular elements mimicking geological strata
### Border Treatments
- **BEFORE:** 2-5px borders
- **AFTER:** 8-12px thick brutalist borders
- **NEW:** Neon accent borders (left/bottom)
- **NEW:** Border width changes on hover (8px → 12px)
### Shadow System
- **BEFORE:** Simple box-shadows
- **AFTER:** Dramatic offset shadows (4px, 8px, 12px)
- **NEW:** Neon glow shadows: `0 0 20px rgba(0, 255, 163, 0.3)`
- **NEW:** Multi-layer shadows on hover
### Background Textures
- **NEW:** Radial gradient overlays
- **NEW:** Repeating line patterns
- **NEW:** Desert texture simulation
- **NEW:** Gradient overlays on dark sections
---
## Interactive Animations
### Link Hover Effects
- **BEFORE:** Simple color change
- **AFTER:** Underline slide animation (::after pseudo-element)
- Width: 0 → 100%
- Positioned with absolute bottom
### Button Animations
- **BEFORE:** Background + color transition
- **AFTER:** Background slide-in effect (::before pseudo-element)
- Left: -100% → 0
- Neon glow on hover
### Card Hover Effects
- **BEFORE:** `translateY(-4px)` + shadow
- **AFTER:** Combined transform: `skewY(-2deg) translateY(-8px) scale(1.02)`
- Border thickness change
- Neon glow shadow
- Multiple property transitions
### Icon Animations
- **NEW:** `scale(1.2) rotate(-5deg)` on button box icons
- **NEW:** Neon glow filter effect
---
## Component-Specific Changes
### Navigation
- **Font:** Inter → Space Grotesk
- **Weight:** 500 → 600
- **Border:** 2px → 4px (active states)
- **Hover:** Simple background → Skewed background + border animation
- **CTA Button:** Orange → Neon green with glow
### Above Header
- **Background:** Gradient → Solid midnight desert
- **Border:** Gradient border → 4px solid copper
- **Font:** Inter → JetBrains Mono
- **Link hover:** Color change → Underline slide + color
### Feature/Hero Section
- **Background:** Simple gradient → Desert gradient + textured overlay
- **Typography:** 2rem → 4.5rem headings
- **Shadow:** Simple → 4px offset with transparency
- **Overlay:** None → Multi-layer pattern overlays
### Columns Upper (Cards)
- **Transform:** None → `skewY(-2deg)`
- **Border:** None → 8px neon left border
- **Hover:** `translateY(-4px)` → Complex transform + scale
- **Background:** Solid → Gradient overlay effect
### Button Boxes
- **Border:** 15px orange → 12px copper (mobile: 8px)
- **Transform:** None → `skewY(-2deg)`
- **Hover:** Simple → Background slide + border color change
- **Icon:** Static → Scale + rotate animation
- **Size:** 25rem → 28rem height
### Footer
- **Background:** Solid dark → Gradient + repeating line texture
- **Border:** Simple → 6px copper top border
- **Links:** Color transition → Underline slide animation
- **Headings:** Orange → Neon green with left border
---
## Layout Changes
### Spacing
- Increased padding on major sections (2rem → 4rem, 8rem)
- More generous margins on cards (0.5rem → 1rem)
- Better breathing room in content areas
### Typography Scale
- **H1:** 2rem → 3.5-5rem
- **H2:** 1.6rem → 2.4-3.5rem
- **H3:** 1.2rem → 1.6-2.2rem
- **Body:** 1.2rem (maintained, improved line-height)
### Border Weights
- Thin (2-5px) → Thick (6-12px)
- Consistent brutalist aesthetic
---
## Mobile/Responsive Changes
### Maintained
- Core responsive structure
- Flexbox collapse patterns
- Mobile menu functionality
### Enhanced
- Removed skew transforms on mobile (performance + clarity)
- Simplified border weights on small screens
- Better contrast with dark background priority
- Improved touch target sizes
---
## Performance Considerations
### Font Loading
- Google Fonts with `display=swap`
- Three typefaces vs one (acceptable for impact)
### Animation Performance
- CSS-only (no JavaScript)
- GPU-accelerated transforms (translateY, scale, skew)
- Cubic-bezier timing: `cubic-bezier(0.4, 0, 0.2, 1)`
### Code Size
- **Previous:** 28KB
- **New:** 31KB (+10% for significant visual enhancement)
---
## Accessibility Maintained
### Contrast Ratios
- High contrast preserved
- Neon accent (#00FFA3) used carefully for CTAs only
- Dark backgrounds with light text meet WCAG AA
### Interactive States
- Clear focus states
- Hover states distinct from default
- Active states visually obvious
---
## What Stayed the Same
### Structure
- HTML structure unchanged
- WordPress theme compatibility maintained
- Navigation hierarchy preserved
- Content organization intact
### Functionality
- All links work identically
- Forms function the same
- Mobile menu behavior consistent
- Responsive breakpoints similar
---
## Files Modified
### Primary
- `style.css` - Complete redesign
### Backups
- `style.css.backup-20260201-154357` - Previous version saved
### New Documentation
- `azcomputerguru-design-vision.md` - Design philosophy
- `azcomputerguru-changelog.md` - This file
---
## Deployment Details
**Date:** 2026-02-01
**Time:** ~16:00
**Server:** 172.16.3.10
**Path:** `/home/azcomputerguru/public_html/testsite/wp-content/themes/arizonacomputerguru/`
**Live URL:** https://azcomputerguru.com/testsite
**Status:** Active
---
## Rollback Instructions
If needed, restore previous version:
```bash
ssh root@172.16.3.10
cd /home/azcomputerguru/public_html/testsite/wp-content/themes/arizonacomputerguru/
cp style.css.backup-20260201-154357 style.css
```
---
## Summary
This redesign transforms the site from a **conservative corporate aesthetic** to a **bold, distinctive Desert Brutalism identity**. The changes prioritize:
1. **Memorability** - Geometric brutalism + unexpected neon accents
2. **Regional Identity** - Arizona desert color palette
3. **Tech Credibility** - Monospace accents + clean typography
4. **Visual Impact** - Dramatic scale, shadows, transforms
5. **Professional Edge** - Maintained structure, improved hierarchy
The result is a website that commands attention while maintaining complete functionality and accessibility.

View File

@@ -0,0 +1,229 @@
# Arizona Computer Guru - Bold Redesign Vision
## DESIGN PHILOSOPHY: DESERT BRUTALISM MEETS SOUTHWEST FUTURISM
The redesign breaks away from generic corporate aesthetics by fusing brutalist design principles with Arizona's dramatic desert landscape. This creates a distinctive, memorable identity that commands attention while maintaining professional credibility.
---
## CORE DESIGN ELEMENTS
### Typography System
**PRIMARY: Space Grotesk**
- Geometric, brutalist character
- Architectural precision
- Strong uppercase presence
- Negative letter-spacing for impact
- Used for: All headings, navigation, CTAs
**SECONDARY: IBM Plex Sans**
- Technical warmth (warmer than Inter/Roboto)
- Excellent readability
- Professional yet distinctive
- Used for: Body text, descriptions
**ACCENT: JetBrains Mono**
- Monospace personality
- Tech credibility signal
- Distinctive rhythm
- Used for: Tech elements, small text, code snippets
### Color Palette
**Sunset Copper (#D4771C)**
- Primary brand color
- Warmer, deeper than generic orange
- Evokes Arizona desert sunsets
- Usage: Primary accents, highlights, hover states
**Midnight Desert (#0A0F14)**
- Near-black with blue undertones
- Deep, mysterious night sky
- Usage: Dark backgrounds, text, headers
**Canyon Shadow (#2D1B14)**
- Deep brown with earth tones
- Geological depth
- Usage: Secondary dark elements
**Sandstone (#E8D5C4)**
- Warm neutral light tone
- Desert sediment texture
- Usage: Light text on dark backgrounds
**Neon Accent (#00FFA3)**
- Unexpected cyberpunk touch
- High-tech contrast signal
- Usage: CTAs, active states, special highlights
---
## VISUAL LANGUAGE
### Geometric Brutalism
- **Thick borders** (8-12px) on major elements
- **Skewed transforms** (skewY/skewX) mimicking geological strata
- **Chunky typography** with bold weights
- **Asymmetric layouts** for visual interest
- **High contrast** shadow and light
### Desert Aesthetics
- **Textured backgrounds** - Subtle radial gradients and line patterns
- **Sunset gradients** - Warm copper to deep brown
- **Geological angles** - 2-5 degree skews
- **Shadow depth** - Dramatic drop shadows (4-8px offsets)
- **Layered atmosphere** - Overlapping semi-transparent effects
### Tech Elements
- **Neon glow effects** - Cyan/green accents with glow shadows
- **Grid patterns** - Repeating line textures
- **Monospace touches** - Code-style elements
- **Geometric shapes** - Angular borders and dividers
- **Hover animations** - Transform + shadow combos
---
## KEY DESIGN FEATURES
### Navigation
- Bold uppercase Space Grotesk
- Skewed hover states with full background fill
- Neon CTA button (last menu item)
- Geometric dropdown with thick copper/neon borders
- Mobile: Full-screen dark overlay with neon accents
### Hero/Feature Area
- Desert gradient backgrounds
- Massive 4.5rem headings with shadow
- Textured overlays (subtle line patterns)
- Dramatic positioning and scale
### Content Cards (Columns Upper)
- Skewed -2deg transform
- Thick neon left border (8-12px)
- Gradient overlay effects
- Transform + scale on hover
- Neon glow shadow
### Button Boxes
- 12px thick borders
- Skewed containers
- Gradient background slide-in on hover
- Icon scale + rotate animation
- Border color change (copper to neon)
### Typography Hierarchy
- **H1:** 3.5-5rem, uppercase, geometric, heavy shadow
- **H2:** 2.4-3.5rem, uppercase, neon underlines
- **H3:** 1.6-2.2rem, left border accents
- **Body:** 1.2rem, light weight, excellent line height
### Interactive Elements
- **Links:** Underline slide animation (width 0 to 100%)
- **Buttons:** Background slide + neon glow
- **Cards:** Transform + shadow + border width change
- **Hover timing:** 0.3s cubic-bezier(0.4, 0, 0.2, 1)
---
## TECHNICAL IMPLEMENTATION
### Performance
- Google Fonts with display=swap
- CSS-only animations (no JS dependencies)
- Efficient transforms (GPU-accelerated)
- Minimal animation complexity
### Accessibility
- High contrast ratios maintained
- Readable font sizes (min 16px)
- Clear focus states
- Semantic HTML structure preserved
### Responsive Strategy
- Mobile: Remove skews, simplify transforms
- Mobile: Full-width cards, simplified borders
- Mobile: Dark background prioritized
- Tablet: Reduced border thickness, smaller cards
---
## WHAT MAKES THIS DISTINCTIVE
### AVOIDS:
- Inter/Roboto fonts
- Purple/blue gradients
- Generic rounded corners
- Subtle gray palettes
- Minimal flat design
- Cookie-cutter layouts
### EMBRACES:
- Geometric brutalism
- Southwest color palette
- Unexpected neon accents
- Angular/skewed elements
- Dramatic shadows
- Textured layers
- Monospace personality
---
## DESIGN RATIONALE
**Why Space Grotesk?**
Geometric, architectural, brutalist character creates instant visual distinction. The negative letter-spacing adds density and impact.
**Why Neon Accent?**
The unexpected cyberpunk green (#00FFA3) creates memorable contrast against warm desert tones. It signals tech expertise without being generic.
**Why Skewed Elements?**
2-5 degree skews reference geological formations (strata, canyon walls) while adding dynamic brutalist energy. Creates movement without rotation.
**Why Thick Borders?**
8-12px borders are brutalist signatures. They create bold separation, architectural weight, and memorable chunky aesthetics.
**Why Desert Palette?**
Grounds the brand in Arizona geography while differentiating from generic blue/purple tech palettes. Warm, distinctive, regionally authentic.
---
## USER EXPERIENCE IMPROVEMENTS
### Visual Hierarchy
- Clearer section separation with borders
- Stronger color contrast for CTAs
- More dramatic scale differences
- Better defined interactive states
### Engagement
- Satisfying hover animations
- Memorable visual language
- Distinctive personality
- Professional yet bold
### Brand Identity
- Regionally grounded (Arizona desert)
- Tech-forward (neon accents, geometric)
- Confident (brutalist boldness)
- Unforgettable (breaks conventions)
---
## LIVE SITE
**URL:** https://azcomputerguru.com/testsite
**Deployed:** 2026-02-01
**Backup:** style.css.backup-20260201-154357
---
## DESIGN CREDITS
**Design System:** Desert Brutalism
**Typography:** Space Grotesk + IBM Plex Sans + JetBrains Mono
**Color Philosophy:** Arizona Sunset meets Cyberpunk
**Visual Language:** Geometric Brutalism with Southwest Soul
This design intentionally breaks from safe, generic patterns to create a memorable, distinctive identity that positions Arizona Computer Guru as bold, confident, and unforgettable.

File diff suppressed because it is too large Load Diff