This commit is contained in:
uetchy 2018-07-19 20:53:12 +09:00
parent 2b72e5536f
commit 5ab2e98877
28 changed files with 273 additions and 284 deletions

View File

@ -10,4 +10,3 @@ date: 2017-02-27 01:28:00 +09:00
- Udacity - Udacity
## Books ## Books

View File

@ -9,9 +9,11 @@ layout: post
</div> </div>
## Handwriting Typeface Template for Alphabet A-Z ## Handwriting Typeface Template for Alphabet A-Z
[Download (.pdf)]({{ site.baseurl }}/images/typeface/Typeface_A-Z.pdf) [Download (.pdf)]({{ site.baseurl }}/images/typeface/Typeface_A-Z.pdf)
## Handwriting Typeface Template for Hiragana (ひらがな) ## Handwriting Typeface Template for Hiragana (ひらがな)
[Download (.pdf)]({{ site.baseurl }}/images/typeface/Typeface_Hiragana.pdf) [Download (.pdf)]({{ site.baseurl }}/images/typeface/Typeface_Hiragana.pdf)
## Typeface Design Kit (.sketch) ## Typeface Design Kit (.sketch)

View File

@ -4,7 +4,7 @@ permalink: "/wallpaper"
layout: post layout: post
--- ---
Right-click and choose __Save Image__ to download wallpapers designed for OS X. Right-click and choose **Save Image** to download wallpapers designed for OS X.
![Ridge]({{ site.baseurl }}/images/wallpaper/ridge.png) ![Ridge]({{ site.baseurl }}/images/wallpaper/ridge.png)

View File

