zspecza zspecza

## index.html
<!DOCTYPE html>
<html>
  <head>
<meta name="description" content="Futuristic HUD single-div no-image CSS3 loading spinner" />
    <title>CSS3 Loading Spinner</title>
  </head>
  <body>
    <div id="spinner"></div>
  </body>
</html>

## solopong.coffee
###
# Solo Pong - Declan de Wet
# TODO: Prevent paddle from going out of the viewport
# TODO: Implement collision animations
# TODO: Music and sound
# TODO: Keyboard controls
###


# Create a self-instantiating shim/polyfill for the requestAnimationFrame API, if it does not exist,

## vertical-rhythm.styl
// Vertical Rhythm ported from SASS/Compass
// Works exactly as before, with four exceptions:
// 1. rhythm() is a mixin, $rhythm() is a function. Stylus doesn't differentiate between same-name mixins and functions
// 2. All of the variables you're used to lack the dollar sign ($) prepend.
// 3. debug-vertical-alignment uses a temporary online image solution via http://basehold.it
// 4. There is no h-borders alias. Use horizonatal-borders instead.

// The base font size.
base-font-size ?= 16px

## stylus-best-practices.md

      
              1 file
            
          
              13 forks
            
          
              7 comments
            
          
              73 stars
            
          
                zspecza
                / stylus-best-practices.md
            
            
              Last active
              May 27, 2021 05:25
            
              
                Stylus Best Practices
              
          
    Stylus Best Practices

Introduction

This is a curated set of conventions and best practices for
Stylus, an expressive, dynamic, robust
and advanced CSS preprocessor. Frustrated with there not being a set of
conventions set in place (that could be easily found), I set forth to find out
on my own.

  
## sublimesettings.json
{
	"auto_complete_commit_on_tab": true,
	"bold_folder_labels": true,
	"caret_style": "phase",
	"color_scheme": "Packages/Tomorrow Color Schemes/Tomorrow-Night.tmTheme",
	"create_window_at_startup": false,
	"default_line_ending": "unix",
	"detect_slow_plugins": false,
	"draw_minimap_border": true,
	"ensure_newline_at_eof_on_save": true,

## brainfuck.coffee
###
brainfuck() function
description: takes a string of Brainfuck code and returns the parsed result
usage: brainfuck('++++++++++[>+++++++>++++++++++>+++>+<<<<-]>++.>+.+++++++..+++.>++.<<+++++++++++++++.>.+++.------.--------.>+.>.')
       // output: 'Hello World.'
###

brainfuck = (code) ->
  inp = '23\n'
  out = ''

## css-preprocessor-spec.md

      
              1 file
            
          
              0 forks
            
          
              1 comment
            
          
              3 stars
            
          
                zspecza
                / css-preprocessor-spec.md
            
            
              Last active
              December 17, 2022 21:01
            
              
                The Coolest CSS Pre-Processor MicroSpec You'll Ever See
              
          
    CSS Preprocessor Micro-Specification 

Introduction

This is a conceptual specification for what could/would/should be the preprocessor to end all preprocessors. Unfortunately, it is just that - a specification. I had made quite a few attempts to create a CSS preprocessor, but I am far too inexperienced with advanced programming to succeed at this task. I got as far as the scanner and half of a half-working tokenizer before proceeding to pull my hair out. So I gave up, and decided just to list the proposed features here for reference. Perhaps these will make their way into existing pre-processors, or even inspire the birth of a new one.
First off, the basic features:

Pretty much everything the 3 leading pre-processors offer in terms of:

  
## number-base-conversion.js
;(function(undefined) {

  'use strict';

  var debug = function(err) {
    console.error(err.message + '\n' + err.stack);
  };

  try {

## modernizr.styl
/* private modernizr mixin
 *
 * downside - only works on single-element selectors. nesting still works though.
 *
 * @param features - a list of modernizr test classes e.g.: csstransitions opacity OR csstransitions, opacity
 * @param declaration - the {block} of content passed by the block mixins +yep()/+nope()
 * @param support - boolean, true if testing support, false if testing no support
 *
 * 1. if testing for support, set selector to empty string
 *    if testing for no support, set selector to ".no-js" appended by

## amok_browserify_gulpfile.js
/*=====================================*\
  build tasks
\*=====================================*/

/**
 * This gulpfile is optimised for developing
 * React.js apps in ES6 through Babel, and is
 * designed to live-inject CSS, HTML and even JavaScript
 * changes so maintaining state in an application when
 * editing code is super easy.
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="description" content="Futuristic HUD single-div no-image CSS3 loading spinner" />
	<title>CSS3 Loading Spinner</title>
	</head>
	<body>
	<div id="spinner"></div>
	</body>
	</html>
	###
	# Solo Pong - Declan de Wet
	# TODO: Prevent paddle from going out of the viewport
	# TODO: Implement collision animations
	# TODO: Music and sound
	# TODO: Keyboard controls
	###


	# Create a self-instantiating shim/polyfill for the requestAnimationFrame API, if it does not exist,
	// Vertical Rhythm ported from SASS/Compass
	// Works exactly as before, with four exceptions:
	// 1. rhythm() is a mixin, $rhythm() is a function. Stylus doesn't differentiate between same-name mixins and functions
	// 2. All of the variables you're used to lack the dollar sign ($) prepend.
	// 3. debug-vertical-alignment uses a temporary online image solution via http://basehold.it
	// 4. There is no h-borders alias. Use horizonatal-borders instead.

	// The base font size.
	base-font-size ?= 16px
	{
	"auto_complete_commit_on_tab": true,
	"bold_folder_labels": true,
	"caret_style": "phase",
	"color_scheme": "Packages/Tomorrow Color Schemes/Tomorrow-Night.tmTheme",
	"create_window_at_startup": false,
	"default_line_ending": "unix",
	"detect_slow_plugins": false,
	"draw_minimap_border": true,
	"ensure_newline_at_eof_on_save": true,
	###
	brainfuck() function
	description: takes a string of Brainfuck code and returns the parsed result
	usage: brainfuck('++++++++++[>+++++++>++++++++++>+++>+<<<<-]>++.>+.+++++++..+++.>++.<<+++++++++++++++.>.+++.------.--------.>+.>.')
	// output: 'Hello World.'
	###

	brainfuck = (code) ->
	inp = '23\n'
	out = ''
	;(function(undefined) {

	'use strict';

	var debug = function(err) {
	console.error(err.message + '\n' + err.stack);
	};

	try {
	/* private modernizr mixin
	*
	* downside - only works on single-element selectors. nesting still works though.
	*
	* @param features - a list of modernizr test classes e.g.: csstransitions opacity OR csstransitions, opacity
	* @param declaration - the {block} of content passed by the block mixins +yep()/+nope()
	* @param support - boolean, true if testing support, false if testing no support
	*
	* 1. if testing for support, set selector to empty string
	* if testing for no support, set selector to ".no-js" appended by
	/=====================================\
	build tasks
	\=====================================/

	/**
	* This gulpfile is optimised for developing
	* React.js apps in ES6 through Babel, and is
	* designed to live-inject CSS, HTML and even JavaScript
	* changes so maintaining state in an application when
	* editing code is super easy.