Remove Arrows/Spinners Example /* Chrome, Safari, Edge, Opera */input::-webkit-outer-spin-button,input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;} /* Firefox */input[type=number] { -moz-appearance: textfield;}
Author: Jerin devassy
CSS parent selector :has()
There are many selectors in CSS, but the :hasselector is special. The CSS :has()pseudo-class selector is somewhat similar to :not(), also known as a structural pseudo-class selector, and is also used in CSS functions. Call it a dynamic pseudo-class function. It allows you to match elements more finely. The :has()pseudo-class would represent an element if… Continue reading CSS parent selector :has()
Using a Flat Catalog is Helpful for Performance?
We can configure Flat Catalog for Category & Products from Admin -> Stores -> Configuration -> Catalog -> Catalog -> Storefront Tab. There are 2 data models in Magento: eav (default) and flat. EAV is a very angile model it allows user to add custom attributes as many is he likes, but the problem is… Continue reading Using a Flat Catalog is Helpful for Performance?
What is a cascade layer?
Cascade layers are the latest addition to CSS. They allow developers to control the specificity and the source order across multiple CSS files. As a result, developers can minimize CSS collisions and avoid unexpected style changes in their applications. @layer base{ @layer theme, components } @layer base{ … } @layer base.theme{ … } @layer base.components{… Continue reading What is a cascade layer?
Gap Property
CSS Flexbox and CSS Grid are fantastic tools available for managing layout on the Web. Flexbox handles single-dimensional layouts very well, while CSS Grid handles two-dimensional layouts with columns and rows. Often we want to add space between the items within our layout. This kb will show how to add space between flex items using… Continue reading Gap Property
Why can’t one switch back to the default mode on Magento 2?
To switch back to default mode, open:- app/etc/env.php And change:- ‘MAGE_MODE’ => ‘developer’, Back to:- ‘MAGE_MODE’ => ‘default’, And re-deploy static files again. reference:https://magento.stackexchange.com/questions/112523/why-cant-one-switch-back-to-the-default-mode-on-magento-2
How to stringify the items Array in main.js and store it in localStorage:
JSON.stringify will only convert value type property, array and objects.
Addeventlistener in javascript.
The addEventListener() is an inbuilt function in JavaScript that takes the event to listen for, and a second argument to be called whenever the described event gets fired. Any number of event handlers can be added to a single element without overwriting existing event handlers.
Open Source lazyLoading Extensions.
magefan s
Query Selector
The querySelector() method returns the first element that matches a CSS selector. To return all matches (not only the first), use the querySelectorAll() instead. Both querySelector() and querySelectorAll() throw a SYNTAX_ERR exception if the selector(s) is invalid.