2016/02/12

[css][material design lite]simple list

listを読みながら簡単なリストを作ってみた。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script>
</head>
<body class="mdl-color--grey-50">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header ">
    <div class="mdl-layout__header-row">
      <!-- Title -->
      <span class="mdl-layout-title">Title</span>
      <!-- Add spacer, to align navigation to the right -->
      <div class="mdl-layout-spacer"></div>
      <nav class="mdl-navigation mdl-layout--large-screen-only">
      </nav>
    </div>
  </header>
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Title</span>
    <nav class="mdl-navigation">
    </nav>
  </div>
  <main class="mdl-layout__content">
    <div class="mdl-grid">
      <div class="mdl-cell mdl-cell--2-col mdl-cell--hide-tablet mdl-cell--hide-phone"></div>
      <div class="mdl-cell mdl-cell--8-col mdl-shadow--4dp mdl-color--white">
        <ul class="mdl-list">
          <li class="mdl-list__item">
            <span class="mdl-list__item-primary-content">
              <span>Bryan Cranston</span>
            </span>
          </li>
          <li class="mdl-list__item">
            <span class="mdl-list__item-primary-content">
              <span>Aaron Paul</span>
            </span>
          </li>
          <li class="mdl-list__item">
            <span class="mdl-list__item-primary-content">
              <span>Bob Odenkirk</span>
            </span>
          </li>
        </ul>
      </div>
      <div class="mdl-cell mdl-cell--2-col mdl-cell--hide-tablet mdl-cell--hide-phone"></div>
    </div>
  </main>
</div>
</body>
</html>
で、実際のlistの部分は、
<ul class="mdl-list">
  <li class="mdl-list__item">
    <span class="mdl-list__item-primary-content">
      <span>Bryan Cranston</span>
    </span>
  </li>
  <li class="mdl-list__item">
    <span class="mdl-list__item-primary-content">
      <span>Aaron Paul</span>
    </span>
  </li>
  <li class="mdl-list__item">
    <span class="mdl-list__item-primary-content">
      <span>Bob Odenkirk</span>
    </span>
  </li>
</ul>

2016/02/11

[CSS][Material Design Lite]header

Navigation layoutsを読みながらHeader Navigationを作り方を勉強しました。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script>
</head>
<body >
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header ">
    <div class="mdl-layout__header-row">
      <!-- Title -->
      <span class="mdl-layout-title">Title</span>
      <!-- Add spacer, to align navigation to the right -->
      <div class="mdl-layout-spacer"></div>
      <nav class="mdl-navigation mdl-layout--large-screen-only">
      </nav>
    </div>
  </header>
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Title</span>
    <nav class="mdl-navigation">
    </nav>
  </div>
  <main class="mdl-layout__content">
  </main>
</div>
</body>
</html>
fixedのナビゲーションバーができました。

しかもハンバーガーの処理混みで自動生成してくれるので、すごく便利ですね。

2016/02/10

[本]鵺の鳴く夜が明けるまで

読了

鵺の鳴く夜が明けるまで (双葉文庫(comicoBOOKS))
door
双葉社 (2016-01-13)
売り上げランキング: 134,687
女子高生の榊原来夢が、転校先で殺人事件の容疑者になってしまい、天才数学教師の鵺夜来人と共に自らの潔白を示すために事件の真相を探るという話なのだが、犯人が全然わからなかった。

読めば読むほど、先が気になってしまい、思わず興奮してしまった。

comico novelでロハで読めるけど、縦読みで読みたかったので購入しました。

ミステリー小説が好きな方は、是非。

2016/02/09

[iOS9][JavaScript][mobile safari][jQuery]Force Touchについて

Force Touchを搭載したiPhoneでJavaScriptを使って感圧タッチを取得することはできないのだろうか?

WebKit DOM Programming TopicsのResponding to Force Touch Eventsを見ながら下のように組みました。

<script>
jQuery(function($){
  var $button = $('._button');
  $button.on('webkitmouseforcewillbegin',function(e){
    alert('webkitmouseforcewillbegin');
  });

  $button.on('webkitmouseforcedown',function(e){
    alert('webkitmouseforcedown');
  });

  $button.on('webkitmouseforceup',function(e){
    alert('webkitmouseforceup');
  });

  $button.on('webkitmouseforcechanged',function(e){
    alert('webkitmouseforcechanged');
  });
});
</script>
<button type="button" class="_button">Button</button>
が、しかし、全然動かない。

で、さらに検索をかけてみると、
iOS9で追加されたForceTouch(3DTouch)をJavaScriptで操作してみる

iOS 9 Mobile Safari was enabled force touch event
のエントリーでも同じ悩みを抱えたらしく、結果的に、下のようにforceプロパティーで解決したそうです。
$button.on('touchmove',function(event){
  console.log(event.originalEvent.touches[0].force);
});

2016/02/08

[CSS][Material Design Lite]grid

昨日書いたMaterial Design Lite layoutベースにgridレイアウトを適用させてみる。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script>
</head>
<body class="mdl-color--grey-50">
<div class="mdl-layout mdl-js-layout">
  <main class="mdl-layout__content">
    <div class="mdl-grid">
      <div class="mdl-cell mdl-cell--2-col">hoge 2 col</div>
      <div class="mdl-cell mdl-cell--8-col">hoge 8 col</div>
      <div class="mdl-cell mdl-cell--2-col">hoge 2 col</div>
    </div>
  </main>
</div>
</body>
</html>
mainタグの中に、divタグを入れる
<main class="mdl-layout__content">
  <div class="mdl-grid">
  </div>
</main>
で、class="mdl-grid"の直下にさらにdivタグをネストさせるのだが、その時にmdl-cell--N-colのclass名を付与して記載する。
(Nは1から12まで)
<main class="mdl-layout__content">
    <div class="mdl-grid">
      <div class="mdl-cell mdl-cell--2-col">hoge 2 col</div>
      <div class="mdl-cell mdl-cell--8-col">hoge 8 col</div>
      <div class="mdl-cell mdl-cell--2-col">hoge 2 col</div>
    </div>
  </main>
上の例では、mdl-cell--2-col、mdl-cell--8-col、mdl-cell--2-colとなっている。

