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