Skip to content

Instantly share code, notes, and snippets.

View cv2k10's full-sized avatar
💭
Calvin is coding hard now....

Calvin cv2k10

💭
Calvin is coding hard now....
View GitHub Profile
@cv2k10
cv2k10 / Searcher.js
Created June 30, 2020 15:28
On line 69, code that handles not found search result
import React from 'react';
import Card from '../Components/Card';
import data from '../Data/drinks.json';
import Preparation from '../Pages/Preparation';
import { Link } from 'react-router-dom';
import _, { update } from 'lodash';
function searchingFor(search) {
return function(cocktails) {
return cocktails.name.toLowerCase().includes(search.toLowerCase()) || !search;
@cv2k10
cv2k10 / arial-fonttack.css
Created March 5, 2020 04:53
Arial CSS Font Stack
h1 {
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 24px;
font-style: normal;
font-variant: normal;
font-weight: 700;
line-height: 26.4px;
}
h3 {
@cv2k10
cv2k10 / sample.json
Created March 4, 2020 01:19
sample.json
{
"fruit": "Apple",
"size": "Large",
"color": "Red"
}
@cv2k10
cv2k10 / css-icons.md
Last active March 3, 2020 00:26
500+ CSS Icons
@cv2k10
cv2k10 / react-with-sublist-routing
Last active March 1, 2020 15:06
React router with sublist routing
import React from 'react';
import { BrowserRouter as Router, Link, Route, Switch, useParams, useRouteMatch } from 'react-router-dom';
// To render the sublist only when one of the routes inside is active ?
export default function App() {
const pages = {
termsPage: [
{ name: 'First Page', path: '/one/two' },
{
@cv2k10
cv2k10 / react-router-nested-routing.js
Created March 1, 2020 13:43
React Router with Nested Routing
import React from 'react';
import { BrowserRouter as Router, Link, Route, Switch, useParams, useRouteMatch } from 'react-router-dom';
export default function App() {
return (
<Router>
<div>
<nav>
<ul>
<li>
@cv2k10
cv2k10 / hexagon-pattern2
Created May 20, 2019 05:57
Hexagon patterns (css)
This file has been truncated, but you can view the full file.
html {
touch-action: none; }
body {
font-size: 24px;
margin: 0;
width: 100%;
touch-action: none; }
.main {
@cv2k10
cv2k10 / sass-helper.js
Last active May 6, 2019 06:24
sass.sync.min.js helper of loading compiled css into style tag
window.onload = function() {
Sass.compile(document.querySelector("style[type=scss]").innerHTML, function(css) {
var st = document.createElement("style")
st.innerHTML = css.text;
css.formatted && console.log(css.formatted); // error log
css.text && document.head.appendChild(st); // add css to style
document.body.style.display = "block"; // turn on body
// console.log(css.text) // log css out
});
}
class User {
constructor(name) {
this.name = name;
}
sayHi() {
alert(this.name);
}
}