Skip to content

Instantly share code, notes, and snippets.

<!DOCTYPE html>
<html>
<head>
<title>Box Shadow</title>
<style>
.box {
height: 150px;
width: 300px;
margin: 20px;

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

This is where any fun you might have been having ends. Now it’s time to get serious and talk about rules.

Writing CSS is hard. Even if you know all the intricacies of position and float and overflow and z-index, it’s easy to end up with spaghetti code where you need inline styles, !important rules, unused cruft, and general confusion. This guide provides some architecture for writing CSS so it stays clean and ma

/**
* @fileOverview
* @author <a href="mailto:ovaraksin@googlemail.com">Oleg Varaksin</a>
* @version 0.2
*/
/**
* Whiteboard designer class for element drawing.
* @class
* @param witeboardConfig whiteboard's configuration {@link WhiteboardConfig}
@thachnuida
thachnuida / imgOrientation.js
Last active July 4, 2019 12:02
Angularjs Directive to rotate image base on EXIF orientation value
/* global EXIF */
'use strict';
// Require library: https://github.com/jseidelin/exif-js
// Require Jquery (If not have jquery you must handle DOM by native js code)
/**
@description this directive auto rotate image by css base on image orientation value
Check the example of image orientation here:
https://github.com/recurser/exif-orientation-examples
@example
@thachnuida
thachnuida / fb-post-preview.directive.js
Last active March 7, 2019 12:43
Angular directive to embed Facebook public post
(function () {
'use strict';
/**
* @desc Direictive to embed facebook post
* @example <fb-post-preview data-href="vm.postUrl"></fb-post-preview>
*/
angular
.module('fbDirective')
.directive('fbPostPreview', fbPostPreview);
@thachnuida
thachnuida / Sublime text 3 build from bat file
Created February 6, 2016 02:31
Go to Tools -> Build System -> New Build System
{
"cmd": ["C:\\Users\\Thach Nguyen\\build.bat"]
}
@thachnuida
thachnuida / Restangular-Upload-File.js
Created February 6, 2016 03:51
Restangular Upload File
var fd = new FormData();
fd.append('file', vm.selectedLogo);
Restangular.one('/api/admin/settings/logo')
.withHttpConfig({transformRequest: angular.identity})
.customPOST(fd, '', undefined, {'Content-Type': undefined})
.then(function() {
getLogo();
});
@thachnuida
thachnuida / 2-letters 3-letters country codes
Created April 20, 2016 08:32
2-letters 3-letters country codes
// http://country.io/iso3.json
{
BD: "BGD",
BE: "BEL",
BF: "BFA",
BG: "BGR",
BA: "BIH",
BB: "BRB",
WF: "WLF",
@thachnuida
thachnuida / flat-object.js
Last active October 12, 2016 04:05
Flat object
var a = {
b: {
c: {
d: {
e: 'text 1'
}
}
},
f: 'text'
};
@thachnuida
thachnuida / requireJsFiles.py
Created April 11, 2018 07:16
Auto insert import other js files in current folder to current file
# Add to key binding { "keys": ["ctrl+1"], "command": "require_js_files"}
import sublime
import sublime_plugin
import os
class RequireJsFilesCommand(sublime_plugin.TextCommand):
def run(self, edit):
current_folder = os.path.dirname(self.view.file_name())
current_file_name = os.path.basename(self.view.file_name())