Skip to content
Browse files

First cut simplistic look-and-feel

  • Loading branch information...
1 parent 7cc3ed5 commit 235b02cea84ac8686b29855a36894f2ac1f68db8 @vmt committed
Showing with 267 additions and 119 deletions.
  1. +149 −10 task/templates/task/base.html
  2. +27 −24 task/templates/task/list.html
  3. +7 −9 task/templates/task/task_form.html
  4. +56 −22 task/templates/task/view.html
  5. +2 −0 task/views.py
  6. +26 −54 templates/base.html
View
159 task/templates/task/base.html
@@ -1,19 +1,158 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>Disarray</title>
- <style type="text/css"></style>
+ <title>disarray // {% block PageTitle %}{% endblock %}</title>
+ <link rel="stylesheet" href="{{ MEDIA_URL }}/css/disarray.css" />
+ {% block SiteStyle %}
+ <style type="text/css">
+ body {
+ font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
+ font-size:13px;
+ font-weight:normal;
+ line-height:18px;
+ font-size: 12px;
+ margin: 0; padding: 0;
+ }
+ a { text-decoration: none; }
+
+ div#container {
+ width: 650px;
+ margin: 20px 20px 10px 40px;
+ }
+
+ h1#heading {
+ display: inline;
+ font-size: 24px;
+ }
+
+ h1#heading a {
+ text-decoration: none;
+ font-weight: bold;
+ color: #333;
+ }
+
+ div#secondary-header {
+ margin: 20px 0 10px 0;
+ }
+
+ div#secondary-header h2 {
+ display: inline;
+ }
+
+ span#add-button a {
+ text-decoration: none;
+ font-weight: bold;
+ }
+ span#add-button {
+ float: right;
+ font-weight: bold;
+ }
+
+ ul#status-list {
+ list-style: none;
+ margin: 0; padding: 0;
+ }
+ ul#status-list li a {
+ margin-right: 10px;
+ text-decoration: none;
+ font-weight: bold;
+ color: skyblue;
+ }
+ #status-list li.selected a {
+ border-bottom: 2px solid blue;
+ color: blue;
+ }
+ .inline {
+ display: inline;
+ }
+
+ hr {
+ border: 0;
+ height: 2px;
+ margin: 10px 0 10px 0;
+ color: skyblue;
+ background-color: skyblue;
+ }
+
+ ul#task-list {
+ margin-top: 20px;
+ font-size: 15px;
+ }
+ div.task-id {
+ width: 50px;
+ color: #888;
+ float: left;
+ border: 1px solid blue;
+ }
+
+ ul.no-style {
+ list-style: none;
+ padding: 0; margin: 0;
+ }
+ ul.flat li {
+ display: inline;
+ }
+
+ ul.task-tags a {
+ color: skyblue;
+ }
+ ul.task-tags li {
+ padding: 5px;
+ }
+
+ ul.task-tags li.selected a {
+ border-bottom: 2px solid blue;
+ color: blue;
+ }
+
+ div.task-meta {
+ font-size: 11px;
+ font-weight: bold;
+ color: #888;
+ }
+
+ label { display: block; }
+ input#id_text,
+ input#id_title,
+ input#id_tags {
+ border: 2px inset #eee;
+ padding: 4px;
+ font-size: 13px;
+ }
+ textarea#id_text {
+ border: 2px inset #eee;
+ padding: 4px;
+ font-size: 13px;
+ width: 500px;
+ height: 300px;
+ }
+ input#id_title,
+ input#id_tags { width: 400px; }
+ .helptext {
+ display: block;
+ font-size: 11px;
+ color: #888;
+ }
+ input#submit {
+ }
+
+
+ </style>
+ {% endblock %}
+
+ <script>
+ {% block SiteScript %}{% endblock %}
+ </script>
</head>
<body>
<div id="container">
- <div id="header">
- <h1 id="heading">
- <a href="{% url task:main %}">Disarray</a>
- </h1>
- <span id="add-button">
- <a href="{% url task:add %}" title="Add new task">+</a>
- </span>
- </div>
+ <div id="secondary-header">
+ <h2><a href="{% url task:main %}">disarray</a> // {% block PageHeading %}{% endblock %}</h2>
+ <span id="add-button"><a href="{% url task:add %}">Add Task</a></span>
+ </div>
{% block Content %}
{% endblock %}
</div> <!-- /container -->
View
51 task/templates/task/list.html
@@ -1,33 +1,36 @@
{% extends "task/base.html" %}
+{% block PageHeading %}tasks{% endblock %}
+
{% block Content %}
-
- <h1>Tasks</h1>
- <ul id="status-list">
- {% for status in statuses %}
- <li><a href="{{ status.url }}">{{ status.label }}</a></li>
- {% endfor %}
- </ul>
+<hr size="1" />
+
+<div class="float-left">
+ <ul id="status-list" class="inline">
+ {% for status in statuses %}
+ <li class="inline {% if status.selected %}selected{% endif %}">
+ <a href="{{ status.url }}">{{ status.label }}</a></li>
+ </li>
+ {% endfor %}
+ </ul>
+</div>
- <ul id="tags-list">
- {% for tag in tags %}
- <li><a href="{{ tag.url }}">{{ tag.label }}</a></li>
- {% endfor %}
- </ul>
- <ul class="task-list">
- {% for task in tasks %}
- <li>
- <span class="task-id">[{{ task.id }}]</span>
- <span class="task-title"><a href="{% url task:view task.id %}">{{ task.title }}</a></span>
- <span class="task-tags">
- {% for tag in task.tags %}
- <span class="task-tag {% if tag.selected %}selected{% endif %}"><a href="{{ tag.url }}">{{ tag.label }}</a></span>
- {% endfor %}
- </span>
- </li>
+<ul id="task-list" class="no-style">
+ {% for task in tasks %}
+ <li>
+ <span class="task-title"><a href="{% url task:view task.id %}">{{ task.title }}</a></span>
+ <div class="task-meta">
+ {{ task.id }} //
+ <ul class="no-style inline flat task-tags">
+ {% for tag in task.tags %}
+ <li class="{% if tag.selected %}selected{% endif %}"><a href="{{ tag.url }}">{{ tag.label }}</a></span>
{% endfor %}
- </ul>
+ </ul>
+ </div> <!-- /task-meta -->
+ </li>
+ {% endfor %}
+</ul>
{% endblock %}
View
16 task/templates/task/task_form.html
@@ -1,16 +1,14 @@
{% extends "task/base.html" %}
+{% block PageHeading %}
+ {% if task %}edit task {{ task.id }}{% else %}add task{% endif %}
+{% endblock %}
+
{% block Content %}
- <h1 class="action-heading">
- {% if node %}
- Edit // {{ node.id }}
- {% else %}
- Add
- {% endif %}
- </h1>
+ <hr size="1" />
- {% if node %}
+ {% if task %}
<form method="post" action="{% url task:edit taskid=task.id %}">
{% else %}
<form method="post" action="{% url task:add %}">
@@ -20,7 +18,7 @@ <h1 class="action-heading">
{{ form.errors }}
{% endif %}
{{ form.as_p }}
- <input type="submit" value="Save"/>
+ <input id="submit" type="submit" value="Save"/>
{% if task %}
<a href="{% url task:remove task.id %}">Delete</a>
{% endif %}
View
78 task/templates/task/view.html
@@ -1,38 +1,72 @@
{% extends "task/base.html" %}
-{% block Content %}
+{% block SiteStyle %}
+ {{ block.super }}
+ <style type="text/css">
+ div.task-view .title {
+ font-size: 15px; font-weight: bold;
+ }
+ div.task-view .meta {
+ font-size: 12px; color: #444;
+ }
+ div.task-view .text {
+ margin: 10px 0 10px 0;
+ font-size: 13px; font-family: monospace;
+ }
+ div.task-view hr {
+ height: 1px;
+ }
- {{ block.super }}
+ div.task-view #id_text {
+ width: 100%;
+ height: 150px
+ }
+ </style>
+{% endblock %}
- <div class="task-view">
- <div class="title">{{ task.title }}</div>
- {% if task.text %}
- <div class="text">
- {{ task.text }}
- </div>
- {% endif %}
- <div class="meta">
- Viewed: {{ task.views }}
- <a href="{% url task:edit task.id %}">Edit</a>
- </div>
+{% block PageHeading %}task {{ task.id }}{% endblock %}
- <form action="{% url task:view task.id %}" method="post">
- {% csrf_token %}
- {% if update_form.errors %}
- {{ update_form.errors }}
- {% endif %}
- {{ update_form.as_p }}
- <input type="submit" value="Post"/>
- </form>
+{% block Content %}
+
+ <hr size="1" />
+
+ <div class="task-view">
+ <div class="title">{{ task.title }}</div>
+ {% if task.text %}
+ <div class="text">
+ {{ task.text }}
+ </div>
+ {% endif %}
+ <div class="meta">
+ {{ task.status }} // viewed: {{ task.views }} // <a href="{% url task:edit task.id %}">edit</a>
+ </div>
+ {% if updates %}
+ <hr size="1" />
{% for update in updates %}
<div class="update">
+ <div class="meta">
+ {{ update.createdon }}
+ </div>
<div class="text">
{{ update.text }}
</div>
</div>
{% endfor %}
+ {% endif %}
+
+ <hr />
+ <form action="{% url task:view task.id %}" method="post">
+ <h3>Update</h3>
+ {% csrf_token %}
+ {% if update_form.errors %}
+ {{ update_form.errors }}
+ {% endif %}
+ {{ update_form.as_p }}
+ <input type="submit" value="Post"/>
+ </form>
- </div>
+
+ </div>
{% endblock %}
View
2 task/views.py
@@ -42,6 +42,7 @@ def main(request):
@login_required
def add(request):
+ print "This is an edit!"
if request.method != 'POST':
form = TaskForm()
else:
@@ -66,6 +67,7 @@ def edit(request, taskid):
form = TaskForm(instance=task)
else:
form = TaskForm(request.POST, instance=task)
+ print "This is an edit!"
if form.is_valid():
task = form.save(commit=False)
task.modifiedon = datetime.now()
View
80 templates/base.html
@@ -2,61 +2,33 @@
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>
- L3 // {% block SiteTitle %}{% endblock %}
- </title>
- <link rel="stylesheet" href="{{ MEDIA_URL }}/css/reset.css" />
- <!--
- <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono' rel='stylesheet' type='text/css'>
- <link rel="stylesheet" href="{{ MEDIA_URL }}/css/blueprint/screen.css" type="text/css" media="screen, projection">
- <link rel="stylesheet" href="{{ MEDIA_URL }}/css/blueprint/print.css" type="text/css" media="print">
- <link rel="stylesheet" href="{{ MEDIA_URL }}/css/node.css" />
- -->
- <link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+ <title>disarray // {% block PageTitle %}{% endblock %}</title>
+ <link rel="stylesheet" href="{{ MEDIA_URL }}/css/disarray.css" />
+ {% block SiteStyle %}
+ <style type="text/css">
+ body {
+ font-family: "Helvetica", "Lucida Grande", verdana;
+ font-size: 12px;
+ }
+ </style>
+ {% endblock %}
- <!--[if lt IE 8]>
- <link rel="stylesheet" href="{{ MEDIA_URL }}/css/blueprint/ie.css" type="text/css" media="screen, projection">
- <![endif]-->
- <script src="{{ MEDIA_URL }}/js/jquery-1.5.1.min.js"></script>
-
- {% block SiteStyle %}
- <!--
- <style type="text/css">
- body {
- font-family: "Drain Sans", "Lucida Grande", verdana;
- font-size: 12px;
- }
-
- div#site-header {
- padding: 5px;
- height: 20px;
- background-color: lightblue;
- border-bottom: 1px solid lightblue;
- }
- div#site-header h1#site-heading {
- font-size: 15px;
- font-weight: bold;
- }
- </style>
- -->
- {% endblock %}
-
- <script>
- {% block SiteScript %}{% endblock %}
- </script>
- </head>
- <body>
- {% block SiteBody %}
- <div id="site-header">
- <h1 id="site-heading">L3 // {% block AppName %}{% endblock %}</h1>
- <div id="site-nav">
- </div>
- </div>
- {% endblock %}
- </body>
+ <script>
+ {% block SiteScript %}{% endblock %}
+ </script>
+ </head>
+ <body>
+ <h1 id="site-heading">Disarray</h1>
+ {% block SiteBody %}
+ <div id="site-header">
+ <h1 id="site-heading">L3 // {% block AppName %}{% endblock %}</h1>
+ <div id="site-nav">
+ </div>
+ </div>
+ {% endblock %}
+ </body>
</html>

0 comments on commit 235b02c

Please sign in to comment.
Something went wrong with that request. Please try again.