CSS3で画像にドロップシャドウをつける、画像を丸くする

Read More
Roguer.png

ブログで使用しているスタイルシートを少し修正。

最近iPhone系の画像がフラットデザインになったこともあり結構シンプルになってしまってスクリーンショットのメリハリが付かない感があったので枠を入れることにしました。

画像にドロップシャドウをつける


#content img {
border: 1px solid #000000;
box-shadow: #000000 0 0 10px -2px;
height: auto;
margin-bottom: 12px;
max-width: 100%;
}

box-shadowに該当します。これだけでも結構見栄えが良くなりますがキャプチャ系のソフトで影がつくものがあるのでその辺りは随時調整を、、

Roguer

こんな感じになります。boderタグで枠線もつけているので強調された形になりますね、。

今風な丸い感じのアイコン

元々は、下のような感じでリンクを右側に出していまいた。

Roguer 2


.wp-post-image {
border: 1px solid #CCCCCC;
border-bottom-left-radius: 50%;
border-bottom-right-radius: 50%;
border-top-left-radius: 50%;
border-top-right-radius: 50%;
float: left;
margin-bottom: 10px;
margin-left: -80px;
padding: 1px;
height: 64px;
width: 64px;
}

このradiusというスタイルで簡単に丸くなります。

Roguer 3

[VM] Vagrant1.1の機能が楽しそうです

そういえばそういう環境を簡単に作ることができる Vagrant がありましたね。最近アップデートして VirtualBox 以外もサポートしているとか。今のMacbook AirのHDDが慢性的に不足しているのもあって全然試せていませんが

仮想マシン管理ツール「Vagrant 1.1」リリース、VMwareなどVirtualBox以外の仮想化ソフトウェアがサポートされる – SourceForge.JP Magazine : オープンソースの話題満載

Vagrantは仮想マシンの設定やプロビジョニングを実行できるコマンドラインツール。これを利用することで、バッチやシェルスクリプトから仮想マシンを作成したり、仮装マシン上に環境を容易に構築することができるようになる。「Chef」や「Puppet」といった設定管理ツールとの連携も可能。当初はOracle VirtualBox向けのツールだったが、本バージョンからはこれ以外の仮想化ソフトウェアのサポートも進められている。対応OSはWindowsおよびMac OS X、Linuxで、ライセンスはMIT License。

なんかChefとかも連動するとか、、、個人ユースの仮想環境としてはかなり面白い感じになりそうです。Vmwareも有料でサポートしているとなると仕事でも使えそうな感じですね。どんな感じになっているのか見てみないとわからないのですが。なによりAWSとかRackSpaceも対応するプラグインが出ている感じなのが面白い。これでOpenStackのデプロイとか出来るんだろうか?

いろいろ見てみるとやっぱり楽しそうだ。はやくHDD買ってきてデータを追い出して遊ぼう。

アップルからの電話に感謝

Read More
20130130-205946.jpg

ちょっと驚きました。

昼から家の方にアップルから電話があったと連絡がありました。なんかやったのかな?とドキドキしていたのです。日頃の行いがいいからなんかもらえるのかな?とか思いながら^^;

で、夕方にメールが来たのですが

20130130-205946.jpg

おお!

そうでした。すっかり忘れてました。更新をしなければいけなかったのです。いやー真面目にアップル様々です。助かりました。これで更新し忘れていたら色々大変です。

というわけで早速購入しました。円高、円安もありますがまだ8400円でした。まだ反映されてないのが不安です。Safari使えと書いてあったのにChromeでしたのも不安です。

それにしても今は、直接電話で知らせてくれたりするのですね。しかも日本語で。

本当に知らせてくれてありがとう!

[vim]人気のカラーテーマSolarizedを使う

Read More

gvimのカラースキーマを変更してみました。

気が滅入ってくるとエディタをいじって遊んでしまうこの頃。仕事しよう。

新卒さんのための人気Vimカラースキーマランキング5+1(vim.org & github調べ) – 常識という迷信

テーマを探していたらこんなページを見つけました。「新卒さん」は最近Vimとか触るのだろうかと思いながらも見てみるとGithubで人気のSolarizedというカラーテーマがあるのですね。

 

いい感じですね。もっと「くっきり」としているのも好みですがこのくらいもいい感じなのかなと思いました。何よりこのテーマ色々な環境用のカラーテーマが用意されているのも良いですね。

  • vim
  • Emacs
  • IntelliJ IDEA
  • NetBean
  • SeeStyle theme for Coda & SubEthaEdit
  • TextMate
  • TextWangler & BBEdit
  • Visual Studio
  • Xcode
  • Xresources
  • iTerm2
  • OS X Terminal.app
  • Putty

エディタじゃなくてターミナルのカラーもありますね。詳しくは https://github.com/altercation/solarized を確認して下さい。

 

さて、今回はVimで使いたいのです。それほど人気ならVundleでも使えるのかと思ったら使えました。

: BundleSearch solarized

image

お!見つかりましたね。素晴らしいです

: BundleInstall solarized

image

これでダウンロードできますのであとは _vimrc などに「Bundle ‘Solarized’」を記載しておきましょう。

使い方やカスタマイズはコチラを参考にしてください。Vundleを使っていない場合には普通にColorスキーマをダウンロードして使えば問題無いです。

 

先日のPowerLineの後に、GDI+で結局アンチエリアスかけて使用しています。どうも日本語フォントが微妙に合わない(上が途切れる)のでこれでまかないました。

image

[Vim] Powerlineを導入してみた

Read More

久しぶりに色々みていたらPowerlineという物が最近はあるそうで、ステータスラインがかっこ良くなります。Windows環境でも問題なく使えるみたいなので入れて見ました。

【Vim】Powerline でリッチなステータスラインを使う – blog.remora.cx

 

フォントの設定は、このサイトで紹介されている EnvyCode ( Envy Code R preview #7 (scalable coding font) » DamienG) という物を利用させてもらいました。

set encoding=utf-8
" フォントサイズはお好みで
"set guifont=Ricty_for_Powerline:h12
set guifont=Envy_Code_R_for_Powerline:h12
" こっちは日本語フォント
set guifontwide=Ricty:h12
" `fancy’ テーマに切り替え
let g:Powerline_symbols = ‘fancy’

 

まぁフォントは置いておいて肝心のPowerlineですが

image

なかなか良い感じですね。日本語も可愛らしく表示されています。環境は WindowsXP + gVIM (kaoriya ) になります。

image

INSERTモードになると、ステータスラインの色も変わるという感じです。フォントにパッチを当てることで「<」のような記号も表示されるようになりかなりリッチな感じですね。

ちょっとフォントの修正に手間取りましたが終わってしまえばいい感じになったので良かったです。

 

こんな事をやってみたくなったのもこの記事を読んだから。よくまとまっているし環境作るうえでも参考になります。

iTerm2 + zsh + tmux + vim で快適な256色ターミナル環境を構築する – ゆろよろ日記
vim-powerline …