Skip to content

Instantly share code, notes, and snippets.

View MantasMikal's full-sized avatar
🧙‍♂️
Centering the <View>

Mantas Mikalauskas MantasMikal

🧙‍♂️
Centering the <View>
View GitHub Profile
@MantasMikal
MantasMikal / cloudSettings
Last active March 2, 2020 14:00
WSL 2 Setup
{"lastUpload":"2020-03-02T14:00:44.840Z","extensionVersion":"v3.4.3"}
@MantasMikal
MantasMikal / ImageZoom.jsx
Last active October 20, 2022 09:22
Easy way to zoom gatsby-image with react-medium-image-zoom
// Demo https://guste.design/gallery/
// Install https://www.npmjs.com/package/react-medium-image-zoom
// ImageZoom.jsx
import React from 'react'
import Image from 'gatsby-image'
import Zoom from 'react-medium-image-zoom'
@MantasMikal
MantasMikal / ignore-mini-css-extract-warnings-gatsby.js
Last active May 5, 2021 20:58
Ignore mini-css-extract-plugin warnings on Gatsby 3
/*
You may be using CSS Modules or another CSS-in-JS library to safely scope CSS between pages and components.
The webpack mini-css-extract-plugin still warns that the CSS might be bundled out of order.
Warnings look like this:
warn chunk commons [mini-css-extract-plugin]
Conflicting order. Following module has been added:
* css ./node_modules/gatsby/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[9].oneOf[0].use[1]!./node_modules/gatsby/node_modules/postcss-l
oader/dist/cjs.js??ruleSet[1].rules[9].oneOf[0].use[2]!./node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[9]
# Know the id of the username in the original distro that was exported
wsl -d Ubuntu-20.04 -u kartz -e id -u
# Outputs 1000
# Knowing the id of the username in the distro that was created by importing the tar image
wsl -d Ubuntu-20 -u kartz -e id -u
# Outputs 1000
# I would want to use this distroname and id, to set this user as the default login profile of WSL.
# I set this up in Windows Registry with the line snippet below:
@MantasMikal
MantasMikal / App.js
Created July 8, 2021 08:47 — forked from jefflau/App.js
Multiple layouts with React Router V4
/* Inspired by: https://gist.github.com/avinmathew/e82fe7e757b20cb337d5219e0ab8dc2c */
import React, { Fragment } from 'react'
import {
BrowserRouter as Router,
Route as DefaultRoute,
Switch
} from 'react-router-dom'
import TestRegistrar from './routes/TestRegistrar'
import Home from './routes/Home'
import SingleName from './routes/SingleName'
@MantasMikal
MantasMikal / init-wsl.ps1
Created August 2, 2022 19:16
Connecting to WSL2 server via local network
# Credit: Jace-Samsung https://github.com/microsoft/WSL/issues/4150#issuecomment-1152617387
# Connect to other machines (besides the Windows machine running WSL2 running the service) on
# the local network. It can be set up to run on startup of Windows through Task Scheduler Triggers,
# as described here: https://github.com/microsoft/WSL/issues/4150
# This script must be run with administrator priveledges.
$lines_with_IP_addresses = bash.exe -c "ip addr | grep -Ee 'inet.*eth0'"
$regex = [regex] "\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b"
$potential_IP_addresses = $regex.Matches($lines_with_IP_addresses) | % { $_.value }
@MantasMikal
MantasMikal / cn.ts
Created August 2, 2023 19:17
Tailwind merge + clsx
import { twMerge } from "tailwind-merge";
import { clsx, ClassValue } from "clsx";
/**
* Inteligently merge tw classess with clsx concatination
**/
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}
@MantasMikal
MantasMikal / useElasticMouse.js
Last active February 10, 2024 21:00
Elastic mouse cursor for React
import React from 'react'
/**
* Makes a custom cursor scale based on the mouse velocity.
* Create an element for your cursor and pass the onMouseMove to the cointainer you want to capture events from.
* React implementation of https://codepen.io/gusevdigital/pen/MWxyXRa
**/
export const useElasticMouse = (cursorId) => {
const animationRef = React.useRef()