Skip to content

Instantly share code, notes, and snippets.

View iamgaby7521's full-sized avatar

Gabriela F. iamgaby7521

View GitHub Profile
@desandro
desandro / classie.js
Last active November 9, 2017 14:41
classie - class helper functions
/*!
* classie - class helper functions
* from bonzo https://github.com/ded/bonzo
*
* classie.has( elem, 'my-class' ) -> true/false
* classie.add( elem, 'my-new-class' )
* classie.remove( elem, 'my-unwanted-class' )
*/
/*jshint browser: true, strict: true, undef: true */
/* normal flexbox */
.flexbox .flex-container {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: flex;
}
.flexbox .flex-container.vertical {
display: -webkit-flex;
display: -moz-flex;
@wpscholar
wpscholar / functions.php
Last active March 1, 2021 13:26
Enqueueing IE conditional stylesheets in WordPress the right way
<?php
add_action( 'wp_enqueue_scripts', 'enqueue_my_styles' );
/**
* Example callback function that demonstrates how to properly enqueue conditional stylesheets in WordPress for IE.
* IE10 and up does not support conditional comments in standards mode.
*
* @uses wp_style_add_data() WordPress function to add the conditional data.
* @link https://developer.wordpress.org/reference/functions/wp_style_add_data/
@salcode
salcode / .gitignore
Last active February 10, 2024 10:56
See https://salferrarello.com/wordpress-gitignore/ for the latest version of my WordPress .gitignore file
# -----------------------------------------------------------------
# .gitignore for WordPress
# Bare Minimum Git
# http://ironco.de/bare-minimum-git/
# ver 20150227
#
# This file is tailored for a WordPress project
# using the default directory structure
#
# This file specifies intentionally untracked files to ignore

LESS Coding Guidelines

Medium uses a strict subset of LESS for style generation. This subset includes variables and mixins, but nothing else (no nesting, etc.).

Medium's naming conventions are adapted from the work being done in the SUIT CSS framework. Which is to say, it relies on structured class names and meaningful hyphens (i.e., not using hyphens merely to separate words). This is to help work around the current limits of applying CSS to the DOM (i.e., the lack of style encapsulation) and to better communicate the relationships between classes.

Table of contents

@schilke
schilke / functions.php
Last active February 23, 2023 18:53
How to load CSS files asynchronously in WordPress (using Scott Jehl's "loadCSS")
<?php
// This is the cleaner code per request of a thread in the LinkedIn group "WordPress"
// ...
// register and enqueue loadCSS
function load_scripts_and_styles() {
// register loadCSS
wp_register_script( 'load-css-async', get_stylesheet_directory_uri() . '/path/to/js/loadCSS.js', array(), '', false );

Font Face

A mixin for writing @font-face rules in SASS.

Usage

Create a font face rule. Embedded OpenType, WOFF2, WOFF, TrueType, and SVG files are automatically sourced.

@include font-face(Samplino, fonts/Samplino);
@drblue
drblue / .gitignore
Last active March 3, 2021 10:31 — forked from salcode/.gitignore
.gitignore for (local) Wordpress theme development
# -----------------------------------------------------------------
# .gitignore for WordPress
# Bare Minimum Git
# Originaly from http://ironco.de/bare-minimum-git/
# ver 20150130
#
# This file is tailored for a WordPress project
# using the default directory structure
#
# This file specifies intentionally untracked files to ignore
@milanaryal
milanaryal / schema-org-structured-data-markup-using-microdata.html
Last active November 4, 2023 13:45
An example of how to mark up a HTML5 webpage using the schema.org schemas and microdata.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Site Title</title>
<link rel="stylesheet" href="/assets/css/style.min.css">
@B-iggy
B-iggy / inline-svg-function.scss
Last active December 13, 2020 11:53
Inline SVG function [SASS]
// set svg d path used as fallback (star)
$svg-d-path: 'm25,1l6,17l18,0l-14,11l5,17l-15,-10l-15,10l5,-17l-14,-11l18,0l6,-17z' !default;
// functions to urlencode the svg string
@function str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
@if $index {
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
}
@return $string;