備忘錄 待辦事項 便利貼．forms

<!--
boxed 版型: 新增內容方式是「把增加的內容區塊元素（<section>）包裏在一個固定的寬度（<main>）中」。
-->
<header>...</header>
<main>
  <section class="note">（表單編輯區）</section>
  <section class="space">（項目瀏覽區）</section>
</main>
<footer>...<footer>

:root{
  /* 設定灰階色: 黑、灰、白 */
  --black-100: black;
  --black-90: #1E1E1E;
  --black-80: #353535;
  --black-70: #4E4E4E;
  --black-60: #696969;
  --black-50: #858585;
  --black-40: #A2A2A2;
  --black-30: #C0C0C0;
  --black-20: #DFDFDF;
  --black-10: #F6F6F6;
  --white-100: white;
  …
}
…
body{
  /*套用灰階色*/
  background: var(--black-20);
}
…
main{
  …
  /* 設定藍色系: 藍、深藍、淺藍 */
  --primary-default: #02A0E9;
  --primary-dark: #181677;
  --primary-tint: #C3E0F2;  
}
…
.space{
  /*套用淺藍色*/
  background: var(--primary-tint);
  …
}
…