Skip to content

Instantly share code, notes, and snippets.

Avatar
🏞️
Working from home

Whizark whizark

🏞️
Working from home
View GitHub Profile
View keybase.md

Keybase proof

I hereby claim:

  • I am whizark on github.
  • I am whizark (https://keybase.io/whizark) on keybase.
  • I have a public key ASBPz9RqQK6B7fji2mXHl7t6WYCUSwfm5z-ZMBJNSmDr6Qo

To claim this, I am signing this object:

@whizark
whizark / SassMeister-input-HTML.html
Last active Aug 29, 2015
HTML/CSS/Sass: Aggregation vs Composition #css #sass
View SassMeister-input-HTML.html
<!-- .list is an aggregation of .li -->
<ul class="list">
<li class="list--li li">Item</li>
</ul>
<!-- .list is a composition of .list--li -->
<ul class="list">
<li class="list--li">Item</li>
</ul>
@whizark
whizark / SassMeister-input-HTML.html
Last active Aug 13, 2018
CSS/Sass: Element Property by data attribute. #css #sass
View SassMeister-input-HTML.html
<div class="app">
<div class="app--note note">
<ul class="note--list list">
<li class="list--li li" data-state="active">Item</li>
</ul>
</div>
</div>
@whizark
whizark / SassMeister-input-HTML.html
Last active Aug 29, 2015
CSS/Sass: Robust/Scalable Layered CSS Architecture #sass #css
View SassMeister-input-HTML.html
<div class="app">
<!--
An element should know only its own child elements,
child elements should not know the parent element.
(at least, in HTML)
Therefore, well-structured element has ONLY 1-2 class(es).
-->
<div class="app--note note">
<ul class="note--list list">
<li class="list--li li">Item</li>
@whizark
whizark / SassMeister-input.scss
Created Jan 25, 2015
Sass: Pseudo `undefined` value to distinguish `null`. #sass
View SassMeister-input.scss
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
// Sass: Pseudo `undefined` value to distinguish `null`.
//
// http://twitter.com/whizark
//
// Other ideas
@whizark
whizark / SassMeister-input.scss
Last active Aug 29, 2015
Sass: The easiest way of creating new scope at root-level witout any selectors. #sass
View SassMeister-input.scss
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
// Sass: The easiest way of creating new scope at root-level witout any selectors.
//
// http://twitter.com/whizark
//
// Other ideas
@whizark
whizark / SassMeister-input-HTML.html
Last active Aug 29, 2015
OOSASS: Writting OOP-like CSS Component (Factory, Accessor, Dependency Injection etc.) #sass
View SassMeister-input-HTML.html
<h2>list</h2>
<ul class="list">
<li class="list\item">Item</li>
<li class="list\item">Item</li>
</ul>
<h2>note-list</h2>
<ul class="note-list">
<li class="note-list\item">Item</li>
<li class="note-list\item">Item</li>
@whizark
whizark / SassMeister-input.scss
Last active Aug 29, 2015
Sass: Typed value with the descriptor. #sass
View SassMeister-input.scss
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
// Sass: Typed value with the descriptor.
//
// Typed value factory & validator using Map
// https://gist.github.com/whizark/b42f5d52c3caa2ad5f43
//
@whizark
whizark / SassMeister-input-HTML.html
Last active Oct 27, 2016
Sass: placeholder-exists() in Sass #sass
View SassMeister-input-HTML.html
<div class="warning">
<p>A Warning Message.</p>
</div>
@whizark
whizark / SassMeister-input-HTML.html
Last active Aug 29, 2015
Sass: Element-type-based conditional styles inside Mixin #sass
View SassMeister-input-HTML.html
<a class="button">A</a>
<button class="button">button</button>
<a class="button-2">A</a>
<button class="button-2">button</button>