Skip to content

Instantly share code, notes, and snippets.

Avatar
🏠
Working from home

Sagar sagar-gavhane

🏠
Working from home
View GitHub Profile
View _descriptors.json
[
{
"type":"Component",
"id":"ImageAndText",
"label":"Image and Text",
"internal":false,
"isGlobal":false,
"allowNestedComponents":true,
"description":"Image and Text Row",
"attributes":{
@sagar-gavhane
sagar-gavhane / _descriptors.json
Created Oct 30, 2020
descriptor file for testing nested components
View _descriptors.json
[{"type":"Component","id":"ImageAndText","label":"Image and Text","internal":false,"isGlobal":false,"allowNestedComponents":true,"description":"Image and Text Row","attributes":{"image":{"type":"Image","label":"Image","url":{"type":"String","label":"URL","default":""},"altText":{"type":"String","label":"Alt text","default":""}},"title":{"type":"String","label":"Title","default":""},"description":{"type":"String","label":"Description","default":""},"ctaText":{"type":"String","label":"Button text","default":""},"ctaLink":{"type":"String","label":"Button link","default":""},"boxes":{"type":"Array","label":"box","default":[],"allowNestedComponents":true,"children":{"type":"Shape","default":{},"children":{"title":{"type":"String","label":"box title","default":"box"}}}},"buttons":{"label":"my button","type":"Array","default":{},"allowNestedComponents":false,"children":{"type":"Shape","default":{},"children":{"buttonTitle":{"type":"String","label":"box title","default":""}}}}}},{"type":"Component","id":"RichText","l
@sagar-gavhane
sagar-gavhane / arrays-polyfill.js
Last active Sep 30, 2020
Polyfill of Array's map, filter and reduce methods
View arrays-polyfill.js
// reduce
Object.defineProperty(Array.prototype, 'myReduce', {
value: function(fn, initial) {
let values = this;
values.forEach((item, idx) => {
initial = fn(initial, item, idx)
})
return initial;
View combined-drivers-solution.js
function getMilliseconds(date) {
const [hourse, minute] = date.split(':')
return hourse*60*60 + minute*60
}
function sortingFn (a, z) {
return getMilliseconds(a[0]) - getMilliseconds(z[0])
}
function combinedDrivers(city1, city2) {
@sagar-gavhane
sagar-gavhane / hunts-for-forbidden-nesting.css
Created Jun 24, 2020
selector hunts for forbidden nesting
View hunts-for-forbidden-nesting.css
:not(figure) > figcaption,
:not(fieldset) > legend,
:not(dl) > :is(dt, dd),
:not(tr) > :is(td, th),
:not(select) > :is(option, optgroup),
:not(table) > :is(thead, tfoot, tbody, tr, colgroup, caption) {
outline: 2px dotted red;
}
@sagar-gavhane
sagar-gavhane / building-a-blog-with-next-js-pages-blog-slug.jsx
Last active Jun 1, 2020
Building a blog with Next.js: [Slug].jsx
View building-a-blog-with-next-js-pages-blog-slug.jsx
// file: pages/blog/[slug].js
import React from "react";
function BlogPostPage(props) {
return (
<div>
<h1>{props.blog.title}</h1>
<section dangerouslySetInnerHTML={{ __html: props.blog.content }}></section>
</div>
);
@sagar-gavhane
sagar-gavhane / building-a-blog-with-next-js-pages-index.jsx
Last active Jun 1, 2020
Building a blog with Next.js: Index.js
View building-a-blog-with-next-js-pages-index.jsx
import React from "react";
import Link from "next/link";
function IndexPage(props) {
return (
<div>
<h1>Blog list</h1>
<ul>
{props.blogs.map((blog, idx) => {
return (
@sagar-gavhane
sagar-gavhane / animate.css
Created May 4, 2020
A cross-browser library of CSS animations. As easy to use as an easy thing.
View animate.css
@charset "UTF-8";
/*!
* animate.css -https://daneden.github.io/animate.css/
* Version - 3.7.2
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2019 Daniel Eden
*/
@sagar-gavhane
sagar-gavhane / react-memo-with-react-fast-compare.js
Created May 2, 2020
#3 React.memo with react-fast-compare
View react-memo-with-react-fast-compare.js
import React from 'react'
import { render } from 'react-dom'
import isEqual from 'react-fast-compare'
function Input(props) {
return <input value={props.value} onChange={props.handleOnChange} />
}
const MemoizedInput = React.memo(Input, isEqual)