Slide 3

Latest Updates

In a world of infinite possibilities, Ability is everything. We develop Website & Mobile app for Business.

Building an accessible dark/light toggle from a Figma design | FEM social media dashboard, Part 3

(Source Youtube)

???? My upcoming course: Responsive Design for Beginners! https://coder-coder.com/responsive/ In this video we'll be building and styling the top bar and dark/light toggle for the Frontend Mentor social media dashboard, making sure to use accessible

???? My upcoming course: Responsive Design for Beginners! https://coder-coder.com/responsive/

In this video we'll be building and styling the top bar and dark/light toggle for the Frontend Mentor social media dashboard, making sure to use accessible HTML markup.

0:00 - Intro

0:10 - Study design

6:15 - Building top bar

20:23 - Using accessible markup for toggle

33:55 - Styling the top bar

52:06 - Styling the toggle so that it's accessible

Full playlist: https://www.youtube.com/playlist?list=PLUWqFDiirlsu5az5EIyxe8ZddyNO_kDuP

Source code on GitHub: https://github.com/thecodercoder/fem-dklt-toggle

Challenge on Frontend Mentor: https://www.frontendmentor.io/challenges/social-media-dashboard-with-theme-switcher-6oY8ozp_H

Sara Soueidan's accessible toggle Codepen: https://codepen.io/SaraSoueidan/pen/jpBbrq/

____________________________

LINKS & RESOURCES

???? Learn to code with a free 7-day trial to Team Treehouse:

https://treehouse.7eer.net/c/1296848/228915/3944

SUPPORT THE CHANNEL

???????? Hit the THANKS button in any video!

???? GitHub sponsors: https://github.com/sponsors/thecodercoder

???? Get my VS Code theme: https://marketplace.visualstudio.com/items?itemName=CoderCoder.codercoder-dark-theme

WANT TO LEARN WEB DEV?

Check out my courses:

???? Responsive Design for Beginners: https://coder-coder.com/responsive/

???? Gulp for Beginners: https://coder-coder.com/gulp-course/

RECOMMENDATIONS

⌨ My keyboard -- Get 10% off with code THECODERCODER -- https://vissles.com/?ref=mu96kxst5w

???? Other gear -- https://www.amazon.com/shop/thecodercoder?listId=1LMCKGUTMVYXD

???? My Favorite Books -- https://coder-coder.com/best-web-development-books/

???? My Favorite Courses -- https://coder-coder.com/best-web-development-courses/

???? FOLLOW CODER CODER

Blog -- https://coder-coder.com/

Twitter -- https://twitter.com/thecodercoder

Instagram -- https://www.instagram.com/thecodercoder

#webdevelopment #coding #programming

Why you’re not progressing (and how to fix it)

Blog

01-26-2021

Why you’re not progressing (and how to fix it)

After seeing thousands of designers go through our courses, there's something I've come to notice that makes or breaks a designer. A well-rounded designer who is pretty

Slide

From a small room table to large meeting rooms

We’re working with companies of all sizes ranging from startups to large scale business industries! We have extensive experience working with companies in Canada, USA and global to help them build a great website and effectively improve their ROI.

Slide