From the course: AI-Powered Development: GitHub Copilot in Visual Studio Code

Unlock this course with a free trial

Join today to access over 25,300 courses taught by industry experts.

Modernize the UI layer

Modernize the UI layer

From the course: AI-Powered Development: GitHub Copilot in Visual Studio Code

Start my 1-month free trial Buy for my team

Modernize the UI layer

“

The last change I want to make in this refactoring session is to modernize the UI in the web page. So this is my prompt the UI for this page is dated will you update it for modern clean look that is also mobile friendly and accessible. So here's its reiteration of what it wants to accomplish. It's stating my goals and And then the model is going to update both the HTML structure so that it can change the accessibility and the CSS styling. So here's the goals that are followed. Modern CSS with better typography, card-based layout, improved spacing, modern color scheme, responsive design, and accessibility features, and also use some HTML improvements with a better semantic structure, proper ARIA labels, and better form layout. So I went from this simple prompt to this more detailed set of goals for the model. And then here's the results. 55 updates in the HTML file and 318 updates in the CSS. Copilot provides some information about the accessibility, proper semantic elements, ARIA…

Contents