Do some CSS refactoring

2 files changed, 304 insertions, 316 deletions

diff --git a/hyperkitty/static/css/style.css b/hyperkitty/static/css/style.css
index 9c8e73c..e561a30 100644
--- a/hyperkitty/static/css/style.css
+++ b/hyperkitty/static/css/style.css
@@ -1,9 +1,17 @@
 body {
 	position: relative;
-	padding-top: 55px;
+	padding-top: 70px;
 	background-color: white;
 }
 
+
+ul.nav.auth {
+    float: right;
+    margin: 0;
+}
+
+
+
 .Sb {
 	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;
@@ -145,28 +153,6 @@ body {
    margin-left: 20px;
 }
 
-.user_nav {
-    float: right;
-    list-style: none;
-    margin: 0;
-    padding: 5px 0 0 0;
-}
-
-.user_nav a {
-	float: none;
-	padding: 10px 10px 11px;
-	line-height: 19px;
-	color: #999;
-	text-decoration: none;
-	text-shadow: 0 -1px 0 
-	rgba(0, 0, 0, 0.25);
-}
-
-.user_nav li {
-   float: left;
-   margin-left: 20px;
-}
-
 .nav .root {
     font-weight: bold;
 }
@@ -214,24 +200,19 @@ body {
 
 #recent_activities, #month-view {
     width: 88%;
-    margin-top: 20px;
     margin-right: 10px;
     float: right;
 }
 
-#archives{
+#archives {
     width: 9%;
-    margin-left: 10px;
-    margin-top: 20px;
     float: left;
-/*
-    margin-right: 2px;
-*/
 }
 
 #archives ul {
     padding: 0;
     margin: 0;
+    margin-bottom: 1em;
 }
 
 #archives li {
@@ -243,28 +224,28 @@ body {
 
 /* Month view header */
 
-#month-view header {
+#month-view .month-header {
     margin-bottom: 4em;
 }
 
-#month-view header .list-name {
+#month-view .month-header .list-name {
     display: inline;
     font-size: 190%;
     font-weight: bold;
     padding-right: 0.5em;
 }
 
-#month-view header .month-name {
+#month-view .month-header .month-name {
     display: inline;
     font-size: 190%;
     padding-right: 1em;
 }
 
-#month-view header .month-info {
+#month-view .month-header .month-info {
     display: inline;
     list-style-type: none;
 }
-#month-view header .month-info li {
+#month-view .month-header .month-info li {
     display: inline;
 }
 
@@ -415,3 +396,291 @@ li.attachments ul li {
     list-style-position: inside;
     padding-left: 0.5em;
 }
