Skip to content

Instantly share code, notes, and snippets.

View danny-englander's full-sized avatar

Danny Englander (he/him) danny-englander

View GitHub Profile
@Evanion
Evanion / grid-push-pull.less
Last active October 26, 2021 08:57
Responsive push/pull for uikit
/* Small */
@media (max-width: @breakpoint-small-max) {
[class*='uk-push-small-'],
[class*='uk-pull-small-'] { position: relative; }
/*
* Push
*/
@AllThingsSmitty
AllThingsSmitty / accessible-menu.css
Last active October 1, 2021 14:42
Accessible dropdown menu
/* Top level nav */
.nav {
float: left;
margin: 20px 0;
}
/* Dropdowns */
.nav ul {
position: absolute;
top: 2.5em;
@roboshoes
roboshoes / touchmouse.js
Created April 13, 2012 10:43
This snippet maps mouse events and touch events onto one single event. This makes it easier in the code since you have to listen to only one event regardles whether it's desktop or mobile.
(function() {
/* == GLOBAL DECLERATIONS == */
TouchMouseEvent = {
DOWN: "touchmousedown",
UP: "touchmouseup",
MOVE: "touchmousemove"
}
/* == EVENT LISTENERS == */
@LordZardeck
LordZardeck / silder
Last active July 10, 2021 03:56
Allows videos within a flexslider to stop the slider when playing, and continue the slider when done.
$(function() {
var slider, // Global slider value to force playing and pausing by direct access of the slider control
canSlide = true; // Global switch to monitor video state
// Load the YouTube API. For some reason it's required to load it like this
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
@thejimbirch
thejimbirch / metatag_example.php
Created August 19, 2019 20:27 — forked from mortenson/metatag_example.php
OR statements in metatags...
<?php
/**
* Implements hook_metatags_attachments_alter().
*
* This function allows you to define fallback tokens in case a field is empty.
*
* If all fallback values are empty, the tag will be empty.
*
* Example: [node:field_image:medium]||[node:field_legacy_image:medium]||/fallback.png
@thejimbirch
thejimbirch / paragraph--default.html.twig
Last active March 22, 2021 18:29
Drupal 8 Template for Bootstrap Paragraphs customized for Width and Background color fields.
{#
/**
* @file
* Default theme implementation to display a paragraph in Bootstrap Paragraphs.
*
* Available variables:
* - paragraph: Full paragraph entity.
* - id: The paragraph ID.
* - bundle: The type of the paragraph, for example, "image" or "text".
* - authorid: The user ID of the paragraph author.
@jpetitcolas
jpetitcolas / even-odd-row.twig
Created January 8, 2013 06:29
How to differenciate odd and even rows with Twig?
<table>
{% for record in records %}
<tr class="record{% if loop.index is divisibleby(2) %}even{% else %}odd{% endif %}">
<td>{{ record.id }}</td>
<td>{{ record.title }}</td>
</tr>
{% endfor %}
</table>
@jameswilson
jameswilson / responsive-modal.css
Last active March 5, 2021 19:59
Drupal Ctools Responsive Modal
/* Override inline dom styles from modal.js */
#modalContent {
position: fixed !important;
top: 12% !important;
bottom: 12% !important;
right: 4% !important;
left: 4% !important;
}
/* Limit max width to 1000px */
div.ctools-modal-content {
@DESIGNfromWITHIN
DESIGNfromWITHIN / Gulpfile.js
Last active March 4, 2021 21:00
Gulpfile.js example Uses browser-sync, node-neat, gulp and gulp-sass
/*
Gulpfile.js file for the tutorial:
Using Gulp, SASS and Browser-Sync for your front end web development - DESIGNfromWITHIN
http://designfromwithin.com/blog/gulp-sass-browser-sync-front-end-dev
Steps:
1. Install gulp globally:
npm install --global gulp
@NikLP
NikLP / zebra.html.twig
Last active February 25, 2021 12:55
Set zebra-style (odd/even) classes in twig loop in drupal 8 (bootstrap) theme
<div{{ attributes.addClass('container') }}>
{% for item in items %}
{# NB! notation: loop.index is 1 start, loop.index0 is zero start #}
<div class="row {{ loop.index0 is odd ? 'zebra-odd' : 'zebra-even' }}">
<div{{ item.attributes }}>{{ item.content }}</div>
</div>
{% endfor %}
</div>