タグ

2023年8月28日のブックマーク (2件)

  • CSSで角丸を美しく実装するテクニック、ネストされた外側と内側を相対角丸の美しいバランスで実装

    カードやパネルの外側と内側に角丸を使用したときに、なんだかバランスが悪いなと思ったことはありませんか? 角丸を二重にするときに外側の角丸と内側の角丸の値を同じに設定すると、内側の方がすこし大きく見えて、不格好になってしまいます。 外側の角丸と内側の角丸を美しいバランスで実装する相対角丸のテクニックを紹介します。 まずは、ネストされた角丸を美しいバランスで実装したデモをご覧ください。 See the Pen Inner Radius Design Tip with CSS Custom Properties by coliss (@coliss) on CodePen. 外側の角丸と内側の角丸を美しいバランスで実装するポイントは、「外側の半径 = 内側の半径 + パディング」に設定することです。こうすることで、外側の角丸と内側の角丸の中心点が同じになり、美しいバランスになります。 ちなみに、

    CSSで角丸を美しく実装するテクニック、ネストされた外側と内側を相対角丸の美しいバランスで実装
  • ChatGPTで業務フローが自動的に書けた|Yuji Inagaki

    こんにちは。ユアマイスターでプロダクトマネージャーをしています、稲垣といいます。 最近、業務でChatGPTを使いまくっているのですが、ちょっと個人的に感動する使い方を見つけたので紹介します(既に知ってるぞ!という方、すいません)。 プロダクト開発において、業務フローって必要になること多いですよね。でも書くの大変。Draw.ioとかFigmaとか便利なツールも出てるけど、それでも大変。 さあ、下記のようにプロンプトを書いてみましょう。 一般的な受注業務の業務フロー図を作りたいです。Mermaid Markdown形式で出力してください。 # 制約条件 - 「・」「?」は使用しないでください ChatGPTの出力結果のこれをコピーして、 Notionに貼りましょう(「コードブロック」を選択してください)。 「コード」を選ぶこの領域にペーストするすると・・・。 うおおおおお。 業務フローが自動

    ChatGPTで業務フローが自動的に書けた|Yuji Inagaki