mobile-friendly-shop-editor #92

Merged
Groupr merged 3 commits from fix/mobile-friendly-shop-editor into master 2025-11-01 09:58:50 -04:00
Groupr commented 2025-10-29 13:48:59 -04:00 (Migrated from git2.unturf.com)

Update shop_products.j2

Update meta.py

Update common.css

Added the mobile-only Status column markup with class="col-status".

Combined visibility emoji plus bundle/physical/ready indicators into stacked status rows.

Wrapped price and size values so decimal points render through span.decimal-dot for bold dots.

Summary by CodeRabbit

  • New Features

    • Added Status column to products table with visibility and bundle/physical/ready status indicators
    • Implemented responsive table layout optimizing column visibility for mobile devices
  • Style

    • Updated visibility label capitalization (Private, Public, Unlisted)
    • Enhanced price display formatting with improved decimal point styling
Update shop_products.j2 Update meta.py Update common.css Added the mobile-only Status column markup with class="col-status". Combined visibility emoji plus bundle/physical/ready indicators into stacked status rows. Wrapped price and size values so decimal points render through span.decimal-dot for bold dots. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added Status column to products table with visibility and bundle/physical/ready status indicators * Implemented responsive table layout optimizing column visibility for mobile devices * **Style** * Updated visibility label capitalization (Private, Public, Unlisted) * Enhanced price display formatting with improved decimal point styling <!-- end of auto-generated comment: release notes by coderabbit.ai -->
Groupr commented 2025-10-29 13:48:59 -04:00 (Migrated from git2.unturf.com)

requested review from @russellballestrini

requested review from @russellballestrini
coderabbitai commented 2025-10-29 13:49:15 -04:00 (Migrated from git2.unturf.com)

Walkthrough

Updates the products editor table UI to display a comprehensive Status column showing visibility, bundle, physical, and ready indicators. Adds responsive CSS to hide/show columns on mobile devices and capitalizes visibility level labels from lowercase to title case.

Changes

Cohort / File(s) Summary
Model constant update
make_post_sell/models/meta.py
Capitalizes visibility labels in VISIBILITY_INT_TO_HUMAN from lowercase ("private", "public", "unlisted") to title case ("Private", "Public", "Unlisted")
Responsive table layout
make_post_sell/static/css/common.css
Adds mobile-first responsive rules hiding low-priority columns (Visibility, Bundle, Physical, Ready) on mobile portrait (max-width 640px), compressing Sellable and Price columns, constraining Size, and introducing status-related styling hooks for Status column rendering
Status column template
make_post_sell/templates/shop_products.j2
Replaces file size column with new Status column containing visibility icon, Bundle/Physical/Ready status lines with colored indicators, restructuring the last table cell with nested status blocks while preserving the title link

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

  • CSS media queries: Verify responsive breakpoints align with design specifications and that hidden columns don't break table layout semantics
  • Template conditional logic: Ensure icon/indicator rendering for Bundle, Physical, and Ready statuses matches data schema and handles edge cases (null/undefined values)
  • Cross-file consistency: Confirm the new Status column structure works correctly with the CSS display rules across different screen sizes

Poem

🐰 A column of status, so bright and so clear,
With visibility, bundles, and readiness here!
On mobile, we hide what's not needed today,
On desktop, all treasures are proudly on display!
Capitalized labels now gleam in the sun—
A refactor for showing what's been done! 🌟


📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Free

📥 Commits

Reviewing files that changed from the base of the PR and between fd8e8b6b4f and f539323fb0.

📒 Files selected for processing (3)
  • make_post_sell/models/meta.py (1 hunks)
  • make_post_sell/static/css/common.css (1 hunks)
  • make_post_sell/templates/shop_products.j2 (1 hunks)

📝 NOTE

🎁 Summarized by CodeRabbit Free

Your organization is on the Free plan. CodeRabbit will generate a high-level summary and a walkthrough for each pull request. For a comprehensive line-by-line review, please upgrade your subscription to CodeRabbit Pro by visiting https://app.coderabbit.ai/login.

