Ibrahim Nagnuribrahimhn.hashnode.dev·Jul 19, 2024Responsive Design Made Simple with SCSS Breakpoints Mixins.In modern web development, ensuring your designs look great across different devices is crucial. With SCSS (Sassy CSS), managing responsive breakpoints becomes easier using mixins. Let's walk through how to effectively use SCSS mixins to handle break...DiscussCSS
Shubham Vandarashubhamvandara.hashnode.dev·Jul 12, 2024Supercharge Your Styles: Adding SCSS to Your HTML ProjectAs you should know SCSS (Sass - Syntactically Awesome Style Sheets) is a CSS preprocessor that allows writing more maintainable and reusable styles. If you use a code editor such as Visual Studio Code (VS Code), simply make the switch from SCSS to CS...Discuss·1 likeHTML5
Nicblog.nicm42.co.uk·Jun 23, 2024Converting px in SCSSA lot of the time in designs they give the font-size, line-height and letter-spacing in px. Which isn't helpful as they mean having to get the calculator out to convert them to more useful units. But a combination of Sass functions and mixins can do ...Discussscss
prasanna pinnamlakshmiprasanna.hashnode.dev·Jun 16, 2024SASS for Beginners: A Step-by-Step Guideintroduction sass is a css preprocessor -- meaning sass cannot be run by browser, sass code should be converted to css to make it run on browser Sass has two syntaxes: SCSS (Sassy CSS) Sass (indented syntax) SCSS is more popular and resembles...Discusssass guide
Serhat Bekbek-dev.hashnode.dev·May 31, 2024Vanilla JavaScript - ModalIn this article, we'll build a modal using vanilla JavaScript, HTML, and SCSS that will include features like opening and closing with a button, and closing when clicking outside of the modal content. Before we start I'd like mention that I used: Bo...DiscussJavaScript
Serhat Bekbek-dev.hashnode.dev·May 31, 2024Vanilla JavaScript - TooltipTooltips are a great way to provide additional information to users without cluttering the interface. In this article, we'll create a simple and effective tooltip using vanilla JavaScript, HTML, and CSS. Before we start I'd like mention that I used: ...Discusstooltip
Serhat Bekbek-dev.hashnode.dev·May 31, 2024Vanilla JavaScript - Hamburger Menu ButtonCreating a hamburger menu is a common task for modern web development, especially for responsive designs. In this tutorial, we'll walk through how to create a hamburger menu component using plain JavaScript, HTML, and SCSS. Burger Menu HTML Structure...DiscussJavaScript
Ameramertricic.hashnode.dev·May 17, 2024Sass, BEM and @extendIn my personal projects I love using vanilla CSS3 and Scss preprocessor. My Scss architecture is inspired by 7-1 architecture, which means that each folder contains partials, and we have a single file at the root level (main.scss) which imports them ...DiscussSass
Serhat Bekbek-dev.hashnode.dev·May 12, 2024Vanilla JavaScript - AccordionAccordions are a popular UI pattern for presenting collapsible content sections. In this tutorial, we'll walk through how to create a basic accordion component using plain JavaScript, HTML, and CSS. Before we start I'd like mention that I used: Boxi...DiscussJavaScript
Basavaraj Kalburgibasavaraj2711.hashnode.dev·May 6, 2024Beyond the Playlist: Crafting a Music Player ExperienceIn the digital age, music is at our fingertips. But how we experience it can vary greatly. Many music players offer basic functionality – play, pause, skip – but often lack the soul to truly elevate the listening experience. As a passionate developer...Discussmusic