Skip to content

Instantly share code, notes, and snippets.

View syahrasi's full-sized avatar

Syahrasi syahrasi

10 followers · 3 following
View GitHub Profile
@syahrasi
syahrasi / styles.css
Created December 20, 2011 15:47 — forked from sevenspark/styles.css
ThemeSwitcher + Preview
/* Preview hover styles */
#theme_list ul li {
position:relative;
}
.product-preview{
position:absolute;
left:100%;
top:-1px;
margin-left:1px;
background:#222;
@syahrasi
syahrasi / sinatra_jquery_test.rb
Created May 8, 2012 06:51 — forked from sebastiangeiger/sinatra_jquery_test.rb
require 'sinatra'
require 'dm-core'
require 'dm-migrations'
require 'haml'
DataMapper.setup(:default, 'sqlite3::memory:')
class Message
include DataMapper::Resource
@syahrasi
syahrasi / Gemfile
Created July 25, 2012 21:39 — forked from jsahlen/Gemfile
My Guard-based build system for front-end assets – see my blog post at http://monospace.se/posts/guard-build-system
source :rubygems
# V8 JavaScript Engine (for Uglifier)
gem "therubyracer"
# SASS & Compass
gem "sass", "~> 3.2.0.alpha"
gem "compass"
# For concatenation/compression
@syahrasi
syahrasi / Gemfile
Created August 3, 2012 19:30 — forked from dvessel/README.mdown
Sass+Compass, Guard, LiveReload
# ~/Gemfile
source "http://rubygems.org"
group :development do
gem 'compass' # Depends on Sass, will be installed automatically.
gem 'compass-960-plugin' # 960.gs
gem 'compass-validator' # So you can `compass validate`.
gem 'oily_png' # Faster Compass sprite generation.
gem 'css_parser' # Helps `compass stats` output statistics.
@syahrasi
syahrasi / README.md
Created October 5, 2012 05:03 — forked from necolas/README.md
Experimenting with component-based HTML/CSS naming and patterns

Template Components

Used to provide structural templates.

Pattern

t-template-name
t-template-name--modifier-name
t-template-name__subcomponent-name--subcomponent-modifier-name
@syahrasi
syahrasi / Guardfile
Created December 2, 2012 07:42
Guardfile for shopify theme development
# ignore temporary file
ignore /.*~/
notification :tmux,
:display_message => true,
:default_message_format => '%s >> %s',
# the first %s will show the title, the second the message
# Alternately you can also configure *success_message_format*,
# *pending_message_format*, *failed_message_format*
:line_separator => ' > ', # since we are single line we need a separator
@syahrasi
syahrasi / form-example.php
Created February 15, 2013 15:30 — forked from somatonic/form-example.php
<?php
$out = '';
// create a new form field (also field wrapper)
$form = $modules->get("InputfieldForm");
$form->action = "./";
$form->method = "post";
$form->attr("id+name",'subscribe-form');
@syahrasi
syahrasi / oocss-space-output.css
Last active September 10, 2018 18:24
OOCSS Space Helpers
/*
https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
p,m = padding,margin
a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
*/
.ptn, .pvn, .pan { padding-top: 0px !important; }
.pts, .pvs, .pas { padding-top: 5px !important; }
@syahrasi
syahrasi / SassMeister-input.scss
Last active December 18, 2015 08:38
Display Comment mixin
// ---
// Compass (v0.13.alpha.4)
// Sass (v3.2.9)
// ---
$use-comments: true !default;
@mixin display_comments() {
@if $use-comments {
@syahrasi
syahrasi / Headings.scss
Last active December 31, 2020 12:59
// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----
$font-sizes: 6 7 8 9 10 11 12 14 16 18 21 24 36 48 60 72 84 96;
$selector-sizes: ".micro" ".milli" "h6, .zeta" "h5, .epsilon" "h4, .delta" "h3, .gamma" "h2, .beta" "h1, .alpha" ".kilo" ".mega" ".giga";
$base-font-size: 16;
$base-font-size-idx: index($font-sizes, $base-font-size);
$font-class-start-idx: $base-font-size-idx - 3;