さらに、この場合は、リサイズしたとしても各セルが表示されてしまうので、tabletやsmartphoneでは表示させたくない場合は、それぞれmdl-cell--hide-tablet mdl-cell--hide-phoneのクラス名を付与すればおk
<main class="mdl-layout__content">
  <div class="mdl-grid">
    <div class="mdl-cell mdl-cell--2-col mdl-cell--hide-tablet mdl-cell--hide-phone">hoge 2 col</div>
    <div class="mdl-cell mdl-cell--8-col ">hoge 8 col</div>
    <div class="mdl-cell mdl-cell--2-col mdl-cell--hide-tablet mdl-cell--hide-phone">hoge 2 col</div>
  </div>
</main>
こうすることによって、それぞれのwindowサイズになったときに非表示にされるようになる。

2016/02/07

[CSS][Material Design Lite]layout

Material Design Liteを使ってキレイにレイアウトされたwebサイトを作ってみたくなったので、LAYOUTを読みながらコーディング方法を確認しました。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script>
</head>
<body>
<div class="mdl-layout mdl-js-layout">
  <main class="mdl-layout__content">
  this is contents.
  </main>
</div>
</body>
</html>

2016/02/06

[Python]__file__変数について

初めてのPython 第3版でもすぐにわからなかったので、1エントリー。

初めてのPython 第3版
初めてのPython 第3版
posted with amazlet at 16.02.12
Mark Lutz
オライリージャパン
売り上げランキング: 17,203
__file__ってずばりなんだろう?っていう話なんですが、
Python Tips:実行中のスクリプトの名前を取得したい
によると、実行中のスクリプト名の絶対パスを取得できるみたいです。

2016/02/05

[Material Design Lite][CSS]背景色について

indigo-pinkの場合にbackground colorがどうなっているのか知りたかったので列挙してみた。

.mdl-color--red {
    background-color: #f44336 !important
}

.mdl-color--red-50 {
    background-color: #ffebee !important
}

.mdl-color--red-100 {
    background-color: #ffcdd2 !important
}

.mdl-color--red-200 {
    background-color: #ef9a9a !important
}

.mdl-color--red-300 {
    background-color: #e57373 !important
}

.mdl-color--red-400 {
    background-color: #ef5350 !important
}

.mdl-color--red-500 {
    background-color: #f44336 !important
}

.mdl-color--red-600 {
    background-color: #e53935 !important
}

.mdl-color--red-700 {
    background-color: #d32f2f !important
}

.mdl-color--red-800 {
    background-color: #c62828 !important
}

.mdl-color--red-900 {
    background-color: #b71c1c !important
}

.mdl-color--red-A100 {
    background-color: #ff8a80 !important
}

.mdl-color--red-A200 {
    background-color: #ff5252 !important
}

.mdl-color--red-A400 {
    background-color: #ff1744 !important
}

.mdl-color--red-A700 {
    background-color: #d50000 !important
}

.mdl-color--pink {
    background-color: #e91e63 !important
}

.mdl-color--pink-50 {
    background-color: #fce4ec !important
}

.mdl-color--pink-100 {
    background-color: #f8bbd0 !important
}

.mdl-color--pink-200 {
    background-color: #f48fb1 !important
}

.mdl-color--pink-300 {
    background-color: #f06292 !important
}

.mdl-color--pink-400 {
    background-color: #ec407a !important
}

.mdl-color--pink-500 {
    background-color: #e91e63 !important
}

.mdl-color--pink-600 {
    background-color: #d81b60 !important
}

.mdl-color--pink-700 {
    background-color: #c2185b !important
}

.mdl-color--pink-800 {
    background-color: #ad1457 !important
}

.mdl-color--pink-900 {
    background-color: #880e4f !important
}

.mdl-color--pink-A100 {
    background-color: #ff80ab !important
}

.mdl-color--pink-A200 {
    background-color: #ff4081 !important
}

.mdl-color--pink-A400 {
    background-color: #f50057 !important
}

.mdl-color--pink-A700 {
    background-color: #c51162 !important
}

.mdl-color--purple {
    background-color: #9c27b0 !important
}

.mdl-color--purple-50 {
    background-color: #f3e5f5 !important
}

.mdl-color--purple-100 {
    background-color: #e1bee7 !important
}

.mdl-color--purple-200 {
    background-color: #ce93d8 !important
}

.mdl-color--purple-300 {
    background-color: #ba68c8 !important
}

.mdl-color--purple-400 {
    background-color: #ab47bc !important
}

.mdl-color--purple-500 {
    background-color: #9c27b0 !important
}

.mdl-color--purple-600 {
    background-color: #8e24aa !important
}

.mdl-color--purple-700 {
    background-color: #7b1fa2 !important
}

.mdl-color--purple-800 {
    background-color: #6a1b9a !important
}

.mdl-color--purple-900 {
    background-color: #4a148c !important
}

.mdl-color--purple-A100 {
    background-color: #ea80fc !important
}

.mdl-color--purple-A200 {
    background-color: #e040fb !important
}

.mdl-color--purple-A400 {
    background-color: #d500f9 !important
}

.mdl-color--purple-A700 {
    background-color: #a0f !important
}

.mdl-color--deep-purple {
    background-color: #673ab7 !important
}

.mdl-color--deep-purple-50 {
    background-color: #ede7f6 !important
}

.mdl-color--deep-purple-100 {
    background-color: #d1c4e9 !important
}

.mdl-color--deep-purple-200 {
    background-color: #b39ddb !important
}

.mdl-color--deep-purple-300 {
    background-color: #9575cd !important
}

.mdl-color--deep-purple-400 {
    background-color: #7e57c2 !important
}

.mdl-color--deep-purple-500 {
    background-color: #673ab7 !important
}

.mdl-color--deep-purple-600 {
    background-color: #5e35b1 !important
}

.mdl-color--deep-purple-700 {
    background-color: #512da8 !important
}

.mdl-color--deep-purple-800 {
    background-color: #4527a0 !important
}

.mdl-color--deep-purple-900 {
    background-color: #311b92 !important
}

.mdl-color--deep-purple-A100 {
    background-color: #b388ff !important
}

.mdl-color--deep-purple-A200 {
    background-color: #7c4dff !important
}

.mdl-color--deep-purple-A400 {
    background-color: #651fff !important
}

.mdl-color--deep-purple-A700 {
    background-color: #6200ea !important
}

.mdl-color--indigo {
    background-color: #3f51b5 !important
}

.mdl-color--indigo-50 {
    background-color: #e8eaf6 !important
}

.mdl-color--indigo-100 {
    background-color: #c5cae9 !important
}

.mdl-color--indigo-200 {
    background-color: #9fa8da !important
}

