raulghm

// ----
// libsass (v3.2.5)
// ----

$themes: (
  red: (
    background: red,
    color: white
  ),
  blue: (

raulghm

Semantic Versioning

1.2.3

major	minor	patch
1	2	3

major: incompatible API changes

raulghm

import datetime, getpass
import sublime, sublime_plugin
 
class Comments_cssCommand(sublime_plugin.TextCommand):
	def run(self, edit):

		comment = "/** \n * Name: Component \n * \n * Created: %s \n * Author: Raúl Hernández M. <[email protected]> \n */ \n\n" % (datetime.datetime.now().strftime("%Y-%m-%d %H:%M"))

		self.view.insert(edit, 0, comment)

raulghm

// icons  	
// type item loop
$list: 
	test list,
	article file-text-o,
	video film,
	pdf file-pdf-o,
	link link,
	audio volume-up;

raulghm

<snippet>
	<content><![CDATA[
// https://github.com/suitcss/suit/blob/master/doc/naming-conventions.md

// ComponentName
// ComponentName--modifierName
// ComponentName-descendantName
// ComponentName.is-stateOfComponent
// u-utilityName

raulghm

// https://github.com/suitcss/suit/blob/master/doc/naming-conventions.md

// u-utilityName
// ComponentName
// ComponentName--modifierName
// ComponentName-descendantName
// ComponentName.is-stateOfComponent

$module: 'ComponentName';

raulghm

.block
  .block__element
    p Lorem ipsum
    
  .block__element--modifier
    p Lorem ipsum
    
  .block__element.block__element--modifier
    p Lorem ipsum

raulghm

<snippet>
	<content><![CDATA[
\$module: 'block';

.#{\$module} {

  &__element {}

  &--modifier {
    .#{\$module}__element {}

raulghm

$module: 'block';

.#{$module} {

  &__element {
  }

  &--modifier {
    .#{$module}__element {
    }

raulghm

.container {
  .inner {
    width: 100%;
    margin: 100px;
  }

  .div {
    color: rgb(255, 237, 93);
  }
}