Skip to content

Instantly share code, notes, and snippets.

👨‍💻
Trying Really Hard

Praveen Puglia praveenpuglia

👨‍💻
Trying Really Hard
Block or report user

Report or block praveenpuglia

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@praveenpuglia
praveenpuglia / webpack.config.js
Last active Apr 11, 2018
Simplest webpack 4 configuration to work with vuejs & scss
View webpack.config.js
// Require things!
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// The configuration starts here!
module.exports = {
// The entry point for webpack to start generating a dependency graph.
entry: { index: './src/index.js' },
@praveenpuglia
praveenpuglia / debug.component.ts
Created Mar 23, 2018
Simple Component that dumps prettified data in any template.
View debug.component.ts
import { Component, Input } from '@angular/core';
@Component({
selector: 'dump',
template: `
<pre><code>{{data | json}}</code></pre>
`,
styles: [
`
:host {
@praveenpuglia
praveenpuglia / shadow-dom.md
Last active Aug 23, 2019
Everything you need to know about Shadow DOM
View shadow-dom.md

I am moving this gist to a github repo so more people can contribute to it. Also, it makes it easier for me to version control.

Please go to - https://github.com/praveenpuglia/shadow-dom-in-depth for latest version of this document. Also, if you find the document useful, please shower your love, go ⭐️ it. :)

Shadow DOM

Heads Up! It's all about the V1 Spec.

In a nutshell, Shadow DOM enables local scoping for HTML & CSS.

View hcf.js
function hcf(n1, n2){
var hcf = (n1 > n2) ? findHcf(n2, n1) : findHcf(n1, n2);
console.log("HCF of ", n1, " & ", n2, " is ", hcf);
}
function findHcf(b, a) {
console.log("Divisor : ", b," Dividend: ", a);
var q, r;
q = Math.floor(a/b);
r = a - b*q;
View CSS Variables - Thoughts.md

Thanks for replying to me! :)

I really didn't know about the recommendation process back then. It's pretty recent that I came to know about it. I am not sure if any of the suggestion helps at the moment since it's now a recommendation.

I am also sure that the working group must have thought about exhaustive scenarios so I may not even be making a point.

I know $ or @ couldn't be used since they were already getting used in preprocessors and @ specifically, I feel, wouldn't go with the existing syntax of CSS.

I met Chris Lilley few days ago and I came to know that $ could be used but it would create multiple problems.

@praveenpuglia
praveenpuglia / es2015-features.js
Last active Sep 29, 2015
Features Examples of ES2015 - Some written, some curated.
View es2015-features.js
/*======================================================
= ARROW FUNCTIONS & LEXICAL this =
======================================================*/
// OLD WAY
var squares = [1,2,3,4,5,6,7,8,9].map(function(value){
// this === window
return value * value;
});
// NEW WAY
@praveenpuglia
praveenpuglia / Package Control.sublime-settings
Created Jun 22, 2015
Installed Packages for sublime text
View Package Control.sublime-settings
{
"in_process_packages":
[
],
"installed_packages":
[
"BracketHighlighter",
"Emmet",
"GitHub Markdown Snippets",
"Handlebars",
@praveenpuglia
praveenpuglia / .csscomb.json
Last active Aug 29, 2015
CSSComb Config for Sublime Text 3
View .csscomb.json
{
"config": {
"remove-empty-rulesets": true,
"always-semicolon": true,
"color-case": "lower",
"block-indent": " ",
"color-shorthand": true,
"element-case": "lower",
"eof-newline": false,
"leading-zero": true,
View Rich Text Editor.html
<!doctype html>
<html>
<head>
<title>Rich Text Editor - FROM MDN!</title>
<script type="text/javascript">
var oDoc, sDefTxt;
function initDoc() {
oDoc = document.getElementById("textBox");
sDefTxt = oDoc.innerHTML;
View Infinite JSON Tree Parser.js
//sample tree structure
var tree = [
{
id : "A",
list : [
{
id : "A.A",
list : [
{
id : "A.A.A",
You can’t perform that action at this time.