Skip to content

Instantly share code, notes, and snippets.

Avatar
🚀
Knocking it out of the planet! 🌎

Steven Williams StevenGFX

🚀
Knocking it out of the planet! 🌎
View GitHub Profile
@pixleight
pixleight / carousel.css
Created Dec 8, 2020
Tailwind CSS / Alpine.js Image Carousel with Lightbox
View carousel.css
@philwolstenholme
philwolstenholme / ######-phil-wolstenholme-drupalcon-europe-2020-utility-first-css.md
Last active Nov 1, 2021
Phil Wolstenholme - DrupalCon Europe 2020 - Utility-first CSS
View ######-phil-wolstenholme-drupalcon-europe-2020-utility-first-css.md

Hello DrupalCon! 👋

Here's a big dump of code examples from my slides, plus some examples that didn't make it to the final cut.

The snippets should be organised by slide number, e.g. #46--_search.scss is the snippet of search-related SCSS shown on slide 46.

My slides

Here's a PDF of my slides (via Google Drive) for your reference, or if Zoom goes wrong!

View react_samples_list.md
@raphaellarrinaga
raphaellarrinaga / drupal_8_twig_cheatsheet.md
Last active Sep 8, 2021
[Drupal 8 Twig cheatsheet] #tags: drupal8, twig, cheatsheet
View drupal_8_twig_cheatsheet.md

Drupal 8 Twig cheatsheet

Please note I created that sheet as a personal side note/draft and not everything is fully tested. There could be errors or better things to do. So if you spot something wrong or something that can be improved, feel free to comment below and I will do the changes.

Getting Drupal 8 field values in Twig

Image path: {{ file_url(content.field_name['#items'].entity.uri.value) }}

@bogvsdev
bogvsdev / image_src.html.twig
Last active May 1, 2020
Drupal 8 twig, get image url
View image_src.html.twig
{% set the_image = item.content['#field_collection_item'].field_featurette_image %}
<img src="{{ file_url(the_image.entity.uri.value) }}" alt="{{ the_image.alt }}" title="{{ the_image.title }}">
or
<img src="{{file_url(node.field_hotel_image.entity.uri.value)}}" alt="3242">
@startinggravity
startinggravity / menu--social-media.html.twig
Created Oct 30, 2015
Use a Drupal menu as a social media links block
View menu--social-media.html.twig
{#
/**
* @file
* Theme override to display a social media links from a menu.
*
* Available variables:
* - menu_name: The machine name of the menu.
* - items: A nested list of menu items. Each menu item contains:
* - attributes: HTML attributes for the menu item.
* - below: The menu item child items.
@sachbearbeiter
sachbearbeiter / image.html.twig
Last active Sep 27, 2021
D8: Theming examples: Images: How to print individual image values and suppress width and height via the image.html.twig template ... *First results of struggling through Drupal 8 - better solutions are probably out there! **Drupal 8 is still Beta - improvements through API modifications are possible!
View image.html.twig
{#
/**
* @file
* Default theme implementation of an image.
*
* Available variables:
* - attributes: HTML attributes for the img tag.
* - style_name: (optional) The name of the image style applied.
*
* @see template_preprocess_image()
@KartikTalwar
KartikTalwar / CoderDojo.md
Last active Aug 1, 2018
GitHub CoderDojo - Intro to D3.js
View CoderDojo.md

Animations in JavaScript

D3.js

Library that uses HTML, CSS and SVG to bring data to life.

Setting Up