Skip to content

Instantly share code, notes, and snippets.

View alevosia's full-sized avatar
🍦
I scream

Alexander alevosia

🍦
I scream
  • MNL
View GitHub Profile
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@alevosia
alevosia / Flexbox-Grid.components.ts
Last active June 27, 2020 10:34
My components to implement a Flexbox Grid like those of Bootstrap
import styled from 'styled-components'
import { Breakpoints } from '../constants'
const TOTAL_COLUMNS = 12
// TYPES ===================================================================
type MediaQueryKey = 'xs' | 'sm' | 'md' | 'lg' | 'xl'
type MediaQuery = {
[K in MediaQueryKey]: (styles: string) => string
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Themes, Colors and Icons -->
<link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="%PUBLIC_URL%/favicon-16x16.png">
<link rel="manifest" href="%PUBLIC_URL%/site.webmanifest">
<link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#0093D7">
@alevosia
alevosia / .eslintrc-react-typescript
Last active June 19, 2020 13:29
An eslint configuration for React projects that use TypeScript
{
"root": true,
"parser": "@typescript-eslint/parser", // Specifies the ESLint parser
"extends": [
"react-app",
"plugin:react/recommended", // Uses the recommended rules from [eslint-plugin-react]
// Uses the recommended rules from the [@typescript-eslint/eslint-plugin]
"plugin:@typescript-eslint/recommended",