generated at
綾坂こと
画像がAyaExpTechに紐づいていますbsahd
Gyazoにすべき?
GitHubにおいてる画像jsDelivrで参照してるつもりだったのでそっちに変えました綾坂こと


2024/10/01 Update
名義 : 綾坂こと(読み : あやさかこと)
漢字表記 : 綾坂琴翔
別名義 : AyagawaP
年齢 : 18歳
誕生日 : 2006/02/23
性別 : (身体・自認ともに)
Pronouns : he - his - him (ey - eir - emでもOK)
職業 : 大学生
2024年度は学部1年生
学歴 : 公立小学 → 公立中学 → N高(正確にはS高) → 武蔵野美術大学 CI学科
血液型 : 未検査 (親の血液型から、A型O型のいずれか)
各種アカウント : https://axtech.dev/special/profile/を参照
infobox? なにそれ
おーーすげー
よろしくお願いします
あとは未来の自分が書いてくれるだろ、がんばえ〜
なんで未来の自分に託した??綾坂こと
takker

こんにちは!inajobcFQ2f7LRuLYPHiro Akiはるひstaseibesuto3.iconmaichancakwogikazeつばくろHyoumeganiisume基素takkernishioimo
/customizeにもいらっしゃった方ですねtakker
(FlowLauncher使っていないのであまり深く見れてはいませんが……)
それは別人ですかね、私はAyasaka綾坂こと
それはそれとして、それ面白そう……
あれ?違いましたか。ごめんなさい!takker
漢字表記も1文字しかあってなかったほんとごめんなさい
逆に英語表記は1文字しか違わない綾坂こと
infoboxの使い方が意図と違っているように見えますinajob
特にinfoboxの記法を使わず、自然な文で各項目について記載しておくとinfoboxの機能がいい感じに読み取ってくれるはずです。
今のようにinfoboxの記法を使うと、綾坂こと と書かれたページから情報を抽出するという動作をします(伝わっているだろうか?)
今このページに出ているinfoboxはmemberページによるものです
なるほど……?仮説を立てます綾坂こと
table:infobox で表示項目を指定すると、そのページがタグ付けされたすべてのページで自動的に生成される?
生成内容をなにか指定したい場合は2列目に指示が書ける?
確かに説明むずいはるひ
(伝わっているだろうか?)の気持ちがとてもよくわかるcak
shokai.iconさんのdemoの動画見てもらうのが一番分かりやすいだろうか
消えていた(し、打ち消したらshokaiさんが回ってしまった)
せっかくなのでたくさん回してみたtakker
ほう?!綾坂こと
ほんとだ、わざわざ指定とかしなくていいんだ
script.jsの有無だけ制御したいな……
script.jsの有無 : なし

style.css
フォント読み込み
style.css
/* ==== 'M PLUS 1p' - 通常フォント ==== */ /* ==== 'Ubuntu' - 英字デザインフォント ==== */ /* ==== 'M PLUS 1 Code' - 等幅フォント ==== */ /* ==== 'Zen Kurenaido' - 手書きフォント ==== */ @import url('https://fonts.googleapis.com/css2?family=M+PLUS+1+Code:wght@100..700&family=M+PLUS+1p:wght@100;300;400;500;700;800;900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&family=Zen+Kurenaido&display=swap'); /* ==== 'Font Awesome 6 Free' - アイコンフォント ==== */ @import url('https://use.fontawesome.com/releases/v6.5.2/css/all.css');
フォントを変更
style.css
* { font-family: 'M PLUS 1p'; } .fontawesome { font-family: 'Font Awesome 6 Free'; font-weight: 900; } code, code * { font-family: 'M PLUS 1 Code', monospace; font-weight: 400; } .line span:not(.deco-\.)>span>a.link:is([href$=".pdf"],[href^="https://github.com"],[href^="https://raw.githubusercontent.com"],[href^="https://gist.github.com"],[href^="https://ja.wikipedia.org"],[href^="https://en.wikipedia.org"],[href^="https://www.amazon.co.jp"],[href^="https://amazon.co.jp"],[href^="https://twitter.com"],):before { font-family: 'Font Awesome 6 Brands'; font-weight: 400; }
箇条書きの点を控えめに
style.css
.app .line .indent-mark .dot { height: .1em; width: .4em; border-radius: 20%; background-color: #8b8bb1; &::before { display: none; } } .app:not(.presentation) .line .indent-mark .dot { top: auto; bottom: 0; } .app:not(.presentation) .line.number-list .indent-mark .dot { background-color: #8b8bb180; }
リンクの見た目を変える
style.css
.page a.page-link:not(:has(>img.icon)) { display: inline-block; position: relative; text-decoration: none; &::before { content: ''; position: absolute; left: 0%; bottom: 7.5%; width: 100%; height: 2px; background-color: oklch(55% .2 270 / .4); transition: height 0.2s, background-color 0.2s; pointer-events: none; } &:hover::before { height: calc(100% - 6px); background-color: oklch(55% .2 270 / .2); } &.big-page-link { &::before { background-color: oklch(55% .2 315 / .4); } &:hover::before { background-color: oklch(55% .2 315 / .2); } } &.empty-page-link { &::before { background-color: oklch(55% .2 0 / .4); } &:hover::before { background-color: oklch(55% .2 0 / .2); } } } .line a.big-page-link { font-weight: inherit; }
久々に見てみたら、知らない機能がいくつか使われてたtakker
oklch()とかできたんだ
Oklch色空間とかあるんだ
知らないうちに対応している色空間がめっちゃ増えてる
oklch、かなり使いやすいのでおすすめ綾坂こと
表が含まれるページで横スクロールを有効化する(自作)
style.css
.page:has(.table-block-row) { overflow-y: hidden; overflow-x: scroll; } .page:has(.table-block-row)::-webkit-scrollbar { display: none; }
[/icons/hr.icon] , [/icons/---.icon] を横幅いっぱいに表示する(自作)
style.css
a:has(img.icon:is([title="hr"], [title="---"])) { position: relative; width: 100%; } a:has(img.icon:is([title="hr"], [title="---"]))::before { display: none; } img.icon:is([title="hr"], [title="---"]) { width: 100%; object-fit: cover; }
BudouXを適用して改行位置を自然にする
style.css
.lines { word-break: auto-phrase; }
1文字ずつspanで囲まれてても意味あるのかな?bsahd
されてない気がする()綾坂こと
曇りガラス記法(これ)をぼかしから塗りつぶしに変える
style.css
.line:not(.cursor-line) .deco-\~:not(:hover) { filter: inherit; } .line:not(.cursor-line) .deco-\~ { background-color: currentcolor; &:not(:hover) * { color: inherit; } &:hover { background-color: revert; } }
引用行が連続するときに2行目以降を消す
style.css
.line.quote-line+.line.quote-line .dot { opacity: 0; }