Skip to content

Claude/improve toolbar spacing 01 q6y fp6 siz kt sp be g8ksa ht #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pdedgar1 merged 2 commits into from
Dec 3, 2025
Merged

Claude/improve toolbar spacing 01 q6y fp6 siz kt sp be g8ksa ht #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
dfc5e68
Standardize all lab pages with black header styling
claude Dec 3, 2025
7e92efd
Strengthen header CSS with !important to ensure consistent styling
claude Dec 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion alphabetizer-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,10 @@

<!-- Tool content here -->
<div class="container">
<h1>Alphabetizer Lab</h1>
<div class="header">
<h1>Alphabetizer Lab</h1>
<p>Analyze and rearrange words from your text alphabetically and numerically</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Alphabetizer Lab reorganizes text and reveals word frequency patterns.]
Expand Down
6 changes: 4 additions & 2 deletions grid-it-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,8 +79,10 @@
</nav>

<div class="container">
<h1>Grid-It Lab</h1>
<p class="subtitle">Organize text into a customizable grid layout</p>
<div class="header">
<h1>Grid-It Lab</h1>
<p>Organize text into a customizable grid with adjustable rows and columns</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Grid-It Lab creates visual arrangements of text and its applications for spatial poetry or experimental layouts.]
Expand Down
6 changes: 4 additions & 2 deletions line-break-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@

<!-- Tool content here -->
<div class="container">
<h1>Line Break Lab</h1>
<p class="subtitle">Experiment with adding and removing line breaks in your text</p>
<div class="header">
<h1>Line Break Lab</h1>
<p>Experiment with adding and removing line breaks in your text</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Line Break Lab transforms prose into poetry through strategic line breaking.]
Expand Down
6 changes: 4 additions & 2 deletions lipogram-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,8 +86,10 @@
</nav>

<div class="container">
<h1>Lipogram Lab</h1>
<p class="subtitle">Remove all words containing selected letters</p>
<div class="header">
<h1>Lipogram Lab</h1>
<p>Remove all words containing selected letters from your text</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Lipogram Lab works and its creative applications for constraint-based writing.]
Expand Down
6 changes: 4 additions & 2 deletions long-tail-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,10 @@
</nav>

<div class="container">
<h1>Long Tail Lab</h1>
<p class="subtitle">Reorganize text by the length of clauses, sentences, lines, or words</p>
<div class="header">
<h1>Long Tail Lab</h1>
<p>Reorganize text by the length of clauses, sentences, lines, or words</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Long Tail Lab reorganizes text and how this can reveal patterns or create new reading experiences.]
Expand Down
12 changes: 7 additions & 5 deletions styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,8 +255,8 @@ h3 {

/* Header Section */
.header {
background: #1a1a1a;
color: #ffffff;
background: #1a1a1a !important;
color: #ffffff !important;
padding: 30px;
text-align: center;
position: relative;
Expand All @@ -279,15 +279,17 @@ h3 {
}

.header h1 {
color: #ffffff;
border-bottom: none;
color: #ffffff !important;
border-bottom: none !important;
padding-bottom: 0;
margin-bottom: 10px;
}

.header p {
font-size: 1.1em;
opacity: 0.9;
color: #e8e8e8;
color: #e8e8e8 !important;
margin: 0;
}

/* Upload Zone */
Expand Down
6 changes: 4 additions & 2 deletions text-reverse-lab.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@

<!-- Tool content here -->
<div class="container">
<h1>Text Reversal Lab</h1>
<p class="subtitle">Upload a .txt file and experiment with reversing words and sentences</p>
<div class="header">
<h1>Text Reversal Lab</h1>
<p>Upload a .txt file and experiment with reversing words and sentences</p>
</div>

<p style="margin-bottom: 30px; line-height: 1.8; color: #4a4a4a;">
[Add your description here about how the Text Reversal Lab works and its creative applications for deconstructing and reconstructing narratives.]
Expand Down