+
+ul.attachments-list li {
+    display: list-item;
+    list-style-type: disc;
+}
+
+
+/* Message view */
+
+.message-header {
+    margin-bottom: 3em;
+}
+
+.message-header .thread-back {
+    display: block;
+    padding-top: 38px;
+    width: 160px;
+    overflow: hidden;
+    background-repeat: no-repeat;
+    background-position: top center;
+    background-image: url('../img/button_back.png');
+    margin-bottom: 1em;
+}
+
+
+/* Thread view */
+
+.thread-header {
+    /*background-color: #f6f6f6;*/
+    /*border-bottom: 1px solid #b3b3b3;*/
+    margin-bottom: 6em;
+    padding: 1em 0;
+}
+
+.thread-header h1,
+.message-header h1 {
+    text-align: center;
+    font-size: 24px;
+    line-height: 26px;
+}
+
+.thread-header .thread-older,
+.thread-header .thread-newer {
+    display: block;
+    padding-top: 38px;
+    width: 160px;
+    overflow: hidden;
+    background-repeat: no-repeat;
+    background-position: top center;
+    text-align: center;
+    color: #aaaaaa;
+}
+.thread-header .thread-older {
+    float: right;
+    background-image: url('../img/button_older.png');
+}
+.thread-header .thread-newer {
+    float: left;
+    background-image: url('../img/button_newer.png');
+}
+
+#thread_nav{
+    margin:auto;
+    width:100%;
+    text-align:center;
+}
+
+#thread_nav * {
+    vertical-align: middle;
+}
+
+#thread_nav .thread_title{
+    margin:auto;
+    width: 50%;
+}
+
+#thread_nav br {
+    margin-top: 10px;
+}
+
+#thread_nav .thread_info {
+    margin-top:10px;
+    margin-bottom:10px;
+    font-size: 70%;
+    font-weight: normal;
+    text-align: center;
+}
+
+#thread_nav .thread_info li {
+    margin-left:3em;
+}
+
+#olderhread, #newewthread {
+    font-size: 70%;
+    color: rgb(167, 169, 172);
+}
+
+#olderhread {
+    float: right;
+    margin-top: 2em;
+    margin-right: 20px;
+}
+
+/* Define the two columns */
+#thread_content {
+    width: 74%;
+}
+
+#thread_overview_info {
+    float: right;
+    width: 22%;
+}
+
+/* Thread general information column */
+#days_old {
+    margin-left:1em;
+}
+
+.days_text {
+    font-size: 70%;
+}
+
+.days_num {
+    font-size: 200%;
+}
+
+#add_to_fav a{
+    color: rgb(167, 169, 172);
+}
+
+#grey {
+    color: rgb(167, 169, 172);
+    background-color: rgb(167, 169, 172);
+    margin: 0px;
+    border: 0 none;
+    height: 1px;
+}
+
+#tags {
+    color: rgb(167, 169, 172);
+    margin-top: 2em;
+}
+
+#tag_title {
+    color: rgb(77, 77, 77);
+    text-transform: uppercase;
+}
+
+#tags ul {
+    padding: 10px 0;
+    margin: 0;
+}
+
+#add_tag {
+    margin-top: 0.3em;
+}
+
+#participants {
+    margin-top: 2em;
+    color: rgb(167, 169, 172);
+}
+
+#participants_title {
+    color: rgb(77, 77, 77);
+    text-transform: uppercase;
+}
+
+#participants ul {
+    padding: 0;
+    margin: 0;
+}
+
+#participants li {
+    list-style-type: none;
+    margin: 1em 0;
+}
+
+#participants img {
+    width: 20px;
+    vertical-align: middle;
+}
+
+
+/* Main section with the whole thread */
+
+/* First email of the thread. */
+
+.first_email {
+}
+
+.email_header {
+    position:relative;
+    margin-bottom: 1em;
+    height: 40px;
+}
+
+.email_header .gravatar {
+    margin-right: 10px;
+    display: inline-block;
+    vertical-align: middle;
+}
+
+.email_author .name{
+    color: rgb(55, 113, 200);
+    font-weight: bold;
+}
+.email_author .rank{
+    color: rgb(167, 169, 172);
+    font-size: 80%;
+    font-weight: bold;
+}
+
+.email .email_date {
+    font-size: 90%;
+}
+.first_email .email_date span {
+    display: block;
+    text-align: right;
+}
+.email_date .date {
+    font-weight: bold;
+}
+.email_date .time {
+    color: rgb(167, 169, 172);
+    margin-left: 0.5em;
+}
+
+.add_comment {
+    float: right;
+}
+
+/* The email thread */
+.even, .odd {
+    border-top: 1px solid rgb(179, 179, 179);
+    padding: 1em;
+	margin: 20px 0px 20px 0px;
+}
+.even {
+    background-color: rgb(246, 246, 246);
+}
+.odd {
+    background-color: rgb(238, 238, 238);
+}
+
+.email {
+}
+
+.email .email_header {
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+.email .email_author {
+    font-size: 90%;
+}
+
+.first_email_body, .email_body {
+    white-space: pre;
+    display: inline-block;
+}
+.first_email_body {
+    width: 100%;
+    overflow: auto;
+}
+.email_body{
+    -webkit-border-radius: 5px 5px 5px 5px;
+    -moz-border-radius: 5px 5px 5px 5px;
+    border-radius: 5px 5px 5px 5px;
+    border-style: solid;
+    border-width: 1px;
+    border-color: rgb(179, 179, 179);
+    padding: 5px;
+    min-height: 40px;
+    background-color: rgb(255, 255, 255);
+    width: 95%;
+}
+
+
+.email_body a {
+    float: right;
+    padding: 3px 10px 0px 0px;
+}
+
+.email_info {
+    padding: 0px;
+    margin-top: 5px;
+}
+
diff --git a/hyperkitty/static/css/thread.css b/hyperkitty/static/css/thread.css
deleted file mode 100644
index a59e51a..0000000
--- a/hyperkitty/static/css/thread.css
+++ /dev/null
@@ -1,281 +0,0 @@
-
-header {
-    /*background-color: #f6f6f6;*/
-    /*border-bottom: 1px solid #b3b3b3;*/
-    margin-bottom: 6em;
-    padding: 1em 0;
-}
-
-h1 {
-    text-align: center;
-    font-size: 24px;
-    line-height: 26px;
-}
-
-header .thread-older,
-header .thread-newer,
-header .thread-back {
-    display: block;
-    padding-top: 38px;
-    width: 160px;
-    overflow: hidden;
-    background-repeat: no-repeat;
-    background-position: top center;
-    text-align: center;
-    color: #aaaaaa;
-}
-header .thread-older {
-    float: right;
-    background-image: url('../img/button_older.png');
-}
-header .thread-newer {
-    float: left;
-    background-image: url('../img/button_newer.png');
-}
-header .thread-back {
-    background-image: url('../img/button_back.png');
-    margin-bottom: 2em;
-}
-
-#thread_nav{
-    margin:auto;
-    width:100%;
-    text-align:center;
-}
-
-#thread_nav * {
-    vertical-align: middle;
-}
-
-#thread_nav .thread_title{
-    margin:auto;
-    width: 50%;
-}
-
-#thread_nav br {
-    margin-top: 10px;
-}
-
-#thread_nav .thread_info {
-    margin-top:10px;
-    margin-bottom:10px;
-    font-size: 70%;
-    font-weight: normal;
-    text-align: center;
-}
-
-#thread_nav .thread_info li {
-    margin-left:3em;
-}
-
-#olderhread, #newewthread {
-    font-size: 70%;
-    color: rgb(167, 169, 172);
-}
-
-#olderhread {
-    float: right;
-    margin-top: 2em;
-    margin-right: 20px;
-}
-
-/* Define the two columns */
-#thread_content {
-    width: 74%;
-}
-
-#thread_overview_info {
-    float: right;
-    width: 22%;
-}
-
-/* Thread general information column */
-#days_old {
-    margin-left:1em;
-}
-
-.days_text {
-    font-size: 70%;
-}
-
-.days_num {
-    font-size: 200%;
-}
-
-#add_to_fav a{
-    color: rgb(167, 169, 172);
-}
-
-#grey {
-    color: rgb(167, 169, 172);
-    background-color: rgb(167, 169, 172);
-    margin: 0px;
-    border: 0 none;
-    height: 1px;
-}
-
-#tags {
-    color: rgb(167, 169, 172);
-    margin-top: 2em;
-}
-
-#tag_title {
-    color: rgb(77, 77, 77);
-    text-transform: uppercase;
-}
-
-#tags ul {
-    padding: 10px 0;
-    margin: 0;
-}
-
-#add_tag {
-    margin-top: 0.3em;
-}
-
-#participants {
-    margin-top: 2em;
-    color: rgb(167, 169, 172);
-}
-
-#participants_title {
-    color: rgb(77, 77, 77);
-    text-transform: uppercase;
-}
-
-#participants ul {
-    padding: 0;
-    margin: 0;
-}
-
-#participants li {
-    list-style-type: none;
-    margin: 1em 0;
-}
-
-#participants img {
-    width: 20px;
-    vertical-align: middle;
-}
-
-
-/* Main section with the whole thread */
-
-/* First email of the thread. */
-
-.first_email {
-}
-
-.email_header {
-    position:relative;
-    margin-bottom: 1em;
-}
-
-.email_header img {
-    width: 40px;
-    float: left;
-    margin-right: 10px;
-}
-
-.email_author {
-    height: 40px;
-}
-.email_author .name{
-    color: rgb(55, 113, 200);
-    font-weight: bold;
-}
-.email_author .rank{
-    color: rgb(167, 169, 172);
-    font-size: 80%;
-    font-weight: bold;
-}
-
-.email .email_date {
-    font-size: 90%;
-}
-.first_email .email_date span {
-    display: block;
-    text-align: right;
-}
-.email_date .date {
-    font-weight: bold;
-}
-.email_date .time {
-    color: rgb(167, 169, 172);
-    margin-left: 0.5em;
-}
-
-.add_comment {
-    float: right;
-}
-
-/* The email thread */
-.even, .odd {
-    border-top: 1px solid rgb(179, 179, 179);
-    padding: 1em;
-	margin: 20px 0px 20px 0px;
-}
-.even {
-    background-color: rgb(246, 246, 246);
-}
-.odd {
-    background-color: rgb(238, 238, 238);
-}
-
-.email {
-}
-
-.email .email_header {
-    margin-top: 10px;
-    margin-bottom: 10px;
-}
-
-.email .email_author {
-    font-size: 90%;
-}
-
-.first_email_body, .email_body {
-    white-space: pre;
-    display: inline-block;
-}
-.first_email_body {
-    width: 100%;
-    overflow: auto;
-}
-.email_body{
-    -webkit-border-radius: 5px 5px 5px 5px;
-    -moz-border-radius: 5px 5px 5px 5px;
-    border-radius: 5px 5px 5px 5px;
-    border-style: solid;
-    border-width: 1px;
-    border-color: rgb(179, 179, 179);
-    padding: 5px;
-    min-height: 40px;
-    background-color: rgb(255, 255, 255);
-    width: 95%;
-}
-
-
-.email_body a {
-    float: right;
-    padding: 3px 10px 0px 0px;
-}
-
-.email_info {
-    padding: 0px;
-    margin-top: 5px;
-}
-
-.thread_email {
-    padding-left: 20px;
-    margin-left: 21px;
-    display: inline-block;
-    vertical-align: top;
-    white-space: pre;
-}
-
-ul.attachments-list li {
-    display: list-item;
-    list-style-type: disc;
-}
-