.mdl-color--indigo-300 {
    background-color: #7986cb !important
}

.mdl-color--indigo-400 {
    background-color: #5c6bc0 !important
}

.mdl-color--indigo-500 {
    background-color: #3f51b5 !important
}

.mdl-color--indigo-600 {
    background-color: #3949ab !important
}

.mdl-color--indigo-700 {
    background-color: #303f9f !important
}

.mdl-color--indigo-800 {
    background-color: #283593 !important
}

.mdl-color--indigo-900 {
    background-color: #1a237e !important
}

.mdl-color--indigo-A100 {
    background-color: #8c9eff !important
}

.mdl-color--indigo-A200 {
    background-color: #536dfe !important
}

.mdl-color--indigo-A400 {
    background-color: #3d5afe !important
}

.mdl-color--indigo-A700 {
    background-color: #304ffe !important
}

.mdl-color--blue {
    background-color: #2196f3 !important
}

.mdl-color--blue-50 {
    background-color: #e3f2fd !important
}

.mdl-color--blue-100 {
    background-color: #bbdefb !important
}

.mdl-color--blue-200 {
    background-color: #90caf9 !important
}

.mdl-color--blue-300 {
    background-color: #64b5f6 !important
}

.mdl-color--blue-400 {
    background-color: #42a5f5 !important
}

.mdl-color--blue-500 {
    background-color: #2196f3 !important
}

.mdl-color--blue-600 {
    background-color: #1e88e5 !important
}

.mdl-color--blue-700 {
    background-color: #1976d2 !important
}

.mdl-color--blue-800 {
    background-color: #1565c0 !important
}

.mdl-color--blue-900 {
    background-color: #0d47a1 !important
}

.mdl-color--blue-A100 {
    background-color: #82b1ff !important
}

.mdl-color--blue-A200 {
    background-color: #448aff !important
}

.mdl-color--blue-A400 {
    background-color: #2979ff !important
}

.mdl-color--blue-A700 {
    background-color: #2962ff !important
}

.mdl-color--light-blue {
    background-color: #03a9f4 !important
}

.mdl-color--light-blue-50 {
    background-color: #e1f5fe !important
}

.mdl-color--light-blue-100 {
    background-color: #b3e5fc !important
}

.mdl-color--light-blue-200 {
    background-color: #81d4fa !important
}

.mdl-color--light-blue-300 {
    background-color: #4fc3f7 !important
}

.mdl-color--light-blue-400 {
    background-color: #29b6f6 !important
}

.mdl-color--light-blue-500 {
    background-color: #03a9f4 !important
}

.mdl-color--light-blue-600 {
    background-color: #039be5 !important
}

.mdl-color--light-blue-700 {
    background-color: #0288d1 !important
}

.mdl-color--light-blue-800 {
    background-color: #0277bd !important
}

.mdl-color--light-blue-900 {
    background-color: #01579b !important
}

.mdl-color--light-blue-A100 {
    background-color: #80d8ff !important
}

.mdl-color--light-blue-A200 {
    background-color: #40c4ff !important
}

.mdl-color--light-blue-A400 {
    background-color: #00b0ff !important
}

.mdl-color--light-blue-A700 {
    background-color: #0091ea !important
}

.mdl-color--cyan {
    background-color: #00bcd4 !important
}

.mdl-color--cyan-50 {
    background-color: #e0f7fa !important
}

.mdl-color--cyan-100 {
    background-color: #b2ebf2 !important
}

.mdl-color--cyan-200 {
    background-color: #80deea !important
}

.mdl-color--cyan-300 {
    background-color: #4dd0e1 !important
}

.mdl-color--cyan-400 {
    background-color: #26c6da !important
}

.mdl-color--cyan-500 {
    background-color: #00bcd4 !important
}

.mdl-color--cyan-600 {
    background-color: #00acc1 !important
}

.mdl-color--cyan-700 {
    background-color: #0097a7 !important
}

.mdl-color--cyan-800 {
    background-color: #00838f !important
}

.mdl-color--cyan-900 {
    background-color: #006064 !important
}

.mdl-color--cyan-A100 {
    background-color: #84ffff !important
}

.mdl-color--cyan-A200 {
    background-color: #18ffff !important
}

.mdl-color--cyan-A400 {
    background-color: #00e5ff !important
}

.mdl-color--cyan-A700 {
    background-color: #00b8d4 !important
}

.mdl-color--teal {
    background-color: #009688 !important
}

.mdl-color--teal-50 {
    background-color: #e0f2f1 !important
}

.mdl-color--teal-100 {
    background-color: #b2dfdb !important
}

.mdl-color--teal-200 {
    background-color: #80cbc4 !important
}

.mdl-color--teal-300 {
    background-color: #4db6ac !important
}

.mdl-color--teal-400 {
    background-color: #26a69a !important
}

.mdl-color--teal-500 {
    background-color: #009688 !important
}

.mdl-color--teal-600 {
    background-color: #00897b !important
}

.mdl-color--teal-700 {
    background-color: #00796b !important
}

.mdl-color--teal-800 {
    background-color: #00695c !important
}

.mdl-color--teal-900 {
    background-color: #004d40 !important
}

.mdl-color--teal-A100 {
    background-color: #a7ffeb !important
}

.mdl-color--teal-A200 {
    background-color: #64ffda !important
}

.mdl-color--teal-A400 {
    background-color: #1de9b6 !important
}

.mdl-color--teal-A700 {
    background-color: #00bfa5 !important
}

.mdl-color--green {
    background-color: #4caf50 !important
}

.mdl-color--green-50 {
    background-color: #e8f5e9 !important
}

.mdl-color--green-100 {
    background-color: #c8e6c9 !important
}

.mdl-color--green-200 {
    background-color: #a5d6a7 !important
}

.mdl-color--green-300 {
    background-color: #81c784 !important
}

.mdl-color--green-400 {
    background-color: #66bb6a !important
}

.mdl-color--green-500 {
    background-color: #4caf50 !important
}

.mdl-color--green-600 {
    background-color: #43a047 !important
}

.mdl-color--green-700 {
    background-color: #388e3c !important
}

.mdl-color--green-800 {
    background-color: #2e7d32 !important
}

.mdl-color--green-900 {
    background-color: #1b5e20 !important
}

.mdl-color--green-A100 {
    background-color: #b9f6ca !important
}

.mdl-color--green-A200 {
    background-color: #69f0ae !important
}

.mdl-color--green-A400 {
    background-color: #00e676 !important
}

