Skip to content

Instantly share code, notes, and snippets.

Konstantin koss-lebedev

Block or report user

Report or block koss-lebedev

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
View component-3.tsx
const style = useSpring({
from: {
transform: "perspective(500px) rotateY(0deg)"
},
transform: "perspective(500px) rotateY(25deg)"
});
View component-2.tsx
import { animated, useSpring } from "react-spring";
const App = () => {
const style = useSpring({
from: {
transform: "rotateY(0deg)"
},
transform: "rotateY(25deg)"
});
View styles.scss
::-webkit-scrollbar {
width: 0px;
}
.container {
display: flex;
overflow-x: scroll;
width: 100%;
}
View component.tsx
const movies = [
"/breaking-bad.webp",
"/the-leftovers.jpg",
"/game-of-thrones.jpg",
"/true-detective.jpg",
"/walking-dead.jpg"
];
const App = () => {
return (
View KanyeQuote.tsx
import * as React from "react"
import { Quote } from "./canvas"
export function KanyeQuote() {
const [quote, setQuote] = React.useState("")
React.useEffect(() => {
fetch("https://api.kanye.rest/").then(response => {
response.json().then(json => {
setQuote(json.quote)
View KanyeQuote-with-cache.tsx
import * as React from "react"
import { Quote } from "./canvas"
export function KanyeQuote() {
const [quote, setQuote] = React.useState("")
React.useEffect(() => {
// load quote from local storage if it's there, fetch from API otherwise
if (localStorage.getItem("quote")) {
setQuote(localStorage.getItem("quote"))
View framer-motion-six.tsx
const Six = () => {
const container: Variants = {
active: {
background: "#ff00b1",
},
disabled: {
background: "#0D00FF"
}
};
View framer-motion-four.tsx
const Four = () => {
const [active, setActive] = React.useState(false);
const rectangle: Variants = {
active: { background: "#ff00b1", rotate: 90 },
disabled: { background: "#0D00FF", rotate: 0 }
};
return (
<motion.div
View framer-motion-eight.tsx
const container: Variants = {
active: {
background: "#ff00b1",
transition: {
staggerChildren: 0.5,
when: "beforeChildren"
}
},
disabled: {
background: "#0D00FF"
View framer-motion-seven.tsx
const container: Variants = {
active: {
background: "#ff00b1",
transition: {
staggerChildren: 0.5
}
},
disabled: {
background: "#0D00FF"
}
You can’t perform that action at this time.