Previous Next
0 / 3
Module VC-05VIBECODE

Classify Responsive Viewports

VIBECODE • Vibe Coding: AI-First Software Delivery

Browser-only practice

Problem Statement

Stage: Iterate from User Feedback

A UI review needs consistent viewport categories.

Deliverable

A classification for every supplied width.

Input and output contract

Read integer widths and classify below 576 as mobile, below 992 as tablet, otherwise desktop.

Acceptance criteria

  1. Preserve width order.
  2. Apply exact boundary values.
  3. Ignore invalid widths.

Suggested vibe loop

Read AGENTS.md, connect your Ollama or OpenAI-compatible provider in the browser, and ask the agent to restate the contract and make one small verifiable change. Watch edits stream into app.py while the editor is locked, then review the result and run the visible example. Keep the checkpoint when the evidence is correct or use Undo to restore it. The browser-client agent does not require an administrator gateway or API key.

Constraints

Use Python 3 standard library only. Read and follow AGENTS.md, keep main.py as the entry point, and implement solve(raw) in app.py.

Sample Testcases

Submit runs every public testcase in this browser. Results and code never leave this device.

Sample #1
Public sample
Input
390
768
1440
Output
390:mobile
768:tablet
1440:desktop
Explanation
Covers standard viewports.

Web terminal

C, C++, Java, and Python run locally in a browser VM. No worker or visualizer is used.

Saved in this browser
Editor settings