[snowy] Make a few style tweaks.
- From: Brad Taylor <btaylor src gnome org>
- To: svn-commits-list gnome org
- Subject: [snowy] Make a few style tweaks.
- Date: Mon, 27 Apr 2009 09:09:46 -0400 (EDT)
commit 0b0b86ba8d6b664ee50875417238e24d28c9dd22
Author: Brad Taylor <brad getcoded net>
Date: Fri Apr 24 09:49:54 2009 -0400
Make a few style tweaks.
Use a table for the main layout to avoid float quirks and theme the input entry
rather than doing div hackery.
---
notes/templates/notes/base.html | 4 ++
notes/templates/notes/note_detail.html | 8 +++--
site_media/css/screen.css | 62 +++++++++++++++++++++----------
templates/base.html | 23 +++++++-----
4 files changed, 64 insertions(+), 33 deletions(-)
diff --git a/notes/templates/notes/base.html b/notes/templates/notes/base.html
index c801515..d9047f6 100644
--- a/notes/templates/notes/base.html
+++ b/notes/templates/notes/base.html
@@ -1 +1,5 @@
{% extends "site_base.html" %}
+
+{% block sidebar %}
+<input type="text" id="search" name="search" accesskey="s">
+{% endblock %}
diff --git a/notes/templates/notes/note_detail.html b/notes/templates/notes/note_detail.html
index 35b1833..f79296b 100644
--- a/notes/templates/notes/note_detail.html
+++ b/notes/templates/notes/note_detail.html
@@ -2,9 +2,11 @@
{% block title %}{{ object.title }} | Notes | {{ block.super }}{% endblock %}
-{% block body %}
+{% block sidebar %}
+{{ block.super }}
+{% endblock %}
-<h3>{{ object.title }}</h3>
+{% block content %}
+<h2>{{ object.title }}</h2>
<p>{{ object.body }}</p>
-
{% endblock %}
diff --git a/site_media/css/screen.css b/site_media/css/screen.css
index a6aa4b4..1c708fb 100644
--- a/site_media/css/screen.css
+++ b/site_media/css/screen.css
@@ -13,6 +13,11 @@ a, a:link, a:hover, a:active, a:visited {
text-decoration: underline;
}
+h2 {
+ color: #d3643b;
+ font-family: Trebuchet MS, Calibri, Verdana, Arial, sans-serif;
+}
+
.clear {
clear: both;
}
@@ -27,9 +32,17 @@ a, a:link, a:hover, a:active, a:visited {
#header-auth {
float: right;
- margin: 1em 1em 0 0;
+ margin: 0.5em 1em 0 0;
text-align: right;
vertical-align: middle;
+
+ font-family: Trebuchet MS, Calibri, Verdana, Arial, sans-serif;
+ whitespace: nowrap;
+}
+
+#header-auth p, #header-auth h3 {
+ margin: 0;
+ padding: 0;
}
#header-avatar {
@@ -41,30 +54,23 @@ a, a:link, a:hover, a:active, a:visited {
border: 2px solid #FFFFFF;
}
-#header-auth p, #header-auth h3 {
- margin: 0;
- padding: 0;
-}
-
-#header-auth p {
- padding-top: .25em;
-}
-
-#content-container {
- margin: 20px;
+table#container {
+ padding: 20px;
+ width: 100%;
+ border: 0;
}
-#sidebar {
+#sidebar-container {
width: 20%;
min-width: 250px;
max-width: 500px;
+
+ margin: 0;
+}
+#sidebar {
margin-top: 20px;
-
- float: left;
-
background-color: #403b33;
-
font-family: Trebuchet MS, Calibri, Verdana, Arial, sans-serif;
}
@@ -73,6 +79,17 @@ a, a:link, a:hover, a:active, a:visited {
text-transform: uppercase;
}
+#sidebar input#search {
+ width: 250px;
+ margin: 4px;
+ padding: 4px 4px 4px 35px;
+
+ border: 1px solid #bababa;
+ background: #73685d url('/site_media/img/search.png') center left no-repeat;
+
+ color: #FFFFFF;
+}
+
#sidebar .selected {
background-color: #d6e1c7;
color: #545247
@@ -95,12 +112,17 @@ a, a:link, a:hover, a:active, a:visited {
color: #b8dee3;
}
-#content {
+#content-container {
width: 80%;
+ margin: 0;
+}
- float: left;
+#content {
background-color: #edece6;
-
+}
+
+#content h2, #content p {
+ padding-left: 6px;
}
#footer {
diff --git a/templates/base.html b/templates/base.html
index 84a340b..ba8dc55 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -16,7 +16,7 @@
</div>
<div id="header-avatar">
{% if user.is_authenticated %}
- <img src="{{ MEDIA_URL }}img/blank-avatar.png" width="73" height="73" alt="Your Avatar"/>
+ <img src="{{ MEDIA_URL }}img/blank-avatar.png" width="48" height="48" alt="Your Avatar"/>
{% endif %}
</div>
<div id="header-auth">
@@ -31,19 +31,22 @@
<div class="clear"></div>
</div>
</div>
- <div id="content-container">
- <div id="sidebar">
-<br><br>
+ <table id="container">
+ <tr>
+ <td id="sidebar-container">
+ <div id="sidebar">
{% block sidebar %}
{% endblock %}
- </div>
- <div id="content">
-<br><br>
-<br><br>
+ </div>
+ </td>
+ <td id="content-container">
+ <div id="content">
{% block content %}
{% endblock %}
- </div>
- <div class="clear"></div>
+ </div>
+ </td>
+ </tr>
+ </table>
</div>
<div id="footer">
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]