Migdal

元記事: 質問スレッド

たたむ
 
niftg profile image
にふ

埋め込み画像のリサイズがしたいのですが、<img src="https://….svg" style="width:1em;">などとしても、ここでは上手く縮小されないみたいです(gistでは成功)。他に何か良い方法がありますか?

たたむ
 
niftg profile image
にふ • 編集済

ここのだと、img要素を自動でa要素(.article-body-image-wrapper)でラップして、元画像へのリンクを貼ってくれるみたいですが、その際にsrc(ともしかするとalt?)以外の属性が諸々引き剥がされるぽいですね…うーん

たたむ
 
niftg profile image
にふ

いや、単純に、生のHTMLは基本的にガッツリサニタイズされるものてことですかね

スレッド スレッド
 
a_i profile image
A.I.

現在許可されているタグと属性はここに書かれているものだけじゃないかと思います。
gitlab.com/yheuhtozr/forem/blob/fo...
(タグ名はまた状況によってさらに制約されているようですが、何がどこに適用されるのかよくわかっていません)

制限を緩めることは可能ですが、styleを一律許可というのは少し広すぎるような気がします。どういった用途に使う想定でしょうか?

スレッド スレッド
 
niftg profile image
にふ

今のところ想定にあるのは、フォントを用意するほどでもない外字や絵文字をテキストに埋め込んだり、あとは「はじめての○○」形式のキャラクターアイコンを埋め込んだりする際に、地の文の文字サイズに比して極度に大きすぎたり小さすぎたりしない様に設定する、といった程度ですね

スレッド スレッド
 
niftg profile image
にふ

これもLiquidタグ化した方がいい話なのかもしれませんが、少し大掛かり過ぎる気もしますね…

スレッド スレッド
 
a_i profile image
A.I.

なるほど、ありがとうございます。両方とも用途がはっきりしたものだと思いますので、Liquidタグにするには都合がいいのではないかと思います。

  • インライン埋め込み画像用タグ
  • 画像つき吹き出しセリフ用タグ(こういうの

としてテンプレート化するのではどうでしょうか

スレッド スレッド
 
niftg profile image
にふ

インライン画像の方はデザインの遊ぶ余地が無いのですぐ行ける感じですね。
画像つき吹き出しの方はデザインの細部に個々人の拘りが発生する気がするので、実装のスピードは遅くて良い気がします。(丸アイコンと四角アイコンは選ばせてほしい等々)

スレッド スレッド
 
niftg profile image
にふ

でもまあ、吹き出しの件、デフォルトのバニラ味のデザインだけ先に実装してみて、オプションは徐々に拡充していく方式でも良いかもしれませんね。そこは開発者にお任せします。

スレッド スレッド
 
a_i profile image
A.I.
[A.I.]
A.I.
とりあえず機能は実装しました。
スレッド スレッド
 
niftg profile image
にふ

有難うございます!!少し色々試してみますね

非表示にされているコメントがあります(詳細