Tag : scss

【mixin】色相を変えてグラデーションを鮮やかにしたボタンを作るmixin

色相を変えてグラデーションを鮮やかにしたボタンを作って、マテリアルデザインに合うようなelevation(高度)を設定したものを作るmixinです。 参考...

【SCSS】SCSS(SASS)で文字をエスケープしたい

前回のCSSグリッドのmixinを作っていた際に、はまったのが文字のエスケープ。 なぜはまったかといえば… [crayon-5a8f2ce25130f9...

【CSSグリッド】CSS Grid Layout時代に合わせてmixinを作ってみる

2017年3月にモダンブラウザで一斉に対応されるようになった、CSS Grid Layout。 現在、実験&勉強中です。 学んでいる過程でどうもIEやE...

【マテリアルデザイン】高度に合わせたbox-shadowを設定したclassを作る

Googleのマテリアルデザインは、フラットデザインに影がついてるだけと思われがちですが、厳密にたくさんのルールが存在しています。そのあたりはマテリアル...

【2018年版】media queryにおけるBreakPointの設定をmixinにする

2016年にあらかじめブレイクポイントごとのmixinがあると便利なはず!と思い、Breakpointに関するmixinを作りました。が、あれから2年たってみて...

【mixin】テキストリンクの色を一括指定するmixin その2

リンクカラーを一括指定するmixinその2です。前回は「adjust-hueを使いたい!」という気持ちが強かったと記憶していますが、それに比べると今回はだいぶス...

【mixin】レスポンシブに対応したフォントサイズのmixin

レスポンシブサイトを作ってると、PC・スマホ間のことで意外と困るのがフォントサイズ。PC版に合わせようかスマホ版に合わせようか悩みます。 スマホ版に合わせても...