31 lines
2.1 KiB
HTML
31 lines
2.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ja">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>FB Tool Test</title>
|
|
<style>
|
|
body { font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif; max-width: 800px; margin: 40px auto; padding: 0 20px; line-height: 1.8; color: #333; }
|
|
h1 { border-bottom: 2px solid #e5e5e5; padding-bottom: 8px; }
|
|
h2 { color: #555; margin-top: 32px; }
|
|
p { color: #555; margin: 12px 0; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>FBツール テストページ</h1>
|
|
<p>このページはFBツールの動作確認用です。テキストを選択してコメントを追加できます。</p>
|
|
|
|
<h2>サンプルテキスト</h2>
|
|
<p>AI-Driven Schoolは、AI時代に最適化した企画スキルと開発スキルを実践的に学ぶ6ヶ月間のオンラインプログラムです。講義設計・運営ドキュメント・CS・マーケティング・ツール開発をこのリポジトリで管理しています。</p>
|
|
<p>受講生はチームワークを通じて、実践的なプロジェクトに取り組みます。フィードバックは成長の鍵であり、適切なタイミングで的確なコメントを届けることが重要です。</p>
|
|
<p>カリキュラムは全12回で構成され、毎月のテーマに沿って段階的にスキルを積み上げていきます。各回の講義では座学とワークを組み合わせ、すぐに使える知識と経験を提供します。</p>
|
|
|
|
<h2>フォーカス連動テスト</h2>
|
|
<p>サイドバーのカードをクリックすると、対応するハイライト箇所にスクロールします。逆に、本文のハイライトをクリックするとサイドバーのカードにスクロールします。カードにホバーするとハイライトがパルスで点滅します。</p>
|
|
|
|
<h2>リサイズテスト</h2>
|
|
<p>サイドバーの左端にマウスを当てるとカーソルが左右矢印に変わります。ドラッグで幅を変更でき、300pxから800pxの範囲で調整可能です。変更した幅はページをリロードしても維持されます。</p>
|
|
|
|
<script src="/widget.js"></script>
|
|
</body>
|
|
</html>
|