Comment @coderabbitai help to get the list of available commands and usage tips.

<!-- This is an auto-generated comment: summarize by coderabbit.ai --> <!-- walkthrough_start --> ## Walkthrough Updates the products editor table UI to display a comprehensive Status column showing visibility, bundle, physical, and ready indicators. Adds responsive CSS to hide/show columns on mobile devices and capitalizes visibility level labels from lowercase to title case. ## Changes | Cohort / File(s) | Summary | |---|---| | **Model constant update** <br> `make_post_sell/models/meta.py` | Capitalizes visibility labels in `VISIBILITY_INT_TO_HUMAN` from lowercase ("private", "public", "unlisted") to title case ("Private", "Public", "Unlisted") | | **Responsive table layout** <br> `make_post_sell/static/css/common.css` | Adds mobile-first responsive rules hiding low-priority columns (Visibility, Bundle, Physical, Ready) on mobile portrait (max-width 640px), compressing Sellable and Price columns, constraining Size, and introducing status-related styling hooks for Status column rendering | | **Status column template** <br> `make_post_sell/templates/shop_products.j2` | Replaces file size column with new Status column containing visibility icon, Bundle/Physical/Ready status lines with colored indicators, restructuring the last table cell with nested status blocks while preserving the title link | ## Estimated code review effort 🎯 3 (Moderate) | ⏱️ ~20 minutes - **CSS media queries**: Verify responsive breakpoints align with design specifications and that hidden columns don't break table layout semantics - **Template conditional logic**: Ensure icon/indicator rendering for Bundle, Physical, and Ready statuses matches data schema and handles edge cases (null/undefined values) - **Cross-file consistency**: Confirm the new Status column structure works correctly with the CSS display rules across different screen sizes ## Poem > 🐰 A column of status, so bright and so clear, > With visibility, bundles, and readiness here! > On mobile, we hide what's not needed today, > On desktop, all treasures are proudly on display! > *Capitalized labels* now gleam in the sun— > A refactor for showing what's been done! 🌟 <!-- walkthrough_end --> --- <details> <summary>📜 Recent review details</summary> **Configuration used**: CodeRabbit UI **Review profile**: CHILL **Plan**: Free <details> <summary>📥 Commits</summary> Reviewing files that changed from the base of the PR and between fd8e8b6b4f33d457d28fc49630f33e79b33458d0 and f539323fb028503889eb2ba8317d505a34a904a1. </details> <details> <summary>📒 Files selected for processing (3)</summary> * `make_post_sell/models/meta.py` (1 hunks) * `make_post_sell/static/css/common.css` (1 hunks) * `make_post_sell/templates/shop_products.j2` (1 hunks) </details> </details> <!-- tips_start --> --- > 📝 **NOTE** > <details> > <summary>🎁 Summarized by CodeRabbit Free</summary> > > Your organization is on the Free plan. CodeRabbit will generate a high-level summary and a walkthrough for each pull request. For a comprehensive line-by-line review, please upgrade your subscription to CodeRabbit Pro by visiting <https://app.coderabbit.ai/login>. > > </details> <sub>Comment `@coderabbitai help` to get the list of available commands and usage tips.</sub> <!-- tips_end --> <!-- internal state start --> <!-- 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 --> <!-- internal state end -->
coderabbitai commented 2025-10-29 13:49:39 -04:00 (Migrated from git2.unturf.com)

changed the description

changed the description
Groupr commented 2025-11-01 09:58:51 -04:00 (Migrated from git2.unturf.com)

mentioned in commit 789acae6fa

mentioned in commit 789acae6fac1ab1994a362e39fcf717ee3c93626
Groupr (Migrated from git2.unturf.com) merged commit 789acae6fa into master 2025-11-01 09:58:51 -04:00
Sign in to join this conversation.
No reviewers
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: engineering/make_post_sell#92
No description provided.