.mdl-color--green-A700 {
    background-color: #00c853 !important
}

.mdl-color--light-green {
    background-color: #8bc34a !important
}

.mdl-color--light-green-50 {
    background-color: #f1f8e9 !important
}

.mdl-color--light-green-100 {
    background-color: #dcedc8 !important
}

.mdl-color--light-green-200 {
    background-color: #c5e1a5 !important
}

.mdl-color--light-green-300 {
    background-color: #aed581 !important
}

.mdl-color--light-green-400 {
    background-color: #9ccc65 !important
}

.mdl-color--light-green-500 {
    background-color: #8bc34a !important
}

.mdl-color--light-green-600 {
    background-color: #7cb342 !important
}

.mdl-color--light-green-700 {
    background-color: #689f38 !important
}

.mdl-color--light-green-800 {
    background-color: #558b2f !important
}

.mdl-color--light-green-900 {
    background-color: #33691e !important
}

.mdl-color--light-green-A100 {
    background-color: #ccff90 !important
}

.mdl-color--light-green-A200 {
    background-color: #b2ff59 !important
}

.mdl-color--light-green-A400 {
    background-color: #76ff03 !important
}

.mdl-color--light-green-A700 {
    background-color: #64dd17 !important
}

.mdl-color--lime {
    background-color: #cddc39 !important
}

.mdl-color--lime-50 {
    background-color: #f9fbe7 !important
}

.mdl-color--lime-100 {
    background-color: #f0f4c3 !important
}

.mdl-color--lime-200 {
    background-color: #e6ee9c !important
}

.mdl-color--lime-300 {
    background-color: #dce775 !important
}

.mdl-color--lime-400 {
    background-color: #d4e157 !important
}

.mdl-color--lime-500 {
    background-color: #cddc39 !important
}

.mdl-color--lime-600 {
    background-color: #c0ca33 !important
}

.mdl-color--lime-700 {
    background-color: #afb42b !important
}

.mdl-color--lime-800 {
    background-color: #9e9d24 !important
}

.mdl-color--lime-900 {
    background-color: #827717 !important
}

.mdl-color--lime-A100 {
    background-color: #f4ff81 !important
}

.mdl-color--lime-A200 {
    background-color: #eeff41 !important
}

.mdl-color--lime-A400 {
    background-color: #c6ff00 !important
}

.mdl-color--lime-A700 {
    background-color: #aeea00 !important
}

.mdl-color--yellow {
    background-color: #ffeb3b !important
}

.mdl-color--yellow-50 {
    background-color: #fffde7 !important
}

.mdl-color--yellow-100 {
    background-color: #fff9c4 !important
}

.mdl-color--yellow-200 {
    background-color: #fff59d !important
}

.mdl-color--yellow-300 {
    background-color: #fff176 !important
}

.mdl-color--yellow-400 {
    background-color: #ffee58 !important
}

.mdl-color--yellow-500 {
    background-color: #ffeb3b !important
}

.mdl-color--yellow-600 {
    background-color: #fdd835 !important
}

.mdl-color--yellow-700 {
    background-color: #fbc02d !important
}

.mdl-color--yellow-800 {
    background-color: #f9a825 !important
}

.mdl-color--yellow-900 {
    background-color: #f57f17 !important
}

.mdl-color--yellow-A100 {
    background-color: #ffff8d !important
}

.mdl-color--yellow-A200 {
    background-color: #ff0 !important
}

.mdl-color--yellow-A400 {
    background-color: #ffea00 !important
}

.mdl-color--yellow-A700 {
    background-color: #ffd600 !important
}

.mdl-color--amber {
    background-color: #ffc107 !important
}

.mdl-color--amber-50 {
    background-color: #fff8e1 !important
}

.mdl-color--amber-100 {
    background-color: #ffecb3 !important
}

.mdl-color--amber-200 {
    background-color: #ffe082 !important
}

.mdl-color--amber-300 {
    background-color: #ffd54f !important
}

.mdl-color--amber-400 {
    background-color: #ffca28 !important
}

.mdl-color--amber-500 {
    background-color: #ffc107 !important
}

.mdl-color--amber-600 {
    background-color: #ffb300 !important
}

.mdl-color--amber-700 {
    background-color: #ffa000 !important
}

.mdl-color--amber-800 {
    background-color: #ff8f00 !important
}

.mdl-color--amber-900 {
    background-color: #ff6f00 !important
}

.mdl-color--amber-A100 {
    background-color: #ffe57f !important
}

.mdl-color--amber-A200 {
    background-color: #ffd740 !important
}

.mdl-color--amber-A400 {
    background-color: #ffc400 !important
}

.mdl-color--amber-A700 {
    background-color: #ffab00 !important
}

.mdl-color--orange {
    background-color: #ff9800 !important
}

.mdl-color--orange-50 {
    background-color: #fff3e0 !important
}

.mdl-color--orange-100 {
    background-color: #ffe0b2 !important
}

.mdl-color--orange-200 {
    background-color: #ffcc80 !important
}

.mdl-color--orange-300 {
    background-color: #ffb74d !important
}

.mdl-color--orange-400 {
    background-color: #ffa726 !important
}

.mdl-color--orange-500 {
    background-color: #ff9800 !important
}

.mdl-color--orange-600 {
    background-color: #fb8c00 !important
}

.mdl-color--orange-700 {
    background-color: #f57c00 !important
}

.mdl-color--orange-800 {
    background-color: #ef6c00 !important
}

.mdl-color--orange-900 {
    background-color: #e65100 !important
}

.mdl-color--orange-A100 {
    background-color: #ffd180 !important
}

.mdl-color--orange-A200 {
    background-color: #ffab40 !important
}

.mdl-color--orange-A400 {
    background-color: #ff9100 !important
}

.mdl-color--orange-A700 {
    background-color: #ff6d00 !important
}

.mdl-color--deep-orange {
    background-color: #ff5722 !important
}

.mdl-color--deep-orange-50 {
    background-color: #fbe9e7 !important
}

.mdl-color--deep-orange-100 {
    background-color: #ffccbc !important
}

.mdl-color--deep-orange-200 {
    background-color: #ffab91 !important
}

.mdl-color--deep-orange-300 {
    background-color: #ff8a65 !important
}

.mdl-color--deep-orange-400 {
    background-color: #ff7043 !important
}

.mdl-color--deep-orange-500 {
    background-color: #ff5722 !important
}

.mdl-color--deep-orange-600 {
    background-color: #f4511e !important
}

