PHP Classes
elePHPant
Icontem

File: twzToDoList.css

Recommend this page to a friend!
  Classes of Tony  >  twz PHP To Do List Project  >  twzToDoList.css  >  Download  
File: twzToDoList.css
Role: Auxiliary data
Content type: text/plain
Description: CSS
Class: twz PHP To Do List Project
Manage to do tasks of project on a Web page
Author: By
Last change: tweaks
Date: 14 days ago
Size: 4,703 bytes
 

 

Contents

Class file image Download
/* twzToDoList.css */

body { margin:0; font-family:sans-serif; }

div#ident { float:right; color:#ccc; font-size:small; }
div#ident span {  } /* app name */

.panel { border:1px solid #aaa; background:#f8f8f8; padding:10px; width:95%; max-width:600px; margin:10px auto; overflow:hidden; position:relative; }
.panel.deleted { background:#fee; color:#888; }
.panel.message { text-align:center; }
.panel.message + .panel.message { margin-top:-11px; }
.panel.message.error { color:#c44; background:#fee; }
.panel.message.good { color:#4c4; background:#efe; }
.panel h2 { font-size:20px; margin:0; margin-bottom:10px; }
.panel h2:not(.projName) { color:#666; text-transform:uppercase; }

a.closebox { float:right; position:absolute; top:-1px; right:-1px; border:1px solid #aaa; text-decoration:none; padding:2px 5px; }
a.closebox:hover { background-color:#ccc; }

form label:not([for]) { float:left; width:120px; text-align:right; padding-right:5px; }
form label.short { width:100px; }
form input[type=text], form textarea { width:300px; }
form label.short + input[type=text], form label.short + textarea { width:350px; }

form div.buttons { margin:10px 0; }
button { padding:5px 20px; }
button,form input[type=submit] { margin:10px 10px 0 0; }

form input[type=submit] { float:right; font-weight:bold; padding:5px 30px; }
form input.num { width:20px !important; }
form input.datetime { width:130px !important; }
form input.date { width:75px !important; }
form input.chkAlone { margin-right:20px; }

span.filemtime { font-size:smaller; margin-left:10px; white-space:nowrap; color:#666; }
ul#tasklist { list-style:none; margin:0; margin-top:5px; padding:0; clear:both; }
ul#tasklist li { display:flex; justify-content:space-between; flex-wrap:wrap; }
ul#tasklist li input.title { flex-grow:2; }
ul#tasklist li input { border-width:1px; }

div.taskInfo { display:none; padding:10px; background-color:#fff; border:1px solid #ddd; margin-bottom:10px; }
div.taskInfo p { margin:0; }
span.TaskState { border:1px solid #aaa; border-radius:5px; padding:1px 2px; display:inline-block; min-width:45px; text-align:center; margin-left:2px; }
span.TaskState:hover { background-color:#ccc; }

p.taskComment { margin:3px 0; white-space:pre-line; font-size:smaller; line-height:1; }
p.mono { font-family:monospace; }

a.setnow { border:1px solid #888; border-radius:5px; text-decoration:none; padding:0px 5px; margin-left:10px; color:#000; font-size:smaller; }
a.setnow:hover { background-color:#ccc; }

hr.divider { height:1px; border:0; border-bottom:1px dotted #aaa; padding:7px 0; }

.fr { float:right; }
.cb { clear:both; }
ul.spaced li { margin:5px 0; }
ul.underline li { border-bottom:1px solid #888; padding-bottom:5px; }

p.error { color:#900; }
p.notice { font-weight:bold; font-size:larger; color:#855; border-left:8px solid #855; padding:3px 8px; }
h3.projstatus { font-weight:bold; border-bottom:1px solid #000; margin:0; margin-top:10px; }
p.projlist,p.presetlist { margin:0; padding:4px 0 0 0; }
p.projlist a,p.presetlist a { text-decoration:none; }
p.projlist a:hover,p.presetlist a:hover { text-decoration:underline; }

p.projlist span.DelInfo { font-size:small; color:#c88; white-space:nowrap; }
p.projlist span.DelInfo span {  }

h3.projstatus,p.projlist { border-left:5px solid #ddd; padding-left:10px; }


div#paging { overflow:hidden; margin-top:20px; }
div#paging a, div#paging span { float:left; padding:5px 10px; font-size:large; color:#888; border:1px solid transparent; }
div#paging a { text-decoration:none; }
div#paging a:hover { background-color:#ccc; }
div#paging span { border-color:#888; }

pre { background:#eee; border:1px solid #aaa; padding:10px; }

html body .status-new { color:#080; border-color:#080; }
html body .status-inprog { color:#009; border-color:#009; }
html body .status-due { color:#e60; border-color:#e60; }
html body .status-overdue { color:#d00; border-color:#d00; background-color:#fee; }
html body .status-urgent { color:#d00; border-color:#d00; }
html body .status-done { color:#777; border-color:#777; }
html body .status-closed { color:#aaa; border-color:#aaa; }
html body .status-deleted { color:#f00; border-color:#f00; }

span.progress { width:60px; height:12px; float:right; border:1px solid #aaa; position:relative;  }
span.progress .bar { background-color:#ccc; display:block; height:100%; }
span.progress .text { position:absolute; top:0px; left:2px; color:#222; font-size:10px; }

@media print{
.panel { border:0; background:#fff; max-width:100%;}
.noprint,div.buttons,button,input[type=submit],span.progress { display:none; }
span.TaskState { border:0; }
}