Skip to content

Instantly share code, notes, and snippets.

View bohman's full-sized avatar

Linus Bohman bohman

33 followers · 42 following
View GitHub Profile
@bohman
bohman / columns.scss
Last active March 17, 2021 14:03
Simple flexbox columns with css variables. There are a few gotchas since we ensure alignment with negative margin-bottom and margin-left instead of nth-child, but all in all it works pretty well.
[class*=columns-] {
--columns: 2;
--columns-gutter: 40px;
--columns-width: calc(100% / var(--columns) - var(--columns-gutter));
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
margin-bottom: calc(var(--columns-gutter) * -1);
@bohman
bohman / viewport.js
Last active November 20, 2020 11:37
jQuery get viewport size
// -----------
// Debugger that shows view port size. Helps when making responsive designs.
// -----------
function showViewPortSize(display) {
if(display) {
var height = jQuery(window).height();
var width = jQuery(window).width();
jQuery('body').prepend('<div id="viewportsize" style="z-index:9999;position:fixed;top:40px;left:5px;color:#fff;background:#000;padding:10px">Height: '+height+'<br>Width: '+width+'</div>');
jQuery(window).resize(function() {
@bohman
bohman / ga-events.js
Last active April 6, 2020 16:10
Quick and dirty way to collect GA-events in one file. No, doesn't need jQuery. I'm just lazy at the moment.
(function ($) {
window.sw_ga = {};
//
// Events
//
sw_ga.events = [
// Menu toggle
@bohman
bohman / nginx-conf.md
Last active November 30, 2018 08:58
Valet 502 bad gateway - upstream sent too big header

Valet is awesome, but I got seemingly random 502 bad gateway issues on larger sites. After looking in the logs (~/.config/valet/Log) I discovered the error was upstream sent too big header. Googling led me to laravel/valet#290 where the following solution fixed it:

  1. Create ~/.config/valet/Nginx/all.conf with this:
proxy_buffer_size   4096k;
proxy_buffers   128 4096k;
proxy_busy_buffers_size   4096k;
  1. Append this to /usr/local/etc/nginx/fastcgi_params
@bohman
bohman / hashes.js
Last active March 10, 2016 10:53
For those times when you need to imitate query parameters with hashes
/**
*
* When you need to use the hash to imitate query parameters,
* like so:
*
* http://whatever.man/#key=value&another_key=another_value
*
**/
// Set URL to a specific hash. It overrides any existing hash.
@bohman
bohman / placeholder.css
Created January 8, 2016 13:15
Quick example of what a placeholder class might look like when wireframing a site
.placeholder {
background-color: #222;
padding: 80px 0;
text-align: center;
color: rgba(255, 255, 255, .4);
font-weight: bold;
text-transform: uppercase;
}
.placeholder:after {
@bohman
bohman / responsiveeasteregg.css
Last active December 13, 2015 22:49
Small responsive easter egg. Do with it as you wish.
/*
This is pretty much the smallest you can make the firefox screen without programmatically setting the width.
Chrome and Safari prevents you from going below 400px. An iPhone is 320px, and the smallest Android about 240px IIRC.
The site is pretty much useless like this, so... have an egg.
*/
@media only screen and (max-width: 92px) {
body * {
display: none;
}
@bohman
bohman / wp_update_url.sql
Created January 16, 2013 16:04
Simple query to update URLs in a WP install. Useful when moving a site. Wrote it a long time ago, lost it when my computer got stolen, was frustrated, decided to store it here.
SET @oldurl = 'dev1.nollfyranoll.se';
SET @newurl = 'pilgrimsvagen.se';
UPDATE wp_posts SET POST_CONTENT = replace(POST_CONTENT, @oldurl, @newurl);
UPDATE wp_posts SET GUID = replace(GUID, @oldurl, @newurl);
UPDATE wp_options SET OPTION_VALUE = replace(OPTION_VALUE, @oldurl, @newurl);
@bohman
bohman / stretch.css
Last active December 11, 2015 02:19
Stretch: simple way to stretch boxes to edge of screen without additional elements. Here's a good article with description: http://css-tricks.com/full-browser-width-bars/
.center {
width: 980px;
margin-left: auto;
margin-right: auto;
}
html, body {
overflow-x: hidden; /* Prevents horizontal scroll */
}
@bohman
bohman / sort_array_on_value.php
Created September 12, 2012 07:29
sort_array_on_value() - sorting multidimensional arrays into hyperspace
//
// Easy lil' sorting thingamajig. Mad creds to Antonio Navarro of 040.
//
function sort_array_on_value($array_to_sort, $sort_on_value, $descending = false) {
$sortArr = array();
foreach ($array_to_sort as $key => $value) {
$sortArr[$key] = $value[$sort_on_value];
}