.mdl-color--deep-orange-700 {
    background-color: #e64a19 !important
}

.mdl-color--deep-orange-800 {
    background-color: #d84315 !important
}

.mdl-color--deep-orange-900 {
    background-color: #bf360c !important
}

.mdl-color--deep-orange-A100 {
    background-color: #ff9e80 !important
}

.mdl-color--deep-orange-A200 {
    background-color: #ff6e40 !important
}

.mdl-color--deep-orange-A400 {
    background-color: #ff3d00 !important
}

.mdl-color--deep-orange-A700 {
    background-color: #dd2c00 !important
}

.mdl-color--brown {
    background-color: #795548 !important
}

.mdl-color--brown-50 {
    background-color: #efebe9 !important
}

.mdl-color--brown-100 {
    background-color: #d7ccc8 !important
}

.mdl-color--brown-200 {
    background-color: #bcaaa4 !important
}

.mdl-color--brown-300 {
    background-color: #a1887f !important
}

.mdl-color--brown-400 {
    background-color: #8d6e63 !important
}

.mdl-color--brown-500 {
    background-color: #795548 !important
}

.mdl-color--brown-600 {
    background-color: #6d4c41 !important
}

.mdl-color--brown-700 {
    background-color: #5d4037 !important
}

.mdl-color--brown-800 {
    background-color: #4e342e !important
}

.mdl-color--brown-900 {
    background-color: #3e2723 !important
}

.mdl-color--grey {
    background-color: #9e9e9e !important
}

.mdl-color--grey-50 {
    background-color: #fafafa !important
}

.mdl-color--grey-100 {
    background-color: #f5f5f5 !important
}

.mdl-color--grey-200 {
    background-color: #eee !important
}

.mdl-color--grey-300 {
    background-color: #e0e0e0 !important
}

.mdl-color--grey-400 {
    background-color: #bdbdbd !important
}

.mdl-color--grey-500 {
    background-color: #9e9e9e !important
}

.mdl-color--grey-600 {
    background-color: #757575 !important
}

.mdl-color--grey-700 {
    background-color: #616161 !important
}

.mdl-color--grey-800 {
    background-color: #424242 !important
}

.mdl-color--grey-900 {
    background-color: #212121 !important
}

.mdl-color--blue-grey {
    background-color: #607d8b !important
}

.mdl-color--blue-grey-50 {
    background-color: #eceff1 !important
}

.mdl-color--blue-grey-100 {
    background-color: #cfd8dc !important
}

.mdl-color--blue-grey-200 {
    background-color: #b0bec5 !important
}

.mdl-color--blue-grey-300 {
    background-color: #90a4ae !important
}

.mdl-color--blue-grey-400 {
    background-color: #78909c !important
}

.mdl-color--blue-grey-500 {
    background-color: #607d8b !important
}

.mdl-color--blue-grey-600 {
    background-color: #546e7a !important
}

.mdl-color--blue-grey-700 {
    background-color: #455a64 !important
}

.mdl-color--blue-grey-800 {
    background-color: #37474f !important
}

.mdl-color--blue-grey-900 {
    background-color: #263238 !important
}

.mdl-color--black {
    background-color: #000 !important
}

.mdl-color--white {
    background-color: #fff !important
}

.mdl-color--primary {
    background-color: rgb(63,81,181)!important
}

.mdl-color--primary-contrast {
    background-color: rgb(255,255,255)!important
}

.mdl-color--primary-dark {
    background-color: rgb(48,63,159)!important
}

.mdl-color--accent {
    background-color: rgb(255,64,129)!important
}

.mdl-color--accent-contrast {
    background-color: rgb(255,255,255)!important
}

2016/02/04

[Material Design Lite][CSS]text colorについて

indigo-pinkの場合にtext colorがどうなっているのか知りたかったので列挙してみた。

.mdl-color-text--red {
    color: #f44336 !important
}

.mdl-color-text--red-50 {
    color: #ffebee !important
}

.mdl-color-text--red-100 {
    color: #ffcdd2 !important
}

.mdl-color-text--red-200 {
    color: #ef9a9a !important
}

.mdl-color-text--red-300 {
    color: #e57373 !important
}

.mdl-color-text--red-400 {
    color: #ef5350 !important
}

.mdl-color-text--red-500 {
    color: #f44336 !important
}

.mdl-color-text--red-600 {
    color: #e53935 !important
}

.mdl-color-text--red-700 {
    color: #d32f2f !important
}

.mdl-color-text--red-800 {
    color: #c62828 !important
}

.mdl-color-text--red-900 {
    color: #b71c1c !important
}

.mdl-color-text--red-A100 {
    color: #ff8a80 !important
}

.mdl-color-text--red-A200 {
    color: #ff5252 !important
}

.mdl-color-text--red-A400 {
    color: #ff1744 !important
}

.mdl-color-text--red-A700 {
    color: #d50000 !important
}

.mdl-color-text--pink {
    color: #e91e63 !important
}

.mdl-color-text--pink-50 {
    color: #fce4ec !important
}

.mdl-color-text--pink-100 {
    color: #f8bbd0 !important
}

.mdl-color-text--pink-200 {
    color: #f48fb1 !important
}

.mdl-color-text--pink-300 {
    color: #f06292 !important
}

.mdl-color-text--pink-400 {
    color: #ec407a !important
}

.mdl-color-text--pink-500 {
    color: #e91e63 !important
}

.mdl-color-text--pink-600 {
    color: #d81b60 !important
}

.mdl-color-text--pink-700 {
    color: #c2185b !important
}

.mdl-color-text--pink-800 {
    color: #ad1457 !important
}

.mdl-color-text--pink-900 {
    color: #880e4f !important
}

.mdl-color-text--pink-A100 {
    color: #ff80ab !important
}

.mdl-color-text--pink-A200 {
    color: #ff4081 !important
}

.mdl-color-text--pink-A400 {
    color: #f50057 !important
}

.mdl-color-text--pink-A700 {
    color: #c51162 !important
}

.mdl-color-text--purple {
    color: #9c27b0 !important
}

.mdl-color-text--purple-50 {
    color: #f3e5f5 !important
}

.mdl-color-text--purple-100 {
    color: #e1bee7 !important
}

.mdl-color-text--purple-200 {
    color: #ce93d8 !important
}

.mdl-color-text--purple-300 {
    color: #ba68c8 !important
}

.mdl-color-text--purple-400 {
    color: #ab47bc !important
}

