#ToDo 関連のメモ ( #sorashima )

「物の状態が最終的にこうなっていたら良いな一覧と、その為の手順を書き込む」アプリを使う上でのメモなど。(内容が古いまま、間違ったままもあるので注意。)広告が自動で挿入される無料版ブログサービスを利用しているので、PVが増えても一銭の得にもなりませぬ

[ 記事一覧へ ]

#WorkFlowy をよりTask管理アプリらしくしてみる

もっぱらタスク管理のみに利用しているWorkFlowy。
タスク管理アプリらしくなるように更にCSSを弄ってみた。

変更点

  • TaskPaperの様にプロジェクトはボールド、タスクはノーマルの文字に(ボールド/イタリック/アンダーラインはiPhoneから指定するのは面倒くさいので使わない前提で)
  • 期日以外のタグにもバックグラウンドカラーを付けるとうるさくなるので、青文字にするだけにとどめた
  • タスク管理アプリらしくチェックボックス表示にした
  • Completeマークを付けたプロジェクトに未完了のサブプロジェクトやタスクがあった場合、それら未完了項目を赤文字にして目立たせ、実行し忘れを防ぐようにした
#header{
    background:#FFFFF0 !important; /* ヘッダーの背景色は仄かにアイボリー */
}

#documentView{
    background:#FFFFF0 !important;
}

.page{
    color:#333;
    background:#FFFFF0;
    border-radius:5px;
}

/* リンクは青色 */
a.contentLink{
    color:blue !important;
}

/* プロジェクトは太字 */
.project > .name .content{
    font-weight: bold !important;
}

/* タスクは通常の太さ */
.project.task > .name .content{
    font-weight: normal !important;
}

/* 完了したプロジェクトの中のプロジェクトやタスクはとりあえず全て赤字 */
.project.done .project > .name .content{
    color:red !important;
}

/* 完了したプロジェクトの中の完了したプロジェクトやタスクのみ灰色 */
.project.done .project.done > .name .content{
    color:gray !important;
}

/* ブレットのドットを消す */
.bullet{
    background-image:none;
}

/* とりあえず全てのプロジェクト/タスクはブレットの代わりにボックス */
.project > .name > .bullet:after{
    content: "◻️";
    font-weight: bold !important;
}

/* 完了したプロジェクト/タスクのみブレットの代わりにチェック */
.project.done > .name > .bullet:after{
    content: "✅️";
    font-weight: bold !important;
}

/* ノートは暗い青色で全行表示する */
.noted > .notes > .content {
    color:navy !important;
    background-color:#DDD !important;
    height:auto !important;
    min-height:20px !important;
    overflow:visible !important;
    line-height:20px !important;
    display:block !important;
    -webkit-box-orient:inherit !important;
    -webkit-line-clamp:inherit !important;
    white-space:pre !important;
}

/* パン屑リストは紫 */
.parent>.name>.content{
    color:fuchsia;
}

.highlighted>.highlight{
    background:silver;
}

.moving>.highlight{
    background:gray;
}

.corner,.edge{
    display:none;
}

/* タグは基本的に青 */
.contentTag{
    color:blue !important;
}

/* 年内タグの背景色は緑 */
.contentTag[title="Filter @y"] {
    color:black !important;
    background-color:lime !important;
}

/* 月内タグの背景色は黄色 */
.contentTag[title="Filter @y-m"] {
    color:black !important;
    background-color:yellow !important;
}

/* 週内タグの背景色はオレンジ */
.contentTag[title="Filter @y-m-w"] {
    color:black !important;
    background-color:#FF8556 !important;
}

/* 日内タグの背景色は赤 */
.contentTag[title="Filter @y-m-w-d"] {
    color:black !important;
    background-color:#FF82B2 !important;
}

「✅」/「◻」️では少し野暮ったいかなと、「」/「」で font-style: italic !important; に変えてみたが、視認性を優先して戻した。

広告を非表示にする