GrowlStyleのOreNamaをMacBook向け(横1280px)にしてみた

タイトル通り。

Ustream実況用ニコニコ風Growlスタイル OreNamaというのが公開されていて、これはGrowlと言われるMac向けの通知用ソフトウェアの表示スタイルの一部で、あとはぐぐれ

それで、これ見てみたら、横が720pxだか780pxあたりまでで、MacBookで流すと画面いっぱいに流れてくれない。

キモイので、とりあえずなんとかしてみた。けど、すごいテキトーだから誰かにまかせる。

とりあえず、流れれればいいやって人向けかなー。あとは、細かい事は自分でstyle.cssか、表示時間の調整をしてみては。おれは、システム拡張設定のGrowl画面から弄れる方のOreNama表示時間は6.5sぐらいにした。

で、ダウンロード形式もめんどくさいんで、貼付けておくね!

ああ、ちなみにstyle.cssだけど、OreNamaインストールしてから、/Users/accountname/Library/Application Support/Growl/Plugins/OreNama.growlStyle のパッケージを開けば中にあるよ。

html {
 height: 100%;
}
body {
 font-family: "Hiragino Kaku Gothic StdN", MeiryoKe_PGothic;
 align: left;
 padding: 0px 0px 0px 0px;
 position: relative;
 margin-left: -1280px; /* -"最大横幅サイズ" */
 margin-top: 20px; /* 各Growl通知間のスペース */
 margin-right: 0;
 margin-bottom: 0;
}
#box {
 font-size: 24px; /* 文字サイズ */
 width: 1440px; /* =最大横幅サイズ+画面左からの横幅サイズ */
 -webkit-text-stroke-width:1px; /* 文字のアウトライン太さ */
 -webkit-text-stroke-color:#000; /* 文字のアウトライン色 */
 text-shadow: #000 0 0 2px; /* 疑似アンチエイリアス */
 white-space: nowrap;
 word-wrap: normal;
 overflow: visible;
 position: relative;
 margin: 0;
 padding: 0;
 white-space: normal;
 word-wrap: break-word;
}
/* アニメーション(文字流し)の設定 */
#animation  {
 margin-left: 1280px; /* 最大横幅サイズ */
 width: 1280px; /* 最大横幅サイズ */
 -webkit-animation-name: move; /* アニメーション名 */
 -webkit-animation-duration: 11.5s; /* 移動表示時間(秒) */
 -webkit-animation-iteration-count: 1; /* アニメーション実行回数 */
 -webkit-animation-timing-function: linear; /* アニメーションの種類 */
 margin-top: 0;
 margin-right: 0;
 margin-bottom: 0;
 padding: 0;
 white-space: normal;
 word-wrap: break-word;
}
/*アニメーション制御 0%=始点 100%=終点 */
@-webkit-keyframes move {
 0%        { -webkit-transform: translate(1280px,0px);} /* "最大横幅サイズ",0 */
 60%        { -webkit-transform: translate(0px,0px);}
 75%        { -webkit-transform: translate(0px,0px);}
 100%    { -webkit-transform: translate(-1280px,0px);} /* "最大横幅サイズ",0 */
}
/* Growl優先度(プライオリティ)設定 */
.verylow {
 color: #929292;
}
.moderate {
 color: #c0c0c0;
}
.normal {
 color: #fff;
}
.high {
 color: #fbff32;
}
.emergency {
 color: #f71818;
}

とりあえず、作者さんがTwitter用なるものも作ってるみたいだから、そっちのほう待った方が良いかも〜ねかもね。