kktCSS
CSS stylesheet for Mastodon to look like Kirakiratter (キラキラッター) from the popular idol franchise, Aikatsu! (アイカツ!).
Join the Kirakiratter community: https://kirakiratter.com
マストドンをTVアニメ「アイカツ！」に登場するSNS、キラキラッター風のカラーテーマに変更するCSSです。
キラキラッターへのアクセスはこちら。 https://kirakiratter.com
Installation Instructions:
Kirakiratter users will have this theme by default, but if you would like to use it on another Mastodon instance, read the following.
Desktop
Install the "Stylish" extension:
On Chrome/Opera/Vivaldi -- Opera users will need the "Download Chrome Extension" extension prior to installing Stylish.
On Firefox
Then visit Userstyles.org, hit "Install with Stylish" and you're done!
Or you can create a new style, configure it to take effect on the instance of your choice, and copy/paste the contents of kirakiratter.css into the stylesheet editor.
Mobile
Create a new bookmark using the following as the URL:
javascript:(function(){var s=document.createElement('link');s.setAttribute('href','https://masterdalk.github.io/kktCSS/kirakiratter.css');s.setAttribute('rel','stylesheet');s.setAttribute('type','text/css');document.getElementsByTagName('head')[0].appendChild(s);})()
Visit your instance of choice and then go to the bookmark you just created to load the stylesheet.
You'll need to do this every time you access the instance via mobile. If you have a better method for using a custom stylesheet on mobile, please feel free to suggest in GitHub Issues or on Kirakiratter!
Installation Instructions (Japanese):
氷上スミレ( https://kirakiratter.com/@sumire )です。
キラキラッターは、このkktCSSがテーマとして使われることになって、いつでも素敵なCSSコーデ(ィング)が楽しめるようになったよ。
他のインスタンスでもkktCSSを使いたい人もいるかもしれないから、使い方を解説するね。
Desktop
まずはブラウザに"Stylish"をインストールしちゃおう！
Chrome/Opera/Vivaldi用
(Operaの人は "Download Chrome Extension" も使ってインストールしてね)
Firefox用
インストールが終わったら、 Userstyles.orgのkktCSSページ の[Install with Stylish]ボタンを押して...、素敵なキラキラッターに着飾れたかな。楽しんでね。
Stylishはデザインを自分で編集できるから、新しいCSSコーデ(ィング)に挑戦することだってできちゃうんだ。
kirakiratter.com+kktCSS+キラキラブックマークレットで、キラキラッターを楽しもう！ も試してみて
Mobile
下の文字列でブックマークを作って、キラキラブックマークレットを用意してね
javascript:(function(){var s=document.createElement('link');s.setAttribute('href','https://masterdalk.github.io/kktCSS/kirakiratter.css');s.setAttribute('rel','stylesheet');s.setAttribute('type','text/css');document.getElementsByTagName('head')[0].appendChild(s);})()
名前は短くて、後で打ち込みやすいのにするのがおすすめ。
私は「kkt」で登録してる。
用意したら、kirakiratter.comを開いて、そこからブックマークを開くとデザインが変わるよ。
Chrome(Android/iOS)みたいなブックマーク一覧を新しいページで開いちゃうブラウザはコツがあって...
kirakiratter.comを開いた状態から、アドレス入力欄を出して、kkまで打ち込んで出てきたブックマークをクリックすればデザインが変わる、かな
ページを開くたびにブックマークから開かないとだめだけど、こればかりは仕方ないかな...
素敵なCSSでキラキラッターをもっと楽しんでね！