Skip to content

Instantly share code, notes, and snippets.

View mustafaaloko's full-sized avatar

Mustafa Ehsan Alokozay mustafaaloko

View GitHub Profile
/**
* This injects Tailwind's base styles, which is a combination of
* Normalize.css and some additional base styles.
*
* You can see the styles here:
* https://github.com/tailwindcss/tailwindcss/blob/master/css/preflight.css
*/
@tailwind preflight;
/**
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- This is our compiled CSS file which is created by Tailwind CLI -->
<link rel="stylesheet" href="dist.css">
...
<body class="bg-grey-lighter h-screen font-sans">
...
</body>
...
...
<body class="bg-grey-lighter h-screen font-sans">
<div class="container mx-auto h-full flex justify-center items-center">
<div class="w-1/3">
<h1 class="font-hairline mb-6 text-center">Login to our Website</h1>
...
</h1>
</div>
</div>
</body>
...
margin: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
...
<div class="border-teal p-8 border-t-12 bg-white mb-6 rounded-lg shadow-lg">
<div class="mb-4">
<label class="font-bold text-grey-darker block mb-2">Username or Email</label>
<input type="text" class="block appearance-none w-full bg-white border border-grey-light hover:border-grey px-2 py-2 rounded shadow" placeholder="Your Username">
</div>
...
</div>
...
...
borderWidths: {
default: '1px',
'0': '0',
'2': '2px',
'4': '4px',
'8': '8px',
'12': '12px' // Add it here
},
...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="dist.css">
<title>Login</title>
@mustafaaloko
mustafaaloko / settings.json
Created December 26, 2017 08:45
My Visual Studio Code Settings
// Place your settings in this file to overwrite the default settings
{
"editor.tabSize": 4,
"workbench.colorTheme": "GitHub Plus",
"workbench.iconTheme": "material-icon-theme",
"editor.fontFamily": "Operator Mono",
"editor.fontSize": 14,
"editor.lineHeight": 40,
"editor.cursorStyle": "line",
"editor.quickSuggestions": {
@mustafaaloko
mustafaaloko / macro.php
Last active March 22, 2019 17:47
Laravel Macro Example
<?php
use Illuminate\Support\Collection;
Collection::macro('evens', function() {
return $this->filter(function($value) {
return $value % 2 === 0;
});
});