Skip to content

Instantly share code, notes, and snippets.

View jacobshenning's full-sized avatar

Jacob Henning jacobshenning

View GitHub Profile
<!-- header -->
<header id="header" class="relative bg-white" role="banner">
<!-- header container -->
<ul :class="{ 'h-20': !open, 'h-60': open }" class="w-full flex items-center flex-col lg:flex-row py-3 text-gray-900 lg:px-0 px-3 lg:h-auto overflow-hidden duration-300 relative float-center">
<li class="block lg:w-1/5 lg:pt-4 text-center order-2 lg:order-1 flex-shrink-0">
<a href="/" class="text-xl font-medium py-1 block">Blog</a>
</li>
<li class="block lg:w-1/5 lg:pt-4 text-center order-3 lg:order-2 flex-shrink-0">
@jacobshenning
jacobshenning / app.js
Last active April 23, 2024 16:39
An alpine datatable
// Alpine JS datatable
window.datatable = function (data) {
return {
source: data,
data: data,
// Pagination
current_page: 0,
items_per_page_value: 5,
@jacobshenning
jacobshenning / SocialAuthController.php
Created April 24, 2020 19:23
A dynamic social auth system
<?php
namespace App\Http\Controllers\Frontend;
use App\Http\Controllers\Controller;
use App\Services\SocialAccountService;
use Laravel\Socialite\Facades\Socialite;
class SocialAuthController extends Controller
[
{
"name": "Alpha",
"timezone": 0
},
{
"name": "Bravo",
"timezone": 1
},
{
[
{
"name": "Alpha Beer",
"IBU": 20,
"ABV": 13,
"brewery": "Alpha",
"html": "<div class='card my-5 shadow-sm' style='border-radius: 15px;'><div class='card-body'><h6 class='m-0 text-muted'>Five O' Clock in Germany</h6><h2 class='card-title'>German Pilsner</h2><img src='https://images.unsplash.com/photo-1536638317175-32449deccfc0?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=634&q=80 ' style='width: 100%;'><a class='btn btn-outline-dark btn-block mt-4' href='#'>Find Beer</a></div></div>"
},
{
"name": "Bravo Beer",
@jacobshenning
jacobshenning / flex.css
Last active April 9, 2018 17:42
Flexbox
/* Variables - Add to your variable file */
/* Functions - Add to your function file */
/* Style - Add to your function grid file */
.row {
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
margin-bottom: 1em;
}
.row.reverse {
@jacobshenning
jacobshenning / index.html
Created March 19, 2018 01:26
Scss Flexbox Grid
<!-- Intro -->
<section class="section">
<h1>Scss Flexbox Grid</h1>
<p>This is the documentation for the Scss Flexbox grid, based on the <a href="http://flexboxgrid.com/" target="_blank">flexboxgrid website</a>. </p>
<p> The goal of Scss Flexbox Grid is to provide the same level of functionality and documentation as the original CSS flexbox grid, but with the functionality and power of Scss. </p>
</section>
<section class="section">
<h2>Contents</h2>
<ol>
<li><a href="#Installation">Installation</a></li>
@jacobshenning
jacobshenning / StringTen.js
Created November 17, 2017 19:09
A JavaScript Function to see if a string is longer than 10 characters
// Determines if the string length is greater than 10. Mainly just testing out GitHub Gists
function StringLengthOverTen(string) {
return string.length > 10;
}