社内ではドキュメントの共有に Scrapbox が活発に使われており、するといきおい UserCSS や UserScript もさかんである。具体的には、/customize という共有のプロジェクトがあってみんなの自慢の装飾やカスタマイズが共有されている。これを個々人で import して使うんである。 こんな感じ。 自分の場合は /motemen/UserCSS/common に常に適用したいスタイルを書いておいて各プロジェクトから読み込んでいる。このページからさらに、共有プロジェクトや他人の個人プロジェクトページからよさそうな設定を import している次第。 つまりは多段インポート。こういうことを続けていると、だんだんと読み込みの遅さが気になってくる。こういうのはバンドルすればいいのだけど、巷のツールを普通に使うことはできない。インポートしてるリソースに認証がかかっているからだ
スクリーンショットやライブデモ・動画撮影で大事な情報を隠せる、CSS3を使った動的マスキング - SORACOM公式ブログ
こんにちは、ソラコムのテクノロジー・エバンジェリスト 松下(ニックネーム: Max)です。 エバンジェリストはセミナーや執筆を通じて、IoTの活用方法や最新事例を多くの人に知っていただく役割を担っており、資料作りでスクリーンショットを利用したり、セミナーでライブデモを行うことが多くあります。 ここでは、Webブラウザの「CSS3のフィルタ関数」を利用して、Webページ上の情報を動的に隠す(マスキング)する方法を解説します。IoTやSORACOMの話からは少し外れていますが、私(Max)がエバンジェリストとしての活動の際に得たことを「MaxのTips」として紹介し、皆さんにも役立てていただければと思います。 この方法を使うと、Webページを表示した時点で情報がマスキングされるため、スクリーンショット取得後の編集が不要になるだけでなく、ライブデモや動画撮影も安心して行うことができます。 例えば
正規表現でmasawada - hogashi.*
masawada Advent Calendar 2021 - Adventar 10日目の記事です。昨日の id:Sixeight さんに見事に釘を刺されてしまったので、ありがたく受け取り、whywaita Advent Calendar 2021 - Adventarはこちらに書きました → 秘蔵UserCSS大放出祭 - hogashi.*。大目に見てください！ id:masawada / id:whywaita Advent Calendar 七五三おめでとうございます。 7, 5, 3 と素数ですね*1。ゴルゴ13が好きな id:hogashi です。 七五三は 11月 15日にやるそうです。 11 は素数だし、 15 は 3＋5＋7 ですね。 3×5 でも 15 になります。 能では、 7歳ごろから稽古を始めるので、このあたりを初心というそうで*2、世阿弥曰く、このころに自然に
uBlock Origin のフィルターに関する覚書です。 はじめにuBlock Origin (以降uBO) は、「広告ブロッカー」として導入している方がほとんどだと思います。ですが uBO は、広域スペクトルブロッカーです。これは、単なる「広告ブロッカー」としても動作することができる、より強力なブロッカーです。 uBO のフィルターは、UserScript や UserCSS に類するツールの一種であり、フィルターを理解して使用することでより良いウェブ環境を簡易に構築できます。 ※「コンテンツブロッカー」と呼ばれることもあります。 ※Adblock Plus のフィルターも大部分が類似しています。 フィルターの種類uBOのフィルターには、次の種類があります。 静的ネットワークフィルター (static network filtering)対象リクエスト（通信）をブロックする書式：[対象
Free and open-source, community-driven platform for sharing and browsing UserCSS userstyles, and a replacement for UserStyles.org, made by the userstyles community. Explore userstyles Create an account Features What sets us apart from other platforms. Privacy-first We don't track you, and we won't sell, share, or mine your data.
UserCSS - Cosense ヘルプ
テーマを変更するだけでは物足りず、さらにCosense側のHTML構造の変更を物ともしない上級者向けの危険な機能です 当然ですが、画面全体が操作不能になる可能性があります devtoolで各自復旧してください この意味が理解できない人は使うべきではありません 自分用とプロジェクト全体用の2種類があります もし試すなら、まず自分用から試してみるとよいでしょう 自分用のCSS 自分のページを作成し、コードブロックでcode:style.cssというCSSを書く 自分のページ 自分にだけ有効なCSSを適用できます 結果を反映するにはブラウザリロードが必要です。 project全体に有効なCSS ProjectCSSとも呼ぶ settingsというページを作り、コードブロックでcode:style.cssというCSSを書く そのプロジェクト内の全員に有効なCSSとなります。 公開プロジェクトの場合
ニコニコ動画で「ランキングの広告を非表示」「視聴ページの外観変更」などのカスタムを可能にする拡張機能「Niconico-PepperMint＋」使用レビュー
ニコニコ動画を使っていると「動画視聴ページがゴチャゴチャしてるな」とか「ランキング内の広告が邪魔だな」といった不満点が出てきます。ChromeやFirefox向けの拡張機能「Niconico-PepperMint＋」を使えばニコニコ動画の外観を自分好みにカスタマイズ可能とのことなので、実際にNiconico-PepperMint＋を使う方法や効果をまとめてみました。 ニコニコ動画を、もっとクールに。「Niconico-PepperMint+」を作ったので紹介します - ニコニコ動画 ◆Niconico-PepperMint＋のインストールと設定画面の開き方 Niconico-PepperMint＋はCYakigasi氏が公開していたUserCSS「Niconico-PepperMint」を拡張機能へと作り直したもので、Chrome版とFirefox版が用意されています。今回はChrome版
古き良きブラウザなら訪問済みのリンクが紫になっていた。 通常のウェブページなら訪問済みならもう新しい情報はない可能性があるので色を薄くしたりするけど、Scrapboxのページ一覧では、訪問済みのページは、あの時の情報を見たい、という目的で探している場合があるので、訪問済みのページが目立っていると便利。 こういうCSSをsettingsに置いてみる。UserCSSについてはUserCSS - Scrapbox ヘルプを参照。 code:style.css .grid li.page-list-item a .title { color: #777; } .grid li.page-list-item a:visited .title { color: #000; } すると、こんな調子で、訪問済みのページの色が濃くなる。 https://scrapbox.io/hitode909/ 個人のS
ブログのテーマを変えたいなと思っていてずっと変えてなかった． はてなブログ Pro にするとトッフページが全文から一覧表示にできたりと ナイスな機能があって最近切り替えたものの， デザインをあててなくて崩壊させたままにしていた． なので，この機会にデザインをつくりなおそうということで， リポジトリで管理するようにしたり 自分ごのみのローカル開発環境をつくったりしていた． こういうかんじ こんな感じで Hot Module Replacement ですぐ変わってくれるようにした． 複数のブラウザですぐ確認できて楽しくなる: 複数ブラウザで確認 ページ遷移しても維持されてうれしい: 維持されている 最初: 素朴プラン CSS をそのまま書くのはナウくないな〜ということで 適当な CSS プリプロセッサを入れたりする環境をつくることにした． 最初はいつものように Sass を入れて webpac
Obsidianで人生が変わる（予定）｜のらてつ
今年に入ってからObsidianというツールを使い始め、これまでにない手応えを感じている。 Obsidianというワードを初めて見た方にざっくり説明すると、カテゴリとしては「メモツール」または「ノートツール」であり、私なりに言い表すならば「markdownファイルを管理し、ページ間をリンクで繋げていくことで私たちの脳味噌と近い形の情報管理ができる（かもしれない）ツール」である。 具体的にどんな機能があるかということは既に詳細に説明してくれている方がいらっしゃるので、リンクを最後に貼っておきます。Obsidianに触れたことがない方はそちらを先にお読みいただくと良いと思います。 数々のメモ・ノートツールとの格闘さて、今まで様々なツールを使ってきたのだが、どれも使い始めは「最強か！！！」と思うものの、だいたい数ヶ月経つと、後から気がついた不便に目をつぶったり無闇に自分ルールを構築したりという無
ニコニコ動画などで活動しているCYakigasi(やきがし)さんが、ニコニコ動画のサイトの表示や動画再生プレイヤーの機能を使いやすく改変できるUserCSS「Niconico-PepperMint」のv1.5を公開しました。Niconico-PepperMintを使用すると、ニコニコ動画ユーザーがよく見るランキングの広告動画を非表示にしたり、左右が狭いニコニコ大百科の記事を画面いっぱいに表示したりと、ニコニコ動画ユーザーのかゆいところに手が届く便利機能を豊富に使えるとのことなので、実際にブラウザにインストールして使ってみました。 Niconico-PepperMintを使うには、ブラウザにユーザースタイルシートを導入できるようにする拡張機能が必要で、おすすめは「Stylus」とのこと。 Stylus - Chrome ウェブストア https://chrome.google.com/web
Redesign the web with Stylus, a user styles manager. Stylus allows you to easily install themes and skins for many popular sites. Redesign your favorite websites with Stylus, an actively developed and community driven userstyles manager. Easily install custom themes from popular online repositories, or create, edit, and manage your own personalized CSS stylesheets. Features * Versatility of theme
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
DevTools上でesbuildするChrome拡張を書いた - 詩と創作・思索のひろば
uBlock Origin フィルター覚書（書き方・サンプル）
Website themes and skins — UserStyles.world
Scrapboxの訪問済みのページを目立たせる - hitode909の日記
ローカルでホットリロードできる便利なブログテーマ開発環境づくり - マンガ〜ノ伊藤ノ〜ト
ニコニコ動画の表示をすっきりさせてくれる「Niconico-PepperMint」をサクッと簡単にインストールして使ってみた
Stylus - Chrome Web Store