1 files changed, 306 insertions, 0 deletions
diff --git a/ui/style.css b/ui/style.css
new file mode 100644
index 0000000..18ae794
--- /dev/null
+++ b/ui/style.css
@@ -0,0 +1,306 @@
+@import url("DejaVu_Sans_ExtraLight/stylesheet.css");
+* {
+	font-family: sans-serif;
+}
+html, body {
+	padding: 0px;
+	margin: 0px;
+}
+body {
+	background: white;
+	font-size: 12pt;
+}
+
+input[type="text"], input[type="password"] {
+	background: #fff;
+	border: 1px solid #666;
+	font-size: 12pt;
+	padding: 0.5ex 0ex 0.5ex;
+}
+input[type="text"]:hover, input[type="password"]:hover {
+	border-color: #000;
+}
+button, .fakebutton {
+	background: #eee;
+	border: 1px solid #ccc;
+	font-size: 12pt;
+	padding: 0.5ex 0ex 0.5ex;
+	cursor: pointer;
+}
+button:hover, .fakebutton:hover {
+	background-color: #ccc !important;
+}
+a.fakebutton {
+	color: black;
+	text-decoration: none;
+	display: inline-block;
+}
+
+#headerwrap {
+	position: fixed;
+	top: 0px;
+	width: 100%;
+	background: #aaa;
+	color: #eee;
+	margin: 0px;
+	z-index: 1000;
+}
+
+#header {
+	margin: 0px 7mm 0px;
+}
+
+#header a {
+	display: inline-block;
+	color: #eee;
+	text-decoration: none;
+	border-bottom: 3px solid #bbb;
+	height: 100%;
+	vertical-align: middle;
+	padding: 0.5ex 0ex 0.5ex;
+}
+#header a:hover {
+	color: #fff;
+	border-bottom-color: #55c5ff !important;
+}
+
+#userinfo {
+	position: absolute;
+	right: 7mm;
+}
+.username {
+	color: white;
+}
+
+.bghelp {
+	z-index: -1;
+	background: #eee;
+	position: fixed;
+	margin: 0;
+	padding: 0;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	width: 60mm;
+}
+
+#lists {
+	position: absolute;
+	left: 0;
+	top: 0;
+	width: 60mm;
+	z-index: 1;
+	padding: 0mm;
+	background: #eee;
+}
+
+#lists ul {
+	list-style: none;
+	margin: 3.5ex 0mm 3em;
+	padding: 0px;
+}
+
+#lists ul li {
+	position: relative;
+	margin: 0;
+	padding: 0.5ex 3ex 0.5ex 1ex;
+}
+#lists ul li:hover {
+	background: #f8f8f8;
+}
+#lists ul li.active {
+	background: #fff;
+}
+#lists a {
+	color: #555;
+	text-decoration: none;
+}
+#lists a:hover {
+	color: black;
+}
+.listlink {
+	display: block;
+}
+
+
+.deletelist {
+	display: inline-block;
+	margin:0;
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	right: 0;
+	width: 3ex;
+	border-left: 1px dotted #555;
+	text-align: center;
+	padding: 0.5ex 0ex 0.5ex 0ex;
+}
+
+.deletelist:hover {
+	background: #ccc;
+}
+
+#addlist {
+	position: fixed;
+	bottom: 0px;
+	width: 58mm;
+	background: #ddd;
+	padding: 1mm;
+	vertical-align: middle;
+}
+#addlist button {
+	position: absolute;
+	right: 1mm;
+	width: 7mm;
+	margin: 0mm;
+}
+#addlist input {
+	width: 100%;
+	margin: 0mm;
+	width: 50mm;
+}
+
+#content {
+	padding: 4ex 2mm 2mm 63mm;
+}
+
+h1 {
+	font-family: "DejaVu Sans ExtraLight", sans-serif;
+	font-weight: bold;
+	font-size: 16pt;
+}
+
+h1 input.listname {
+	border: 1px solid #ccc;
+	font-size: 16pt;
+	margin: 0;
+	font-family: "DejaVu Sans ExtraLight", sans-serif;
+	font-weight: bold;
+}
+h1 input.listname:hover, h1 input.listname:focus {
+	border: 1px solid black;
+}
+h1 button {
+	background-color: #f7f7f7;
+	color: #ddd;
+	border: 1px solid #ddd;
+}
+h1:hover button {
+	background: #eee;
+	border: 1px solid #ccc;
+	color: black;
+}
+
+ul.todolist {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+}
+ul.todolist li {
+	margin: 0;
+	position: relative;
+	padding: 0.6ex 0 0.6ex;
+	border-top: 1px solid #f7f7f7;
+	min-height: 34px
+}
+ul.todolist li:first-child {
+	border-top: none;
+}
+ul.todolist form {
+	display: inline;
+}
+li.checked span.txt {
+	font-style: italic;
+	color: gray;
+	text-decoration: line-through;
+	vertical-align: middle;
+}
+ul.todolist span.btncluster {
+	vertical-align: middle;
+	position: absolute;
+	right: 0;
+}
+ul.todolist span.btncluster button {
+	background: #fbfbfb;
+	border: 1px solid #f2f2f2;
+	color: #bbb;
+}
+ul.todolist li:hover span.btncluster button {
+	background: #eee;
+	border: 1px solid #ccc;
+	color: black;
+}
+
+.chkbtn {
+	padding: 0;
+	cursor: pointer;
+	width: 20px;
+	height: 20px;
+	vertical-align: middle;
+}
+.chkbtn.checked {
+	background-image: url(img/sprites.png);
+}
+.chkbtn input {
+	display: none;
+}
+
+.notify {
+	margin: -100px auto 1mm;
+	width: 50%;
+	text-align: center;
+	color: white;
+	padding: 100px 5px 5px 35px;
+	position: relative;
+}
+
+.notify .icon {
+	display: block;
+	width: 20px;
+	height: 100%;
+	position: absolute;
+	left: 5px;
+	top: 45px;
+	background-size: 80px 20px;
+	background-repeat: no-repeat;
+	background-image: url(img/sprites.png);
+}
+
+.success {background: #2a0;}
+.success .icon {background-position: left -20px top 50%;}
+.info {background: #48f;}
+.info .icon {background-position: left -40px top 50%;}
+.error {background: #f40;}
+.error .icon {background-position: left -60px top 50%;}
+
+.delchecked {
+	text-align: right;
+}
+
+.empty {
+	font-style: italic;
+	margin: 2mm;
+}
+.nolist {
+	font-style: italic;
+	font-size: 18pt;
+	color: #999;
+	text-align: center;
+	position: absolute;
+	top: 40%;
+}
+
+form.tabform {
+	display: table;
+}
+form.tabform p {
+	display: table-row;
+}
+form.tabform input, form.tabform label {
+	display: table-cell;
+	margin: 1mm;
+}
+form.tabform p.formctrl {
+	display: block;
+	margin: 0;
+}