Skip to content

Instantly share code, notes, and snippets.

View kenold's full-sized avatar

Kenold Beauplan kenold

4 followers · 0 following
View GitHub Profile
@kenold
kenold / desirdesigns-custom.css
Last active January 14, 2020 17:29
/* Ken's custom's CSS - Questions? flexwebagency@gmail.com */
/* remove horizontal scroll */
body {
overflow-x: hidden;
}
/* custom classes */
.d-block {
display: block!important;
@kenold
kenold / font-line-height-mixin.scss
Last active October 23, 2019 14:31
Font sizing & line height mixin
@mixin font-size($sizeValue: 16, $line: $sizeValue * 1.5) {
font-size: ($sizeValue) + px;
line-height: ($line) + px;
font-size: ($sizeValue / 16) + rem;
line-height: ($line / 16) + rem;
}
// credit https://coderwall.com/p/ml9zxg/sass-mixin-for-rem-font-sizing-line-height-with-px-fallback
@kenold
kenold / package.json
Created October 17, 2019 15:18
Node Sass Starter
{
"name": "site-name",
"version": "1.0.0",
"description": "Site Description",
"main": "index.js",
"scripts": {
"watch:sass": "node-sass sass/main.scss css/style.css -w",
"devserver": "live-server",
"start": "npm-run-all --parallel devserver watch:sass",
"compile:sass": "node-sass sass/main.scss css/style.comp.css",
@kenold
kenold / bulma-nav.css
Created October 16, 2019 14:11
Bulma menu animation - needs improvement
.navbar-menu {
display: block;
opacity: 0;
position: absolute; /* or float: left; width: 100%;*/
left: 0;
right: 0;
transform: translateY(-50%);
transition: all .4s ease-in-out;
@kenold
kenold / blog-card.html
Last active September 24, 2019 16:43
CSS Blog Card
<div class="card">
<a href="#">
<figure class="card__media">
<img src="image.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<div class="card__category">Blog</div>
<div class="card__title">Card Title</div>
</div>
<div class="card__footer">
@kenold
kenold / Jquery Text Anim
Last active June 27, 2019 19:19
<!DOCTYPE html>
<html>
<head>
<title>Text Anim</title>
<style type="text/css">
#word {
background: yellow;
width: 200px;
}
</style>
@kenold
kenold / handlebars.helpers.ifEquals.js
Created May 16, 2018 15:11 — forked from niksumeiko/handlebars.helpers.ifEquals.js
Handlebars.js templates engine custom IF condition helper. Allows to compare values one to each other like you are used to in programming.
// Compares first value to the second one allowing entering IF clouse if true.
// Otherwise entering ELSE clause if exist.
Handlebars.registerHelper('ifEquals', function(a, b, options) {
if (a === b) {
return options.fn(this);
}
return options.inverse(this);
});
@kenold
kenold / cloudSettings
Last active May 3, 2018 22:58
Visual Studio Code Settings Sync Gist
{"lastUpload":"2018-05-03T22:58:09.915Z","extensionVersion":"v2.9.2"}
@kenold
kenold / index.html
Last active February 11, 2017 00:46
Generate YAML Front Matter from Pocket JSON API in Hugo Static Site Generator
<!-- created by Kenold Beauplan // Twitter @kenoldb -->
{{ $url := "/data/tutorials.json" }}
{{ $data := getJSON $url}}
<!-- "list-unstyled" is a Bootstrap calss that removes the bullet points -->
<ul class="list-unstyled">
{{ range $data.list }}
{{ $item := . }}
<li>---</li>
<li>title:
@kenold
kenold / index.html
Last active February 10, 2017 15:15
HTML todo list
<body>
<h1>ToDo List</h1>
<ul>
<li>Go to the store</li>
<li>Clean the office</li>
<li>Wash the car</li>
<li>Backup files to cloud</li>
</ul>
</body>