.mdl-color-text--purple-500 {
    color: #9c27b0 !important
}

.mdl-color-text--purple-600 {
    color: #8e24aa !important
}

.mdl-color-text--purple-700 {
    color: #7b1fa2 !important
}

.mdl-color-text--purple-800 {
    color: #6a1b9a !important
}

.mdl-color-text--purple-900 {
    color: #4a148c !important
}

.mdl-color-text--purple-A100 {
    color: #ea80fc !important
}

.mdl-color-text--purple-A200 {
    color: #e040fb !important
}

.mdl-color-text--purple-A400 {
    color: #d500f9 !important
}

.mdl-color-text--purple-A700 {
    color: #a0f !important
}

.mdl-color-text--deep-purple {
    color: #673ab7 !important
}

.mdl-color-text--deep-purple-50 {
    color: #ede7f6 !important
}

.mdl-color-text--deep-purple-100 {
    color: #d1c4e9 !important
}

.mdl-color-text--deep-purple-200 {
    color: #b39ddb !important
}

.mdl-color-text--deep-purple-300 {
    color: #9575cd !important
}

.mdl-color-text--deep-purple-400 {
    color: #7e57c2 !important
}

.mdl-color-text--deep-purple-500 {
    color: #673ab7 !important
}

.mdl-color-text--deep-purple-600 {
    color: #5e35b1 !important
}

.mdl-color-text--deep-purple-700 {
    color: #512da8 !important
}

.mdl-color-text--deep-purple-800 {
    color: #4527a0 !important
}

.mdl-color-text--deep-purple-900 {
    color: #311b92 !important
}

.mdl-color-text--deep-purple-A100 {
    color: #b388ff !important
}

.mdl-color-text--deep-purple-A200 {
    color: #7c4dff !important
}

.mdl-color-text--deep-purple-A400 {
    color: #651fff !important
}

.mdl-color-text--deep-purple-A700 {
    color: #6200ea !important
}

.mdl-color-text--indigo {
    color: #3f51b5 !important
}

.mdl-color-text--indigo-50 {
    color: #e8eaf6 !important
}

.mdl-color-text--indigo-100 {
    color: #c5cae9 !important
}

.mdl-color-text--indigo-200 {
    color: #9fa8da !important
}

.mdl-color-text--indigo-300 {
    color: #7986cb !important
}

.mdl-color-text--indigo-400 {
    color: #5c6bc0 !important
}

.mdl-color-text--indigo-500 {
    color: #3f51b5 !important
}

.mdl-color-text--indigo-600 {
    color: #3949ab !important
}

.mdl-color-text--indigo-700 {
    color: #303f9f !important
}

.mdl-color-text--indigo-800 {
    color: #283593 !important
}

.mdl-color-text--indigo-900 {
    color: #1a237e !important
}

.mdl-color-text--indigo-A100 {
    color: #8c9eff !important
}

.mdl-color-text--indigo-A200 {
    color: #536dfe !important
}

.mdl-color-text--indigo-A400 {
    color: #3d5afe !important
}

.mdl-color-text--indigo-A700 {
    color: #304ffe !important
}

.mdl-color-text--blue {
    color: #2196f3 !important
}

.mdl-color-text--blue-50 {
    color: #e3f2fd !important
}

.mdl-color-text--blue-100 {
    color: #bbdefb !important
}

.mdl-color-text--blue-200 {
    color: #90caf9 !important
}

.mdl-color-text--blue-300 {
    color: #64b5f6 !important
}

.mdl-color-text--blue-400 {
    color: #42a5f5 !important
}

.mdl-color-text--blue-500 {
    color: #2196f3 !important
}

.mdl-color-text--blue-600 {
    color: #1e88e5 !important
}

.mdl-color-text--blue-700 {
    color: #1976d2 !important
}

.mdl-color-text--blue-800 {
    color: #1565c0 !important
}

.mdl-color-text--blue-900 {
    color: #0d47a1 !important
}

.mdl-color-text--blue-A100 {
    color: #82b1ff !important
}

.mdl-color-text--blue-A200 {
    color: #448aff !important
}

.mdl-color-text--blue-A400 {
    color: #2979ff !important
}

.mdl-color-text--blue-A700 {
    color: #2962ff !important
}

.mdl-color-text--light-blue {
    color: #03a9f4 !important
}

.mdl-color-text--light-blue-50 {
    color: #e1f5fe !important
}

.mdl-color-text--light-blue-100 {
    color: #b3e5fc !important
}

.mdl-color-text--light-blue-200 {
    color: #81d4fa !important
}

.mdl-color-text--light-blue-300 {
    color: #4fc3f7 !important
}

.mdl-color-text--light-blue-400 {
    color: #29b6f6 !important
}

.mdl-color-text--light-blue-500 {
    color: #03a9f4 !important
}

.mdl-color-text--light-blue-600 {
    color: #039be5 !important
}

.mdl-color-text--light-blue-700 {
    color: #0288d1 !important
}

.mdl-color-text--light-blue-800 {
    color: #0277bd !important
}

.mdl-color-text--light-blue-900 {
    color: #01579b !important
}

.mdl-color-text--light-blue-A100 {
    color: #80d8ff !important
}

.mdl-color-text--light-blue-A200 {
    color: #40c4ff !important
}

.mdl-color-text--light-blue-A400 {
    color: #00b0ff !important
}

.mdl-color-text--light-blue-A700 {
    color: #0091ea !important
}

.mdl-color-text--cyan {
    color: #00bcd4 !important
}

.mdl-color-text--cyan-50 {
    color: #e0f7fa !important
}

.mdl-color-text--cyan-100 {
    color: #b2ebf2 !important
}

.mdl-color-text--cyan-200 {
    color: #80deea !important
}

.mdl-color-text--cyan-300 {
    color: #4dd0e1 !important
}

.mdl-color-text--cyan-400 {
    color: #26c6da !important
}

.mdl-color-text--cyan-500 {
    color: #00bcd4 !important
}

.mdl-color-text--cyan-600 {
    color: #00acc1 !important
}

.mdl-color-text--cyan-700 {
    color: #0097a7 !important
}

.mdl-color-text--cyan-800 {
    color: #00838f !important
}

.mdl-color-text--cyan-900 {
    color: #006064 !important
}

.mdl-color-text--cyan-A100 {
    color: #84ffff !important
}

.mdl-color-text--cyan-A200 {
    color: #18ffff !important
}

