Before writing CSS for a new feature in an existing file, a developer must read that file first. The developer must use existing variables for colors, sizes, and spacing. This prevents new features from looking different from the rest of the application.
By Pawan Nayar · from the LLOS AI Learning record
Before writing CSS for a new feature in an existing file, a developer must read that file first.
The developer must use existing variables for colors, sizes, and spacing. This prevents new features from looking different from the rest of the application.
The new CSS looks wrong because the existing file was not read first. A developer might invent new colors, font sizes, or spacing. These new values do not match what the file already uses. This makes the new feature look out of place.
A developer adds a new 'wizard' component to an existing web page. The developer does not check the page's existing CSS variables. The developer chooses new colors and font sizes from imagination. The new wizard component then looks like it belongs to a different application, not the current one.
Resolved from this lesson's own record — real definitions, not invented for this page.
More from the same record, pulled by shared topic — not written new for this page.
A new design must use the exact layout proportions of a proven design. The proven design has been refined over many hours.
A developer should provide example SVG code to the AI model. This helps the AI model understand the exact visual style.
A card must never change its size. The content inside the card must fit the card.
A developer can hide the hamburger menu icon on large screens. The developer can hide the regular navigation menu on small screens.
Before writing CSS for a new feature in an existing file, a developer must read that file first. The developer must use existing variables for colors, sizes, and spacing. This prevents new features from looking different from the rest of the application.