Elisa Nicot's repositories
animated-clock
A lesson in using CSS keyframe animations to make a clock face with rotating hands.
arrrgenes-treasure-tours
Fix colour contrast & colour blindness related problems on a piratey tourism website.
code-a-website
Follow some wireframes, a sitemap & given some content, write the HTML for a full website.
components-on-a-grid
Review using CSS Grid & Flexbox to create a website design.
css-validation-fixes
Work through all the validation errors, indentation problems, & file issues.
dealing-with-whitespace
Spend some time looking spacing in typography: margins, paddings, line-length, line-height, etc.
dinosaur-designs
Assets for an in-class pair programming exercise that introduces CSS.
distributed-cards
Use Flexbox in a column direction to create distributed cards.
distributed-navigation
Use Flexbox to create a horizontal navigation with lots of different components.
euro-just-doing-semantics
Write all the necessary HTML for the content in the Semantics Schemantics group activity.
fancy-hover-boxes
An exercise using transitions to create hover boxes that fade from black & white to colour.
fastness-fixer
Fix a bunch of performance problems and pass the performance budget.
flexible-info-card
Review your knowledge of Flexbox with this small web design assignment.
hear-me-oh-content
Apply content accessibility best-practices while writing semantically appropriate HTML.
kraken-good-accessibility
Fix some HTML semantic accessibility problems for VoiceOver & some CSS design-specific problems.
letter-looper
Make a small Javascript program that accepts a letter and spits it out 10 times.
letter-looper-triangle
Make a small Javascript program that accepts a letter and spits it out a triangle of the letter.
modularity-mindfulness
Practice adjusting grids & flexbox items using media queries.
phrasal-template-generator
A Javascript coding exercise where a user will be able to generate 1 of 3 random stories.
prefers-accessibility
Practice applying accessibility preferences in your web designs.
pretty-products
Apply CSS Grid & Flexbox to a product listing page layout.
stunning-start-page
Use your grid & flexbox skills to make a full website homepage.
stylish-beets
Style the beets HTML file from an earlier week to match the screenshots.
svg-icon-sets
Use SVG icons sets to create a small layout with different icons.
svg-smiley-face
Hand write SVG code to create an interactive smiley face.
type-those-grids
Apply basic CSS Grid layouts to a simple typography-focused layout.
use-all-the-selectors
A CSS exercise refreshing and teaching about all the different selectors.
using-svg-icons
Use Illustrator & Spritebot to generate some SVG icons and use them in a website.
web-design-2-independent-project
Spend a few weeks writing the code for your independent project website—and make it amazing.
whats-yo-name
Use basic if-statements and prompts to make your first Javascript program.