Posts

Showing posts from October, 2024

CSS Cheat Sheet: Everything You Need to Know in One Place

-
CSS cheat-sheet Basic Selectors: * /* Universal selector */ element /* Selects all elements of a type */ .class /* Selects elements by class */ #id /* Selects elements by ID */ element , element /* Grouping selectors */ Box Model: element { margin : 10px ; /* Space outside the element */ padding : 10px ; /* Space inside the element */ border : 1px solid #000 ; /* Border around the element */ width : 100px ; /* Element width */ height : 100px ; /* Element height */ box-sizing : border-box; /* Includes padding/border in width and height */ } Text Styling: element { font-family : Arial, sans-serif; /* Font family */ font-size : 16px ; /* Font size */ font-weight : bold; /* Font weight (bold, normal) */ font-style : italic; /* Italic text */ text-align : center; /* Aligns text (lef...
Post a Comment
Read more

CSS Cheat Sheet: Everything You Need to Know in One Place

-
CSS cheat-sheet Basic Selectors: * /* Universal selector */ element /* Selects all elements of a type */ .class /* Selects elements by class */ #id /* Selects elements by ID */ element , element /* Grouping selectors */ Box Model: element { margin : 10px ; /* Space outside the element */ padding : 10px ; /* Space inside the element */ border : 1px solid #000 ; /* Border around the element */ width : 100px ; /* Element width */ height : 100px ; /* Element height */ box-sizing : border-box; /* Includes padding/border in width and height */ } Text Styling: element { font-family : Arial, sans-serif; /* Font family */ font-size : 16px ; /* Font size */ font-weight : bold; /* Font weight (bold, normal) */ font-style : italic; /* Italic text */ text-align : center; /* Aligns text (lef...
Post a Comment
Read more

How to Implement Push Notifications Using JavaScript

-
Push Notifications in JavaScript 1. Notification Permissions Flow The flow is as follows: The website asks for permission using the Notification.requestPermission() method. The user can choose to allow or block notifications. Based on the user's choice, the browser returns one of the following statuses: "granted" : The user allowed notifications. "denied" : The user blocked notifications. "default" : The user dismissed the permission dialog (equivalent to denying but without explicitly clicking 'Block'). 2. Code Breakdown Here’s the code that requests permission: function requestNotificationPermission ( ) { return new Promise ( ( resolve, reject ) => { // Ask for permission to show notifications const permissionResult = Notification.requestPermission( result => { resolve(result); }); // Handle browsers that return a promise if (permissionResult) { ...
Post a Comment
Read more