From 8ad33626933c4ab0b29398bac0de982a7d38ff96 Mon Sep 17 00:00:00 2001 From: Max Pozdeev Date: Tue, 20 Apr 2021 17:37:17 +0300 Subject: [PATCH] polish css structures --- src/content/themes/default/index.php | 6 +- src/content/themes/default/style.css | 98 ++++++++++++++++++---------- src/settings.php | 2 +- 3 files changed, 68 insertions(+), 38 deletions(-) diff --git a/src/content/themes/default/index.php b/src/content/themes/default/index.php index a600337..259a7a1 100644 --- a/src/content/themes/default/index.php +++ b/src/content/themes/default/index.php @@ -120,7 +120,7 @@ $().ready(function(){ -

+

(0) / @@ -136,8 +136,8 @@ $().ready(function(){
-

-

+

+

( — )
diff --git a/src/content/themes/default/style.css b/src/content/themes/default/style.css index 0a41b66..31ea543 100644 --- a/src/content/themes/default/style.css +++ b/src/content/themes/default/style.css @@ -14,9 +14,8 @@ body { margin:0px; padding:0px; height:100%; background-color:#fff; font-family td, th, input, textarea, select { font-family:"Helvetica Neue",helvetica,arial,sans-serif; font-size:1rem; } form { display: inline; } -h2,h3 { margin:0; } -h2 { font-size:1.5rem; padding-right:10px; } -h3 { border-bottom:2px solid #B5D5FF; margin-bottom:10px; padding:0.6rem 0; font-size:1.1rem; } +.topblock h2 { margin:0; font-size:1.5rem; padding-right:10px; } +h3.page-title { margin:0; border-bottom:2px solid #B5D5FF; margin-bottom:10px; padding:0.6rem 0; font-size:1.1rem; } a { color:#0000ff; cursor:pointer; text-decoration:underline; } .topblock { display:flex; align-items:flex-start; margin-bottom:1rem; } @@ -164,9 +163,19 @@ li.task-expanded .task-toggle { transform:rotate(90deg); } /* #tasklist input[type="checkbox"] { vertical-align:-1px; } /* Chrome */ #tasklist { list-style-type: none; margin: 0; padding: 0;} -#tasklist li { padding:0px 2px; border-bottom:1px solid #DEDEDE; min-height:18px; margin-bottom:1px; background-color:#fff; } +#tasklist li.task-row { + padding:1px 2px; + border-bottom:1px solid #DEDEDE; + min-height:20px; + background-color:#fff; + position:relative; /* for z-index */ +} +#tasklist li.task-row:hover, +#tasklist li.task-row.menu-active { + background-color:#f6f6f6; + /* box-shadow:1px 0 2px rgba(0,0,0,0.2), -1px 0 2px rgba(0,0,0,0.2); z-index: 1; */ +} #tasklist .task-container { display:flex; justify-content:flex-start; align-items:baseline; } -#tasklist li:hover, #tasklist li.menu-active { background-color:#f6f6f6; } .task-left { display:inline-block; } .task-middle { flex-grow:1; margin:0.6rem 0px; margin-left:5px; min-width:0; /*for long text*/ flex-basis:0; /* IE11 */} .task-middle-top { display:flex; align-items:baseline; } @@ -179,26 +188,24 @@ li.task-expanded .task-toggle { transform:rotate(90deg); } .show-inline-date li.task-completed .task-date-completed { display:inline; } .show-inline-date li.task-completed .task-date { display:none; } .task-through { overflow:hidden; flex-grow:1; } -.task-through-right { } .task-title a { color:#000000; } .task-title a:hover { color:#af0000; } -#mtt_body.readonly #tasklist li .task-actions { display:none; } +#mtt_body.readonly #tasklist li.task-row .task-actions { display:none; } .task-listname { background-color:#eee; color:#555; padding:0px 3px; } .task-tags { padding:0px 2px; } .task-tags .tag { font-size:0.9rem; font-weight:bold; color:#333333; text-decoration:underline; } -.task-tags .tag:hover { } .duedate { color:#333333; padding:0px; padding-left:1px; margin-left:5px; white-space:nowrap; } .duedate:before { content:'\2192\20'; } li.task-completed .duedate { /*font-size:0.8rem;*/ display:none; } -#tasklist li.soon .duedate { color:#008000; } -#tasklist li.today .duedate { color:#FF0000; } -#tasklist li.past .duedate { color:#A52A2A; } +#tasklist li.task-row.soon .duedate { color:#008000; } +#tasklist li.task-row.today .duedate { color:#FF0000; } +#tasklist li.task-row.past .duedate { color:#A52A2A; } li.task-completed .task-middle { color:#777777;} li.task-completed .task-through { text-decoration:line-through; } li.task-completed .task-title a { color:#777777; } #tasklist li.task-completed { opacity:0.6; } #tasklist li.task-completed:hover { opacity:1.0; } -#tasklist li.not-in-tagpreview { opacity:0.1; } +#tasklist li.task-row.not-in-tagpreview { opacity:0.1; } #tasklist .mtt-task-placeholder { min-height:0px; padding:0px; height:18px; line-height:18px; background-color:#ddd; border:1px solid #aaa; @@ -208,16 +215,39 @@ li.task-completed .task-title a { color:#777777; } .taskactionbtn { height:1rem; width:1rem; background:url(images/task-menu2.svg) center no-repeat; background-size:1rem; visibility:hidden; /* allocate space */ opacity:0.45; transition:opacity .1s ease-in; } .taskactionbtn::after { content:'0'; color:transparent; } /* for baseline */ -li:hover .taskactionbtn { visibility:visible; } +li.task-row:hover .taskactionbtn { visibility:visible; } .taskactionbtn:hover, .taskactionbtn.mtt-menu-button-active { opacity:0.7; cursor:pointer; visibility:visible; } -#tasklist.filter-past li, #tasklist.filter-today li, #tasklist.filter-soon li { display:none; } -#tasklist.filter-past li.past, #tasklist.filter-today li.today, #tasklist.filter-soon li.soon { display:block; } -#tasklist.filter-past li.task-completed, #tasklist.filter-today li.task-completed, #tasklist.filter-soon li.task-completed { display:none; } +#tasklist.filter-past li.task-row, +#tasklist.filter-today li.task-row, +#tasklist.filter-soon li.task-row { + display:none; +} +#tasklist.filter-past li.task-row.past, +#tasklist.filter-today li.task-row.today, +#tasklist.filter-soon li.task-row.soon { + display:block; +} +#tasklist.filter-past li.task-completed, +#tasklist.filter-today li.task-completed, +#tasklist.filter-soon li.task-completed { + display:none; +} -.task-note-block { margin-left:2px; color:#777777; background:url(images/note.svg) left 0px no-repeat; background-size:16px 16px; - padding-left:19px; min-height:16px; margin-top:6px; display:none; white-space:normal; word-wrap:break-word; } +.task-note-block { + margin-left:2px; + color:#444; + background:url(images/note.svg) left 0px no-repeat; + background-size:16px 16px; + padding-left:19px; + min-height:16px; + margin-top:6px; + display:none; + white-space:normal; + word-wrap:break-word; +} li.task-expanded .task-note-block { display:block; } +/*li.task-expanded { box-shadow:1px 0 2px rgba(0,0,0,0.2), -1px 0 2px rgba(0,0,0,0.2); }*/ li.task-completed .task-note-block .task-note { text-decoration:line-through; } .task-note-area { display:none; margin-bottom:5px; } .task-note-area textarea { color:#999999; width:100%; display:block; height:65px; } @@ -244,7 +274,7 @@ li.task-completed .task-note-block .task-note { text-decoration:line-through; } #page_taskedit select.form-input { padding:2px; } #page_taskedit .form-bottom-buttons input { padding:4px; border:1px solid #ccc; border-radius:3px; background-color:#efefef; margin:2px; } #page_taskedit .form-row .in500 { width:100%; box-sizing:border-box; } -#page_taskedit .form-row textarea.in500 { height:200px; /*resize:none;*/ } +#page_taskedit .form-row textarea.in500 { height:300px; font-family: monospace; } #page_taskedit .form-row-short { float:left; margin-right:12px; } #page_taskedit .form-bottom-buttons { text-align:center; margin-top:1rem; } #alltags .tag { font-weight:bold; color:#333333; } @@ -346,9 +376,10 @@ a.mtt-back-button { font-size:1rem; } position:relative; overflow:hidden; text-overflow:ellipsis; } -.mtt-menu-container li:hover, .mtt-menu-container li.mtt-menu-item-active { +.mtt-menu-container li:hover, +.mtt-menu-container li.mtt-menu-item-active { background-color:#5a8df0; color:white; - } +} .mtt-menu-container li.mtt-item-disabled, .mtt-menu-container li.mtt-item-disabled a { color:#ACA899; } .mtt-menu-container a { display:block; @@ -392,7 +423,7 @@ li.mtt-item-hidden { display:none; } /* font for small screens */ -@media only screen and (max-width: 600px), only screen and (max-height: 600px) { +@media only screen and (max-width: 600px), only screen and (max-height: 600px) { html { font-size: 16px; -webkit-text-size-adjust: 100%; /* Dont increase font-size in horizontal orientation on ios */ @@ -424,22 +455,21 @@ li.mtt-item-hidden { display:none; } #toolbar.mtt-insearch .searchbox-c { width:100%; max-width:100%; } #search { padding:5px 20px; border-radius:15px; } - #tasklist li { padding:0px 3px; } - .task-actions { display:none; } + #tasklist li.task-row { padding:0px 3px; } + .task-actions { display:none; } .task-date { display:none; } .task-note-actions { display:block; padding-top:8px; } - .task-note-block { margin-left:0px; border-left:1px solid #777777; background:none; padding-left:4px; display:none; } - body[dir="rtl"] .task-note-block { border-left:none; border-right:1px solid #777777; padding-left:0; padding-right:4px; } + .task-note-block { margin-left:0px; background:none; display:none; padding-left:0px; padding-right:0px; border-top:1px solid #f0f0f0; } .task-note-area textarea { width:95%; } - #tasklist li .task-through { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } - #tasklist li:hover { background-color:#ffffff; } + #tasklist li.task-row .task-through { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } + #tasklist li.task-row:hover { background-color:#ffffff; } #tasklist li.task-expanded .task-note-block { display:none; } - #tasklist li.clicked { background-color:#f6f6f6; } - #tasklist li.clicked .task-actions { display:block; } - #tasklist li.clicked .task-through { white-space:normal; display:inline; } - #tasklist li.clicked.task-has-note .task-note-block { display:block; } - #tasklist li.clicked.doubleclicked.task-has-note .task-note-block { display:none; } + #tasklist li.task-row.clicked { /*background-color:#f6f6f6;*/ box-shadow:1px 0 2px rgba(0,0,0,0.2), -1px 0 2px rgba(0,0,0,0.2); z-index: 1; } + #tasklist li.task-row.clicked .task-actions { display:block; } + #tasklist li.task-row.clicked .task-through { white-space:normal; display:inline; } + #tasklist li.task-row.clicked.task-has-note .task-note-block { display:block; } + /*#tasklist li.task-row.clicked.doubleclicked.task-has-note .task-note-block { display:none; }*/ .task-toggle { display:none; } #tasklist .mtt-task-placeholder { line-height:1rem; padding-top:0.6rem; padding-bottom:0.6rem; } #tasklist .ui-sortable-helper { box-shadow:0px 0px 3px #333; } @@ -455,6 +485,6 @@ li.mtt-item-hidden { display:none; } .mtt-settings-table .in350 { min-width:50px; } .mtt-notes-showhide { display:none; } - .mtt-menu-container li { padding-top:0.3rem; padding-bottom:0.3rem; } + .mtt-menu-container li { padding-top:0.3rem; padding-bottom:0.3rem; } } /* end of @media min 600px */ diff --git a/src/settings.php b/src/settings.php index 761f50c..006615a 100644 --- a/src/settings.php +++ b/src/settings.php @@ -175,7 +175,7 @@ header('Content-type:text/html; charset=utf-8');
-

+