Skip to content

Instantly share code, notes, and snippets.

View abhishekjakhar's full-sized avatar
:octocat:

Abhishek Jakhar abhishekjakhar

:octocat:
14 followers · 5 following
View GitHub Profile
@abhishekjakhar
abhishekjakhar / main.css
Last active March 6, 2024 05:17
HTML Forms CSS File
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body {
font-family: 'Lato', sans-serif;
color: #333;
background-color: #f8f8f9;
@abhishekjakhar
abhishekjakhar / normalize.css
Created October 28, 2018 16:05
Normalize CSS
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif; /* 1 */
@abhishekjakhar
abhishekjakhar / Playground.tsx
Created March 24, 2023 06:39
import { Suspense, lazy, memo, Children } from 'react';
import { createFileMap } from './createFileMap';
const SandpackRoot = lazy(() => import('./SandpackRoot'));
type PlaygroundProps = {
children: React.ReactNode;
};
@abhishekjakhar
abhishekjakhar / createFileMap.ts
Created March 24, 2023 06:31
import type { SandpackFile } from '@codesandbox/sandpack-react';
export const createFileMap = (codeSnippets: React.ReactElement[]) => {
return codeSnippets.reduce(
(result: Record<string, SandpackFile>, codeSnippet: React.ReactElement) => {
if (codeSnippet.type !== 'pre') {
return result;
}
const { props } = codeSnippet.props.children;
@abhishekjakhar
abhishekjakhar / main.css
Last active March 2, 2020 11:20
HTML Tables CSS File
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body {
font-family: 'Lato', sans-serif;
color: #333;
font-weight: 400;
@abhishekjakhar
abhishekjakhar / style.css
Last active June 29, 2019 16:41
Gallery With Grid's CSS File
*,
*::after,
*::before {
margin: 0;
padding: 0;
box-sizing: inherit;
}
html {
box-sizing: border-box;
@abhishekjakhar
abhishekjakhar / index.html
Created December 9, 2018 08:08
Image Gallery With Grid's
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans:300,400,400i|Nunito:300,300i" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" type="image/png" href="img/favicon.png">
@abhishekjakhar
abhishekjakhar / Description.js
Created June 17, 2019 00:55
React Fragment (Description Component)(Keyed Fragment)
import React from 'react';
const teachers = [
{ id: 1, name: 'Abhishek', subject: 'React' },
{ id: 2, name: 'Aakash', subject: 'JavaScript' }
]
const Description = () => (
<dl>
{
@abhishekjakhar
abhishekjakhar / Table.js
Last active June 17, 2019 00:21
React Fragment (Table Component)
import React from 'react';
import TableColumns from './TableColumns';
const teachers = [
{ id: 1, name: 'Abhishek', subject: 'React' },
{ id: 2, name: 'Aakash', subject: 'JavaScript' }
]
const Table = () => (
@abhishekjakhar
abhishekjakhar / TableColumns.js
Created June 16, 2019 17:22
React Fragment (Table Columns Component) (div)
import React from 'react';
const TableColumns = (props) => {
const { name, subject } = props;
return (
<div>
<td>{name}</td>
<td>{subject}</td>
</div>