bcinarli

# define bourbon path, use a common library for preventing duplicates
add_import_path "path/to/your/bourbon/lib"

### -->> project paths, delete/comment if you use scout, codekit etc.
environment = :production # removes single line comments, keeps css comments
output_style = :compact

css_dir = "styles" #relative to project root
sass_dir = "styles-sass" #relative to project root
images_dir = "images" #relative to project root

bcinarli

:root {
	color-scheme: dark;
	--primary: #bb86fc;
  --primary-variant: #3700b3;
  --on-primary: #000;
  --secondary: #03dac5;
  --secondary-variant: #d2e3fc;
  --on-secondary: #000;
  --on-secondary-variant: #018786;
  --surface: #121212;

bcinarli

const fs = require('fs');
const { rm } = require('./utils/file-actions');

const cwd = process.cwd();

const rm = (path) => {
  if (fs.existsSync(path)){
    exec(`rm -r ${ path }`, (err) => {
      if (err) {
        console.log(err);

bcinarli

@mixin fontface($name, $file, $weight: normal, $style: normal){
  @font-face {
    font-family: "#{$name}";
    src: url('../fonts/#{$file}.eot');
    src: url('../fonts/#{$file}.eot?#iefix') format('embedded-opentype'),
         url('../fonts/#{$file}.woff') format('woff'),
         url('../fonts/#{$file}.ttf') format('truetype'),
         url('../fonts/#{$file}.svg?#webfont') format('svg');
    font-weight: $weight;
    font-style: $style;

bcinarli

# Install brew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

# Install Chrome
brew cask install google-chrome

# Install hyper
brew cask install hyper
hyper install hyperline
hyper install an-old-hype

bcinarli

// Sometimes you want to share some variables between your SCSS and JS/JSX code
// To do this, you can levarage the :export command in SCSS.

$alertInfo: #b8d3e8;
$alertWarning: #fdf9c3;
$alertSuccess: #cfc;
$alertError: #e63f3f;

// this exports the variable to be available in JS
:export {

bcinarli

/**
* 1. http://www.paulirish.com/2012/box-sizing-border-box-ftw/
*    http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
*    http://fatihhayrioglu.com/css3-box-sizing-ozelligi/
*
* 2. http://aestheticallyloyal.com/public/optimize-legibility/
*
* 3. http://maxvoltar.com/archive/-webkit-font-smoothing
*
* 4. http://maximilianhoffmann.com/posts/better-font-rendering-on-osx

bcinarli

Sass buttons

Button mixin sample build with Sass

A Pen by Bilal Çınarlı on CodePen.

License.

bcinarli

var app = app || {};

(function(){
  "use strict";
  
  app.Collection = Backbone.Collection.extend({
    model: app.Model,
    // initial sort when collection fetched first time
    comparator: "id"
  });

bcinarli

/* @author Bilal Cinarli */

/** -------------------------------------------
    Text Related Functions
    ------------------------------------------- **/
/**
  * Rem to PX
  */
@function rem-to-px($font-size) {
    $u: unit($font-size);