Portfolio

HTML5

Sass

JavaScript

Personal Portfolio

My personal portfolio containing previous projects and information about myself and my skills.

Methods Used

SCSS

A preprocessor of CSS, SCSS helps you write your CSS codes easily by letting you use loops, functions, imports, variables, and mathematical operations, thus making CSS writing more powerful. It extends the standard CSS characteristics by simply introducing the benefits of a basic programming language.

Dark Theme

Dark themes are becoming one of the most popular things on the internet these days. The idea behind dark mode is that it reduces the light emitted by device screens while maintaining the minimum colour contrast ratios required for readability.

Lessons Learned

Partials

Partial SASS / SCSS is useful when the project files are enormous. Reusing or maintaining such huge SCSS files is cumbersome. Partial SCSS allows developers to split the variable, resets or page-wise SCSS separately and quickly embed them in the main SCSS. The main advantage in SASS is that partial SCSS files will not compile into new CSS files and therefore it becomes easier to manage.

Dark Theme

My approach was to add a class to the body tag when a button was clicked. In order to change the theme to a dark theme, I manipulated the custom properties I had set up in my stylesheet. This allowed the use of custom properties for each of the specific themes. I liked this approach as it gave me the ability to customize each theme in one place if I wanted to change it.