Tag: SASS
How to open SideNav on the right in Materialize CSS in 3 Minutes
Learn How to open SideNav on the right in Materialize CSS Mobile responsive navigation is one of the important aspects of a responsive website. It is possible to create beautiful main navigation for desktop/laptop browsers, however, when we design mobile navigation it is a must to make it easily accessible from all mobiles and tablets.…
Working with colors in Materialize CSS
Learn Working with colors in Materialize CSS Changing the text and container colour on a website is one of the basic yet frequently performed tasks while designing a website. Usually, changing the colour is done using CSS. A designer can either use in-line CSS or write a class for changing the colour. In Materialize CSS, the…
Mega menu for Materialize CSS Framework
Learn Mega menu for Materialize CSS Framework and implement where it requires a huge menu This tutorial briefs how to add a Mega menu in Materializecss.com. As we know, there is no default option in Materializecss Framework for Megamenu, we take the privilege in demonstrating how to add a mega menu using simple CSS classes. …
Adding Logo to the Navbar in Materialize CSS
Learn Adding Logo to the Navbar in Materialize CSS and implement in you website and web applications In the previous tutorial, we discussed how to create Navbar using Materialize CSS Framework. If we explore the coding involved in the Navbar, there is an individual component named Logo. The Logo mentioned there is just a text…
Navbar in Materialize CSS
Learn about Navbar in Materialize CSS Creating Navigation Bar A navigation bar is a section of a graphical user interface intended to aid visitors in accessing information. Navigation bars are implemented in file browsers, web browsers and as a design element of some websites. Web Applications also require Navigation Bar in order to ease the…
Extension and Operators in SASS
Extension and Operators in SASS. Learn and implement Extension and operators in SASS. The extension is a feature in SASS / SCSS through which we can apply styles of one class to another just by calling the @extend in the subsequent class. Here’s the following example in which we have explained the classic use case…
Light and Dark Theme using Mixin
Light and Dark Theme using Mixin and implement in your web projects. It is possible to switch between a dark and light theme using simple SCSS / SASS without many code lines. We can leverage Mixin to achieve the change in light and dark themes. Following is the code for creating Mixin which can easily…
Mixins in SASS
Learn Mixins in SASS and reutilize style Mixins permit you to characterize styles that can be re-utilized all through your stylesheet. They make it simple to try not to utilize non-semantic classes like .float-left and to disperse assortments of libraries’ styles. Mixins are characterized utilizing the @mixin at-rule, which is composed @mixin <name> { ……
Functions in SASS
Learn functions in sass. Create functions, call them and level up your SASS Skills. Functions permit you to characterize complex operations on SassScript values that you can reuse all through your stylesheet. They make it simple to extract out standard formulae and practices in a decipherable manner. The function helps in computing calculations and return…
Easily implement Partials in SASS in 2021
Learn Partials in SASS quickly in 5 mins and start implementing in your projects Partial in 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…