.mdl-color-text--cyan-A400 {
    color: #00e5ff !important
}

.mdl-color-text--cyan-A700 {
    color: #00b8d4 !important
}

.mdl-color-text--teal {
    color: #009688 !important
}

.mdl-color-text--teal-50 {
    color: #e0f2f1 !important
}

.mdl-color-text--teal-100 {
    color: #b2dfdb !important
}

.mdl-color-text--teal-200 {
    color: #80cbc4 !important
}

.mdl-color-text--teal-300 {
    color: #4db6ac !important
}

.mdl-color-text--teal-400 {
    color: #26a69a !important
}

.mdl-color-text--teal-500 {
    color: #009688 !important
}

.mdl-color-text--teal-600 {
    color: #00897b !important
}

.mdl-color-text--teal-700 {
    color: #00796b !important
}

.mdl-color-text--teal-800 {
    color: #00695c !important
}

.mdl-color-text--teal-900 {
    color: #004d40 !important
}

.mdl-color-text--teal-A100 {
    color: #a7ffeb !important
}

.mdl-color-text--teal-A200 {
    color: #64ffda !important
}

.mdl-color-text--teal-A400 {
    color: #1de9b6 !important
}

.mdl-color-text--teal-A700 {
    color: #00bfa5 !important
}

.mdl-color-text--green {
    color: #4caf50 !important
}

.mdl-color-text--green-50 {
    color: #e8f5e9 !important
}

.mdl-color-text--green-100 {
    color: #c8e6c9 !important
}

.mdl-color-text--green-200 {
    color: #a5d6a7 !important
}

.mdl-color-text--green-300 {
    color: #81c784 !important
}

.mdl-color-text--green-400 {
    color: #66bb6a !important
}

.mdl-color-text--green-500 {
    color: #4caf50 !important
}

.mdl-color-text--green-600 {
    color: #43a047 !important
}

.mdl-color-text--green-700 {
    color: #388e3c !important
}

.mdl-color-text--green-800 {
    color: #2e7d32 !important
}

.mdl-color-text--green-900 {
    color: #1b5e20 !important
}

.mdl-color-text--green-A100 {
    color: #b9f6ca !important
}

.mdl-color-text--green-A200 {
    color: #69f0ae !important
}

.mdl-color-text--green-A400 {
    color: #00e676 !important
}

.mdl-color-text--green-A700 {
    color: #00c853 !important
}

.mdl-color-text--light-green {
    color: #8bc34a !important
}

.mdl-color-text--light-green-50 {
    color: #f1f8e9 !important
}

.mdl-color-text--light-green-100 {
    color: #dcedc8 !important
}

.mdl-color-text--light-green-200 {
    color: #c5e1a5 !important
}

.mdl-color-text--light-green-300 {
    color: #aed581 !important
}

.mdl-color-text--light-green-400 {
    color: #9ccc65 !important
}

.mdl-color-text--light-green-500 {
    color: #8bc34a !important
}

.mdl-color-text--light-green-600 {
    color: #7cb342 !important
}

.mdl-color-text--light-green-700 {
    color: #689f38 !important
}

.mdl-color-text--light-green-800 {
    color: #558b2f !important
}

.mdl-color-text--light-green-900 {
    color: #33691e !important
}

.mdl-color-text--light-green-A100 {
    color: #ccff90 !important
}

.mdl-color-text--light-green-A200 {
    color: #b2ff59 !important
}

.mdl-color-text--light-green-A400 {
    color: #76ff03 !important
}

.mdl-color-text--light-green-A700 {
    color: #64dd17 !important
}

.mdl-color-text--lime {
    color: #cddc39 !important
}

.mdl-color-text--lime-50 {
    color: #f9fbe7 !important
}

.mdl-color-text--lime-100 {
    color: #f0f4c3 !important
}

.mdl-color-text--lime-200 {
    color: #e6ee9c !important
}

.mdl-color-text--lime-300 {
    color: #dce775 !important
}

.mdl-color-text--lime-400 {
    color: #d4e157 !important
}

.mdl-color-text--lime-500 {
    color: #cddc39 !important
}

.mdl-color-text--lime-600 {
    color: #c0ca33 !important
}

.mdl-color-text--lime-700 {
    color: #afb42b !important
}

.mdl-color-text--lime-800 {
    color: #9e9d24 !important
}

.mdl-color-text--lime-900 {
    color: #827717 !important
}

.mdl-color-text--lime-A100 {
    color: #f4ff81 !important
}

.mdl-color-text--lime-A200 {
    color: #eeff41 !important
}

.mdl-color-text--lime-A400 {
    color: #c6ff00 !important
}

.mdl-color-text--lime-A700 {
    color: #aeea00 !important
}

.mdl-color-text--yellow {
    color: #ffeb3b !important
}

.mdl-color-text--yellow-50 {
    color: #fffde7 !important
}

.mdl-color-text--yellow-100 {
    color: #fff9c4 !important
}

.mdl-color-text--yellow-200 {
    color: #fff59d !important
}

.mdl-color-text--yellow-300 {
    color: #fff176 !important
}

.mdl-color-text--yellow-400 {
    color: #ffee58 !important
}

.mdl-color-text--yellow-500 {
    color: #ffeb3b !important
}

.mdl-color-text--yellow-600 {
    color: #fdd835 !important
}

.mdl-color-text--yellow-700 {
    color: #fbc02d !important
}

.mdl-color-text--yellow-800 {
    color: #f9a825 !important
}

.mdl-color-text--yellow-900 {
    color: #f57f17 !important
}

.mdl-color-text--yellow-A100 {
    color: #ffff8d !important
}

.mdl-color-text--yellow-A200 {
    color: #ff0 !important
}

.mdl-color-text--yellow-A400 {
    color: #ffea00 !important
}

.mdl-color-text--yellow-A700 {
    color: #ffd600 !important
}

.mdl-color-text--amber {
    color: #ffc107 !important
}

.mdl-color-text--amber-50 {
    color: #fff8e1 !important
}

.mdl-color-text--amber-100 {
    color: #ffecb3 !important
}

.mdl-color-text--amber-200 {
    color: #ffe082 !important
}

.mdl-color-text--amber-300 {
    color: #ffd54f !important
}

.mdl-color-text--amber-400 {
    color: #ffca28 !important
}

.mdl-color-text--amber-500 {
    color: #ffc107 !important
}

.mdl-color-text--amber-600 {
    color: #ffb300 !important
}