@ -9,7 +9,7 @@ date: 2013-11-05 09:00:00 +09:00
Mac のネットワーク環境は`networksetup -getcurrentlocation`コマンドで取得することが出来るので、 Mac のネットワーク環境は`networksetup -getcurrentlocation`コマンドで取得することが出来るので、
__.zshrc__ 辺りに以下のシェルスクリプトを書いておけばTerminalで新しいタブを開いた時に自動でプロキシを設定してくれるはずである。 **.zshrc** 辺りに以下のシェルスクリプトを書いておけば Terminal で新しいタブを開いた時に自動でプロキシを設定してくれるはずである。
```bash ```bash
proxy=proxy.hogehoge.ac.jp proxy=proxy.hogehoge.ac.jp
@ -80,14 +80,15 @@ else
fi fi
``` ```
このコードを __.zshrc__ に保存して適当なターミナルで新しいセッションを開くと、`switch_trigger`で指定されたネットワーク環境下にいる時だけプロキシを通すことが出来る。 このコードを **.zshrc** に保存して適当なターミナルで新しいセッションを開くと、`switch_trigger`で指定されたネットワーク環境下にいる時だけプロキシを通すことが出来る。
既に開いているセッションに対してプロキシを適用する方法がわからなかった。 既に開いているセッションに対してプロキシを適用する方法がわからなかった。
Workaroundとして、コードを __~/.switch_proxy__ 辺りに置いて、 Workaround として、コードを **~/.switch_proxy** 辺りに置いて、
```bash:~/.zshrc ```bash:~/.zshrc
alias nswitch=~/.switch_proxy alias nswitch=~/.switch_proxy
```
```
`.zshrc`に書いておくことで、`nswitch`とタイプしてプロキシを切り替えられるようになる。 `.zshrc`に書いておくことで、`nswitch`とタイプしてプロキシを切り替えられるようになる。
```

View File

@ -22,4 +22,4 @@ date: 2013-12-05 09:00:00 +09:00
今度は Ruby で書きなおして日本語も受け付けるように修正したので、需要はともかく個人的にかなり使いやすくなった気がする。 今度は Ruby で書きなおして日本語も受け付けるように修正したので、需要はともかく個人的にかなり使いやすくなった気がする。
~~なお、この Workflow は Ruby 2.0.x で動作するので必然的に OS X Mavericks が必要になってくる。~~ ~~なお、この Workflow は Ruby 2.0.x で動作するので必然的に OS X Mavericks が必要になってくる。~~
__Ruby 1.9.xでも動作するように書きなおしたので古いOS Xでも動くようになった。__ **Ruby 1.9.x でも動作するように書きなおしたので古い OS X でも動くようになった。**

View File

@ -76,6 +76,7 @@ $ dokku logs
``` ```
## 結論 ## 結論
### 良い所 ### 良い所
- リモートの dokku コマンドを叩きたい時はプロジェクトの Git リポジトリに入って dockland コマンドを叩くだけで良い - リモートの dokku コマンドを叩きたい時はプロジェクトの Git リポジトリに入って dockland コマンドを叩くだけで良い

View File

@ -15,18 +15,17 @@ OS X用のパッケージ管理ツール Homebrew がインストールされて
デフォルトの Homebrew リポジトリに KNP は含まれていないので [homebrew-nlp](https://github.com/uetchy/homebrew-nlp) を tap する。 デフォルトの Homebrew リポジトリに KNP は含まれていないので [homebrew-nlp](https://github.com/uetchy/homebrew-nlp) を tap する。
```bash ```bash
brew tap uetchy/nlp brew tap uetchy/nlp
``` ```
Tapし終わったら、`knp`をインストールする。knpが依存している形態素解析システム`juman`とデータベース`tinycdb`はHomebrewによって自動でインストールされる。その内の`juman`は上記の __oame/nlp__ Tapによって提供されている。 Tap し終わったら、`knp`をインストールする。knp が依存している形態素解析システム`juman`とデータベース`tinycdb` Homebrew によって自動でインストールされる。その内の`juman`は上記の **oame/nlp** Tap によって提供されている。
```bash ```bash
brew install knp brew install knp
``` ```
固有表現解析を行いたい場合は __--with-crf++__ オプションを付けてインストールする。このオプションを付けると、依存解決のために`crf++`も同時にインストールされる。 固有表現解析を行いたい場合は **--with-crf++** オプションを付けてインストールする。このオプションを付けると、依存解決のために`crf++`も同時にインストールされる。
```bash ```bash
brew install knp --with-crf++ brew install knp --with-crf++

View File

@ -13,9 +13,9 @@ Vectorツールで軽くスケッチしてからこのプラグインを適用
# インストール # インストール
[リリースページ](https://github.com/uetchy/Sketch-StickyGrid/releases/latest)からzipアーカイブをダウンロードし、__StickyGrid.sketchplugin__ をダブルクリックしてインストールする。 [リリースページ](https://github.com/uetchy/Sketch-StickyGrid/releases/latest)から zip アーカイブをダウンロードし、**StickyGrid.sketchplugin** をダブルクリックしてインストールする。
もし、より_CLI-way_がお好みであれば、以下のコマンドでもインストールすることが出来る。 もし、より*CLI-way*がお好みであれば、以下のコマンドでもインストールすることが出来る。
```bash ```bash
cd $HOME/Library/Application Support/com.bohemiancoding.sketch3/Plugins cd $HOME/Library/Application Support/com.bohemiancoding.sketch3/Plugins
@ -24,9 +24,9 @@ git clone https://github.com/uetchy/Sketch-StickyGrid.git
# 使い方 # 使い方
吸い付かせたいシェイプを1つ、または複数選択して __`ctrl` + `⌘` + `G`__ を押すと、パスがグリッドの交差点に吸い付く。 吸い付かせたいシェイプを 1 つ、または複数選択して **`ctrl` + `⌘` + `G`** を押すと、パスがグリッドの交差点に吸い付く。
ショートカット以外にも、メニューから__Plugins > Sketch-StickyGrid > Snap to Grid__を選んでも良い。 ショートカット以外にも、メニューから**Plugins > Sketch-StickyGrid > Snap to Grid**を選んでも良い。
シェイプはもちろん、グルーピングされたシェイプも、逆にシェイプポイントだけでも吸い付く。 シェイプはもちろん、グルーピングされたシェイプも、逆にシェイプポイントだけでも吸い付く。
@ -38,22 +38,22 @@ git clone https://github.com/uetchy/Sketch-StickyGrid.git
デバッギングには[Sketch-DevTools](https://github.com/turbobabr/sketch-devtools)を使っていましたが、最新版の Sketch では使えなくなってしまった。 デバッギングには[Sketch-DevTools](https://github.com/turbobabr/sketch-devtools)を使っていましたが、最新版の Sketch では使えなくなってしまった。
その代わりにMac標準アプリの __Console.app__ を使う方法が公式デベロッパーサイトの記事 [Debugging - Sketch Developer](http://developer.sketchapp.com/code-examples/debugging/) で紹介されている。 その代わりに Mac 標準アプリの **Console.app** を使う方法が公式デベロッパーサイトの記事 [Debugging - Sketch Developer](http://developer.sketchapp.com/code-examples/debugging/) で紹介されている。
スクリプト内で`log`関数を呼び出すと、Console.app にログが出力される。 スクリプト内で`log`関数を呼び出すと、Console.app にログが出力される。
```js ```js
log(context.document.gridSize); log(context.document.gridSize)
``` ```
## ドキュメントの情報源 ## ドキュメントの情報源
ドキュメントは公式デベロッパーサイト [Sketch Developer](http://developer.sketchapp.com) があるものの、パス編集に関するドキュメントは全くなかった。 ドキュメントは公式デベロッパーサイト [Sketch Developer](http://developer.sketchapp.com) があるものの、パス編集に関するドキュメントは全くなかった。
そこで、[class-dump](http://stevenygard.com/projects/class-dump/) を使って Sketch.app のヘッダーファイルを抽出し、ひたすら __目grep__ をしてシェイプ操作とグリッドに関するAPIを探し出し、プラグインの実装に役立てた。 そこで、[class-dump](http://stevenygard.com/projects/class-dump/) を使って Sketch.app のヘッダーファイルを抽出し、ひたすら **目 grep** をしてシェイプ操作とグリッドに関する API を探し出し、プラグインの実装に役立てた。
また、先人によって公開されている数多の Sketch プラグインのソースを見ることも、開発の助けになった。 また、先人によって公開されている数多の Sketch プラグインのソースを見ることも、開発の助けになった。
# 結論 # 結論
苦行僧じみたSketchプラグインの開発には __class-dump____Console.app__ が必携。 苦行僧じみた Sketch プラグインの開発には **class-dump****Console.app** が必携。

View File

@ -3,7 +3,7 @@ title: Sketch 3 plugin 'StickyGrid'
date: 2014-12-03 09:00:00 +09:00 date: 2014-12-03 09:00:00 +09:00
--- ---
For practicing Sketch plugin development, I created __StickyGrid__ to let shape points sticked with grids. For practicing Sketch plugin development, I created **StickyGrid** to let shape points sticked with grids.
![](http://randompaper.co.s3.amazonaws.com/Sketch-StickyGrid/stickygrid.gif) ![](http://randompaper.co.s3.amazonaws.com/Sketch-StickyGrid/stickygrid.gif)
@ -13,7 +13,7 @@ Draw something in rough and apply this plugin then you'll get geometric shapes a
# How to install # How to install
From [GitHub releases](https://github.com/uetchy/Sketch-StickyGrid/releases/latest), Download a zipped archive then unarchive it then double click __StickyGrid.sketchplugin__ so you are prepared for using StickyGrid. From [GitHub releases](https://github.com/uetchy/Sketch-StickyGrid/releases/latest), Download a zipped archive then unarchive it then double click **StickyGrid.sketchplugin** so you are prepared for using StickyGrid.
Loving _CLI-way_ than anything, You also want to run those commands to get the same thing. Loving _CLI-way_ than anything, You also want to run those commands to get the same thing.
@ -24,9 +24,9 @@ git clone https://github.com/uetchy/Sketch-StickyGrid.git
# Usage # Usage
At first, selecting __`ctrl` + `⌘` + `G`__ を押すと、パスがグリッドの交差点に吸い付く。 At first, selecting **`ctrl` + `⌘` + `G`** を押すと、パスがグリッドの交差点に吸い付く。
ショートカット以外にも、メニューから__Plugins > Sketch-StickyGrid > Snap to Grid__を選んでも良い。 ショートカット以外にも、メニューから**Plugins > Sketch-StickyGrid > Snap to Grid**を選んでも良い。
シェイプはもちろん、グルーピングされたシェイプも、逆にシェイプポイントだけでも吸い付く。 シェイプはもちろん、グルーピングされたシェイプも、逆にシェイプポイントだけでも吸い付く。
@ -38,22 +38,22 @@ At first, selecting __`ctrl` + `⌘` + `G`__ を押すと、パスがグリッ
デバッギングには[Sketch-DevTools](https://github.com/turbobabr/sketch-devtools)を使っていましたが、最新版の Sketch では使えなくなってしまった。 デバッギングには[Sketch-DevTools](https://github.com/turbobabr/sketch-devtools)を使っていましたが、最新版の Sketch では使えなくなってしまった。
その代わりにMac標準アプリの __Console.app__ を使う方法が公式デベロッパーサイトの記事 [Debugging - Sketch Developer](http://developer.sketchapp.com/code-examples/debugging/) で紹介されている。 その代わりに Mac 標準アプリの **Console.app** を使う方法が公式デベロッパーサイトの記事 [Debugging - Sketch Developer](http://developer.sketchapp.com/code-examples/debugging/) で紹介されている。
スクリプト内で`log`関数を呼び出すと、Console.app にログが出力される。 スクリプト内で`log`関数を呼び出すと、Console.app にログが出力される。
```js ```js
log(context.document.gridSize); log(context.document.gridSize)
``` ```
## ドキュメントの情報源 ## ドキュメントの情報源
ドキュメントは公式デベロッパーサイト [Sketch Developer](http://developer.sketchapp.com) があるものの、パス編集に関するドキュメントは全くなかった。 ドキュメントは公式デベロッパーサイト [Sketch Developer](http://developer.sketchapp.com) があるものの、パス編集に関するドキュメントは全くなかった。
そこで、[class-dump](http://stevenygard.com/projects/class-dump/) を使って Sketch.app のヘッダーファイルを抽出し、ひたすら__目grep__をしてシェイプ操作とグリッドに関するAPIを探し出し、プラグインの実装に役立てた。 そこで、[class-dump](http://stevenygard.com/projects/class-dump/) を使って Sketch.app のヘッダーファイルを抽出し、ひたすら**目 grep**をしてシェイプ操作とグリッドに関する API を探し出し、プラグインの実装に役立てた。
また、先人によって公開されている数多の Sketch プラグインのソースを見ることも、開発の助けになった。 また、先人によって公開されている数多の Sketch プラグインのソースを見ることも、開発の助けになった。
# 結論 # 結論
苦行僧じみたSketchプラグインの開発には__class-dump__と__Console.app__が必携。 苦行僧じみた Sketch プラグインの開発には**class-dump**と**Console.app**が必携。

View File

@ -13,7 +13,7 @@ Thalmic LabsのMYOアームバンドが届いたのでGoogle Chromeをマイノ
# 基本 # 基本
Luaで記述し、拡張子は__.myo__を使う。 Lua で記述し、拡張子は**.myo**を使う。
作成したスクリプトは Myo Connect を経由してアームバンドとやりとりをすることになる。 作成したスクリプトは Myo Connect を経由してアームバンドとやりとりをすることになる。
@ -35,7 +35,7 @@ function onForegroundWindowChange(app, title)
end end
``` ```
onForegroundWindowChangeの返り値が__true__の場合、スクリプトをアクティブにする。つまり上のように書けばGoogle Chromeのウィンドウが最前面に出ている時だけスクリプトを有効化させることが出来る。 onForegroundWindowChange の返り値が**true**の場合、スクリプトをアクティブにする。つまり上のように書けば Google Chrome のウィンドウが最前面に出ている時だけスクリプトを有効化させることが出来る。
いかなる状況でもジェスチャーをハンドルしたい場合は以下のように書く。 いかなる状況でもジェスチャーをハンドルしたい場合は以下のように書く。
@ -45,7 +45,7 @@ function onForegroundWindowChange(app, title)
end end
``` ```
実際には、__親指と中指でダブルタップ__ するジェスチャーを検知した後に、全てのMyo ScriptsのonForegroundWindowChangeを呼び出している。そしてtrueが返ってきたスクリプトのみを実行している。 実際には、**親指と中指でダブルタップ** するジェスチャーを検知した後に、全ての Myo Scripts onForegroundWindowChange を呼び出している。そして true が返ってきたスクリプトのみを実行している。
アクティブになったスクリプトは一定時間が経過してアームバンドがロックされるまでイベントハンドラーが呼ばれ続ける。 アクティブになったスクリプトは一定時間が経過してアームバンドがロックされるまでイベントハンドラーが呼ばれ続ける。
@ -66,7 +66,7 @@ end
### pose の種類 ### pose の種類
| pose | 意味 | | pose | 意味 |
|----|---| | ------------- | ------------------------ |
| rest | 安静時 | | rest | 安静時 |
| fist | 握り拳 | | fist | 握り拳 |
| fingersSpread | 手を開く | | fingersSpread | 手を開く |
@ -89,7 +89,7 @@ onPeriodicはスクリプトがアクティブな間ずっと呼ばれ続ける
# 実装 # 実装
以上のハンドラーを駆使し作ってみる。 以上のハンドラーを駆使し作ってみる。
今回のようにGoogle Chromeのスクロール操作をアームバンドのジェスチャーでやりたい場合、__onPeriodic__`myo.getRoll()`メソッドを呼び出せば手首の回転する角度を取得出来るわけである。しかし、そのまま__onPeriodic__上にスクロールを行うコードを続けて書くと常にアームバンドの傾き具合でスクロールされてしまい困る。 今回のように Google Chrome のスクロール操作をアームバンドのジェスチャーでやりたい場合、**onPeriodic**`myo.getRoll()`メソッドを呼び出せば手首の回転する角度を取得出来るわけである。しかし、そのまま**onPeriodic**上にスクロールを行うコードを続けて書くと常にアームバンドの傾き具合でスクロールされてしまい困る。
そこで、「握り拳を握っている間だけ手首の傾きによってウェブページをスクロールさせる」ようにする。 そこで、「握り拳を握っている間だけ手首の傾きによってウェブページをスクロールさせる」ようにする。

View File

@ -12,6 +12,7 @@ gem install cabocha
``` ```
でインストール出来る。 でインストール出来る。
> cabocha-ruby をインストールする前に、CaboCha を`brew install cabocha`かなんかでインストールしておかないと make が失敗するので注意すること。 > cabocha-ruby をインストールする前に、CaboCha を`brew install cabocha`かなんかでインストールしておかないと make が失敗するので注意すること。
## 使う ## 使う

View File

@ -5,16 +5,16 @@ date: 2015-02-26 09:00:00 +09:00
gulp + Browserify(+ debowerify)という構成で Web サイトを作っていると、SASS にも debowerify 相当のものが欲しくなってくる。 gulp + Browserify(+ debowerify)という構成で Web サイトを作っていると、SASS にも debowerify 相当のものが欲しくなってくる。
ちなみに、__debowerify__ というのは、 ちなみに、**debowerify** というのは、
```js ```js
var Velocity = require("velocity"); var Velocity = require('velocity')
``` ```
という JavaScript を、 という JavaScript を、
```js ```js
var Velocity = require("./../../bower_components/velocity/velocity.js"); var Velocity = require('./../../bower_components/velocity/velocity.js')
``` ```
という風に、bower_components 内のパスに解決してくれる Browserify transform だ。 という風に、bower_components 内のパスに解決してくれる Browserify transform だ。
@ -28,31 +28,28 @@ var Velocity = require("./../../bower_components/velocity/velocity.js");
まずは`npm install --save-dev gulp gulp-sass decomposer`で必要なものをインストールしておく。既存のプロジェクトに追加するなら decomposer だけでいい。 まずは`npm install --save-dev gulp gulp-sass decomposer`で必要なものをインストールしておく。既存のプロジェクトに追加するなら decomposer だけでいい。
__gulpfile.js__ はこのように定義しておく。 **gulpfile.js** はこのように定義しておく。
```js ```js
var gulp = require('gulp'); var gulp = require('gulp')
var sass = require('gulp-sass'); var sass = require('gulp-sass')
var decomposer = require('decomposer'); var decomposer = require('decomposer')
gulp.task('styles', function() { gulp.task('styles', function() {
gulp.src('src/styles/**/*.sass') gulp
.src('src/styles/**/*.sass')
.pipe(decomposer()) .pipe(decomposer())
.pipe(sass({ indentedSyntax: true })) .pipe(sass({ indentedSyntax: true }))
.pipe(gulp.dest('dist/css')); .pipe(gulp.dest('dist/css'))
}); })
``` ```
ポイントは`sass` __よりも前__`decomposer`を挟むこと。なぜなら、外部から@importしたmix-insや変数はSASSコンパイル時に解決されるからだ。`sass`よりも後に置くと、SASSが@importを解決出来ずにエラーが発生する ポイントは`sass` **よりも前**`decomposer`を挟むこと。なぜなら、外部から@import した mix-ins や変数は SASS コンパイル時に解決されるからだ。`sass`よりも後に置くと、SASS @import を解決出来ずにエラーが発生する。
続けて SASS を書こう。 続けて SASS を書こう。
```scss ```scss
@import normalize.sass @import normalize.sass @import styles/font body font-family: $ff-gothic;
@import styles/font
body
font-family: $ff-gothic
``` ```
> `$ff-gothic`は [uetchy/styles](https://github.com/uetchy/styles) の _font.sass_ で定義されている font-family だ。 > `$ff-gothic`は [uetchy/styles](https://github.com/uetchy/styles) の _font.sass_ で定義されている font-family だ。
@ -72,32 +69,32 @@ decomposer はBowerモジュールに入っている任意のファイルを指
記法はこのようになる。 記法はこのようになる。
```scss ```scss
@import [Bowerモジュール名]/[ファイル名] @import [Bowerモジュール名]/[ファイル名];
``` ```
例えば、よく使うスタイルをまとめた [uetchy/styles](https://github.com/uetchy/styles) の___font.sass__ を@importするなら 例えば、よく使うスタイルをまとめた [uetchy/styles](https://github.com/uetchy/styles) の**\_font.sass** を@import するなら
```scss ```scss
@import styles/font @import styles/font;
``` ```
と書ける。 と書ける。
ここでもし`@import styles`と、ファイル名を省略して書くとどうなるのだろうか? コンパイルに失敗する? そんなことはない。 ここでもし`@import styles`と、ファイル名を省略して書くとどうなるのだろうか? コンパイルに失敗する? そんなことはない。
モジュール名だけを書くと、decomposerは__bower.json__に書かれているmainファイルを見つけ出して、それを@importしてくれるのだ モジュール名だけを書くと、decomposer は**bower.json**に書かれている main ファイルを見つけ出して、それを@import してくれるのだ。
もしmainファイルが複数指定されていたら、`index.sass``[モジュール名].sass`、または__mainっぽい名前__ を持つファイルを@importする もし main ファイルが複数指定されていたら、`index.sass``[モジュール名].sass`、または**main っぽい名前** を持つファイルを@import する
つまり、 つまり、
```scss ```scss
@import normalize.sass @import normalize.sass;
``` ```
と書けば、 と書けば、
```scss ```scss
@import ../bower_components/normalize.sass/normalize.sass @import ../bower_components/normalize.sass/normalize.sass;
``` ```
という風に解決される。 という風に解決される。

View File

@ -9,7 +9,7 @@ Gulpをつかって .sketch から .icns を生成するために、[gulp-sketch
# はじめに # はじめに
.icns を作るには様々なサイズのアイコン画像を格納した __iconset__ をつくり、それを `iconutil` に渡します。ここで面倒なのは iconset です。 .icns を作るには様々なサイズのアイコン画像を格納した **iconset** をつくり、それを `iconutil` に渡します。ここで面倒なのは iconset です。
iconset の作成には 16×16 ... 512×512 の 6 種類のサイズのアイコンと、さらにそれぞれの Retina 用のアイコンも加えて、計 12 種類ものサイズの画像が必要です。 iconset の作成には 16×16 ... 512×512 の 6 種類のサイズのアイコンと、さらにそれぞれの Retina 用のアイコンも加えて、計 12 種類ものサイズの画像が必要です。
@ -46,7 +46,7 @@ gulp.task 'icons', ->
.pipe gulp.dest 'icons/' .pipe gulp.dest 'icons/'
``` ```
iconsタスクを実行すると、iconsフォルダの中に__app.icns__が生成されます。 icons タスクを実行すると、icons フォルダの中に**app.icns**が生成されます。
![](/uploads/create-icns-from-sketch/result.png) ![](/uploads/create-icns-from-sketch/result.png)

View File

@ -9,7 +9,7 @@ date: 2016-02-11 09:00:00 +09:00
![](http://randompaper.co.s3.amazonaws.com/Polyglot/screencast1.gif) ![](http://randompaper.co.s3.amazonaws.com/Polyglot/screencast1.gif)
この Extension は __Google Translate API__ を使っている。だからこれを Safari で使うためには、まず Google Cloud Platform から APIキーを手に入れなくてはならない。その手続きは少しばかり面倒なので、[スクリーンショット付きのガイド](https://github.com/uetchy/Polyglot/wiki/How-to-obtain-Google-Cloud-Platform-API-key)を作った。 この Extension は **Google Translate API** を使っている。だからこれを Safari で使うためには、まず Google Cloud Platform から API キーを手に入れなくてはならない。その手続きは少しばかり面倒なので、[スクリーンショット付きのガイド](https://github.com/uetchy/Polyglot/wiki/How-to-obtain-Google-Cloud-Platform-API-key)を作った。
## Inside Safari Extension ## Inside Safari Extension

View File

@ -22,9 +22,15 @@ GFMが書けて、UIデザインが秀逸なノートアプリを紹介します
<http://www.bear-writer.com> <http://www.bear-writer.com>
北イタリア産のノートアプリです。記事中に __ハッシュタグ__ を書き込むと、リストでまとめてくれる機能が秀逸です。 北イタリア産のノートアプリです。記事中に **ハッシュタグ** を書き込むと、リストでまとめてくれる機能が秀逸です。
iCloud を使って、macOS と iOS アプリの間でノートを同期することが出来ます。 iCloud を使って、macOS と iOS アプリの間でノートを同期することが出来ます。
## SnippetsLab
<https://www.renfei.org/snippets-lab/>
正確にはスニペット管理アプリですが、Markdown+MathJax をサポートしており、数式を使ったメモを書くことが出来ます。
## Inkdrop ## Inkdrop
<https://www.inkdrop.info> <https://www.inkdrop.info>
@ -37,4 +43,4 @@ iCloudを使って、macOSとiOSアプリの間でノートを同期すること
<https://typora.io> <https://typora.io>
エディタとプレビューが一体化したタイプのエディタです。これ以外にお勧めできるアプリはありません エディタとプレビューが一体化したタイプのエディタです。左右分割よりも WYSIWYG エディタの方がわかりやすい派なので、これ一択です

View File

@ -42,4 +42,4 @@ python3 -m venv venv
source ./venv/bin/activate source ./venv/bin/activate
``` ```
then `venv` will creates virtual envs on __./venv__ folder on the root of your project. then `venv` will creates virtual envs on **./venv** folder on the root of your project.

View File

@ -2,66 +2,62 @@
--- ---
@import url(https://fonts.googleapis.com/css?family=PT+Serif:400, 700); @import url(https://fonts.googleapis.com/css?family=PT+Serif:400, 700);
$break-small: 500px; $break-small: 500px;
$break-large: 840px; $break-large: 840px;
body { body {
width: 800px; width: 800px;
margin: 0 auto; margin: 0 auto;
padding: 0 20px; padding: 0 20px;
font-family: 'PT Serif', "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif; font-family: 'PT Serif', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
font-feature-settings: 'kern', 'palt', 'pwid'; font-feature-settings: 'kern', 'palt', 'pwid';
-webkit-font-feature-settings: 'kern', 'palt', 'pwid'; -webkit-font-feature-settings: 'kern', 'palt', 'pwid';
-moz-font-feature-settings: 'kern', 'palt', 'pwid'; -moz-font-feature-settings: 'kern', 'palt', 'pwid';
-moz-font-feature-settings: 'kern=1', 'palt', 'pwid'; -moz-font-feature-settings: 'kern=1', 'palt', 'pwid';
@media screen and (max-width: $break-large) { @media screen and (max-width: $break-large) {
width: auto; width: auto;
margin: 0; margin: 0;
} }
} }
// MathJax // MathJax
#MathJax_Message { #MathJax_Message {
display: none; display: none;
} } // Highlight.js
// Highlight.js
.hljs { .hljs {
border: 1px solid #d7d7d7; border: 1px solid #d7d7d7;
border-radius: 3px; border-radius: 3px;
background-color: #fff; background-color: #fff;
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
font-size: 14px; font-size: 14px;
padding: 12px 16px; padding: 12px 16px;
line-height: 1.8em; line-height: 1.8em;
} }
code { code {
padding: 0 12px; padding: 0 12px;
} }
p code { p code {
padding: 3px 10px; padding: 3px 10px;
background: #f6f6f6; background: #f6f6f6;
border-radius: 3px; border-radius: 3px;
font-size: 16px; font-size: 16px;
} }
a:hover,
a:hover, a:active, a:link, a:visited { a:active,
a:link,
a:visited {
color: black; color: black;
text-decoration: none; text-decoration: none;
} }
h1,
h1, h2, h3, h4, p { h2,
h3,
h4,
p {
margin: 0; margin: 0;
padding: 0; padding: 0;
line-height: 1.333em; line-height: 1.333em;
} }
hr { hr {
display: block; display: block;
width: 100%; width: 100%;
@ -70,7 +66,6 @@ hr {
border: 0; border: 0;
margin: 40px 0; margin: 40px 0;
} }
.header { .header {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -78,42 +73,34 @@ hr {
align-items: center; align-items: center;
padding: 5px 0; padding: 5px 0;
border-bottom: 1px solid #efefef; border-bottom: 1px solid #efefef;
@media screen and (max-width: $break-small) { @media screen and (max-width: $break-small) {
justify-content: center; justify-content: center;
} }
.logo { .logo {
font-size: 24px; font-size: 24px;
font-weight: bold; font-weight: bold;
margin: 10px 0 10px; margin: 10px 0 10px;
} }
.menu { .menu {
list-style: none; list-style: none;
padding: 8px 0; padding: 8px 0;
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
.menu__item:not(:last-child) { .menu__item:not(:last-child) {
margin-right: 20px; margin-right: 20px;
} }
@media screen and (max-width: $break-small) { @media screen and (max-width: $break-small) {
padding: 0; padding: 0;
margin: 10px 0; margin: 10px 0;
} }
} }
} }
.metro { .metro {
text-align: center; text-align: center;
padding: 80px 0 40px; padding: 80px 0 40px;
.logo { .logo {
font-size: 60px; font-size: 60px;
} }
.menu { .menu {
list-style: none; list-style: none;
padding: 8px 0; padding: 8px 0;
@ -122,19 +109,15 @@ hr {
justify-content: center; justify-content: center;
margin-top: 20px; margin-top: 20px;
font-size: 20px; font-size: 20px;
.menu__item:not(:last-child) { .menu__item:not(:last-child) {
margin-right: 20px; margin-right: 20px;
} }
} }
@media screen and (max-width: $break-small) { @media screen and (max-width: $break-small) {
padding: 50px 0 40px; padding: 50px 0 40px;
.menu { .menu {
font-size: 15px; font-size: 15px;
} }
} }
} }
@import 'post';
@import 'post'