Skip to content

Instantly share code, notes, and snippets.

View kieranmv95's full-sized avatar

Kieran kieranmv95

View GitHub Profile
kieranmv95 / useTheme.js
Last active January 6, 2021 15:30
React hook for getting the users preffered themeName from OS and then adding a manual toggle option
import { useEffect, useState } from 'react';
// This hook checks if the prefers-color-scheme is supported in the users and if
// so grabs the theme from the OS settings.
// If the theme is not supported it defaults to return the string light
// If the user manually toggles the theme to light or dark that is preferred over
// the OS settings
kieranmv95 / .gitconfig
Created January 15, 2019 19:04
email =
name = kieranmv95
co = checkout
cob = checkout -b
cm = commit -m
s = status -s
b = branch
kieranmv95 / vscode_settings.json
Last active August 29, 2020 16:35
Settings for visual studio code
"editor.fontFamily": "Fira Code",
"editor.fontSize": 14,
"editor.lineHeight": 18,
"editor.letterSpacing": 0.5,
"editor.cursorStyle": "line-thin",
"editor.minimap.enabled": false,
"editor.cursorBlinking": "smooth",
"editor.multiCursorModifier": "ctrlCmd",
"editor.smoothScrolling": true,
kieranmv95 / _center.mixin.scss
Last active April 26, 2018 20:07
Center anything horizontally vertically or on both axis in scss
// Center anything horizontally, vertically or both (assuming that the parents position is set to relative)
// Codepen Example Usage:
@mixin center($center: 'all') {
position: absolute;
@if $center == 'all' {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
kieranmv95 / _spacing-helper.scss
Last active February 6, 2019 02:10
Generates a array of spacing helper classes for margin and padding
// Customisable spacing units. these can be changed and new ones added
$spacing-units: (
1: 3px,
2: 5px,
3: 8px,
4: 13px,
5: 21px,
// These will not change this is just to help generate the classes with the correct naming
kieranmv95 / _arrow.scss
Last active April 27, 2018 04:11
Create pure CSS triangles in a matter of seconds with this scss mixin
Kieran Venison scss mixin
Example usage:
// Name: Arrow
// Params: direction, color, size
@mixin arrow($arrow-direction, $arrow-color, $arrow-size){