.mdl-color-text--amber-700 {
    color: #ffa000 !important
}

.mdl-color-text--amber-800 {
    color: #ff8f00 !important
}

.mdl-color-text--amber-900 {
    color: #ff6f00 !important
}

.mdl-color-text--amber-A100 {
    color: #ffe57f !important
}

.mdl-color-text--amber-A200 {
    color: #ffd740 !important
}

.mdl-color-text--amber-A400 {
    color: #ffc400 !important
}

.mdl-color-text--amber-A700 {
    color: #ffab00 !important
}

.mdl-color-text--orange {
    color: #ff9800 !important
}

.mdl-color-text--orange-50 {
    color: #fff3e0 !important
}

.mdl-color-text--orange-100 {
    color: #ffe0b2 !important
}

.mdl-color-text--orange-200 {
    color: #ffcc80 !important
}

.mdl-color-text--orange-300 {
    color: #ffb74d !important
}

.mdl-color-text--orange-400 {
    color: #ffa726 !important
}

.mdl-color-text--orange-500 {
    color: #ff9800 !important
}

.mdl-color-text--orange-600 {
    color: #fb8c00 !important
}

.mdl-color-text--orange-700 {
    color: #f57c00 !important
}

.mdl-color-text--orange-800 {
    color: #ef6c00 !important
}

.mdl-color-text--orange-900 {
    color: #e65100 !important
}

.mdl-color-text--orange-A100 {
    color: #ffd180 !important
}

.mdl-color-text--orange-A200 {
    color: #ffab40 !important
}

.mdl-color-text--orange-A400 {
    color: #ff9100 !important
}

.mdl-color-text--orange-A700 {
    color: #ff6d00 !important
}

.mdl-color-text--deep-orange {
    color: #ff5722 !important
}

.mdl-color-text--deep-orange-50 {
    color: #fbe9e7 !important
}

.mdl-color-text--deep-orange-100 {
    color: #ffccbc !important
}

.mdl-color-text--deep-orange-200 {
    color: #ffab91 !important
}

.mdl-color-text--deep-orange-300 {
    color: #ff8a65 !important
}

.mdl-color-text--deep-orange-400 {
    color: #ff7043 !important
}

.mdl-color-text--deep-orange-500 {
    color: #ff5722 !important
}

.mdl-color-text--deep-orange-600 {
    color: #f4511e !important
}

.mdl-color-text--deep-orange-700 {
    color: #e64a19 !important
}

.mdl-color-text--deep-orange-800 {
    color: #d84315 !important
}

.mdl-color-text--deep-orange-900 {
    color: #bf360c !important
}

.mdl-color-text--deep-orange-A100 {
    color: #ff9e80 !important
}

.mdl-color-text--deep-orange-A200 {
    color: #ff6e40 !important
}

.mdl-color-text--deep-orange-A400 {
    color: #ff3d00 !important
}

.mdl-color-text--deep-orange-A700 {
    color: #dd2c00 !important
}

.mdl-color-text--brown {
    color: #795548 !important
}

.mdl-color-text--brown-50 {
    color: #efebe9 !important
}

.mdl-color-text--brown-100 {
    color: #d7ccc8 !important
}

.mdl-color-text--brown-200 {
    color: #bcaaa4 !important
}

.mdl-color-text--brown-300 {
    color: #a1887f !important
}

.mdl-color-text--brown-400 {
    color: #8d6e63 !important
}

.mdl-color-text--brown-500 {
    color: #795548 !important
}

.mdl-color-text--brown-600 {
    color: #6d4c41 !important
}

.mdl-color-text--brown-700 {
    color: #5d4037 !important
}

.mdl-color-text--brown-800 {
    color: #4e342e !important
}

.mdl-color-text--brown-900 {
    color: #3e2723 !important
}

.mdl-color-text--grey {
    color: #9e9e9e !important
}

.mdl-color-text--grey-50 {
    color: #fafafa !important
}

.mdl-color-text--grey-100 {
    color: #f5f5f5 !important
}

.mdl-color-text--grey-200 {
    color: #eee !important
}

.mdl-color-text--grey-300 {
    color: #e0e0e0 !important
}

.mdl-color-text--grey-400 {
    color: #bdbdbd !important
}

.mdl-color-text--grey-500 {
    color: #9e9e9e !important
}

.mdl-color-text--grey-600 {
    color: #757575 !important
}

.mdl-color-text--grey-700 {
    color: #616161 !important
}

.mdl-color-text--grey-800 {
    color: #424242 !important
}

.mdl-color-text--grey-900 {
    color: #212121 !important
}

.mdl-color-text--blue-grey {
    color: #607d8b !important
}

.mdl-color-text--blue-grey-50 {
    color: #eceff1 !important
}

.mdl-color-text--blue-grey-100 {
    color: #cfd8dc !important
}

.mdl-color-text--blue-grey-200 {
    color: #b0bec5 !important
}

.mdl-color-text--blue-grey-300 {
    color: #90a4ae !important
}

.mdl-color-text--blue-grey-400 {
    color: #78909c !important
}

.mdl-color-text--blue-grey-500 {
    color: #607d8b !important
}

.mdl-color-text--blue-grey-600 {
    color: #546e7a !important
}

.mdl-color-text--blue-grey-700 {
    color: #455a64 !important
}

.mdl-color-text--blue-grey-800 {
    color: #37474f !important
}

.mdl-color-text--blue-grey-900 {
    color: #263238 !important
}

.mdl-color-text--black {
    color: #000 !important
}

.mdl-color-text--white {
    color: #fff !important
}

.mdl-color-text--primary {
    color: rgb(63,81,181)!important
}

.mdl-color-text--primary-contrast {
    color: rgb(255,255,255)!important
}

.mdl-color-text--primary-dark {
    color: rgb(48,63,159)!important
}

.mdl-color-text--accent {
    color: rgb(255,64,129)!important
}

.mdl-color-text--accent-contrast {
    color: rgb(255,255,255)!important
}

2016/02/03

[Fusion Tables API][Google App Engine][Python]SELECT文の発行

Fusion Tables REST APIでSELECT文の発行方法を勉強しました。

https://www.googleapis.com/fusiontables/v2/query?key=
というURLに対して、
&sql=SELECT <column_spec> FROM <table_id>
をURLエンコードせずにくっつければおk

column_specには、Primary Keyに相当するROWIDを選択することができ、また、全称selectorの「*」は使えるがその時にORDER BYは使えないみたいなので、注意が必要。