kieranmv95

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

[user]
	email = [email protected]
	name = kieranmv95

[alias]
	co = checkout
	cob = checkout -b
	cm = commit -m
	s = status -s
	b = branch

kieranmv95

{
    "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 anything horizontally, vertically or both (assuming that the parents position is set to relative)
// Codepen Example Usage: https://codepen.io/anon/pen/yPbgYW

@mixin center($center: 'all') {
  position: absolute;
  
  @if $center == 'all' {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

kieranmv95

// 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

/*
Kieran Venison scss mixin
[email protected]
Example usage: http://codepen.io/Kieranmv95/pen/QNYLvE
*/

// Name: Arrow
// Params: direction, color, size
@mixin arrow($arrow-direction, $arrow-color, $arrow-size){