--- a/client/api/rdapi.css
+++ b/client/api/rdapi.css
@@ -16,26 +16,27 @@
body {
width: 960px;
margin: 45px auto 0 auto;
font-family: "Helvetica Neue", Helvetica, Arial, Sans-serif;
font-size: 12px;
line-height: 24px;
position: relative;
+ overflow-y: scroll;
}
#header {
width: 960px;
position: fixed;
top: 0;
left: 50%;
margin-left: -480px;
background-color: #fff;
- z-index: 1;
+ z-index: 2;
border-bottom: 1px solid #ccc;
}
#header li {
display: inline;
margin-right: 10px;
color: #888;
}
@@ -168,28 +169,33 @@ body {
line-height: 90px;
-moz-border-radius: 45px;
-webkit-border-radius: 45px;
}
.inflow {
width: 481px;
background: #fff;
- margin-bottom: 100px;
+ padding-bottom: 55px;
padding-top: 55px;
float: left;
border-right: 1px solid #ccc;
+ z-index: 1;
}
.inflow .row {
border-top: 1px solid #ccc;
padding: 0 0 10px 0;
margin: 0;
}
+.inflow .row:last-child {
+ border-bottom: 1px solid #ccc;
+}
+
.inflow .row.highlight {
background-color: #ffffd9;
}
/*
.inflow .row.highlight .subject {
background-image: url("i/arrow-right.png");
background-repeat: none;
@@ -262,53 +268,63 @@ body {
color: #666;
line-height: 18px;
overflow: hidden;
}
.inflow .row .messageReply,
.inflow .row .messageAttachments {
color: #666;
- margin: 10px 0px 0px 160px;
+ margin: 10px 0px 0px 0;
padding: 5px;
background-color: rgba(204, 204, 204, 0.35);
font-size: 11px;
line-height: 18px;
position: relative;
}
.inflow .row .messageReply.noArrow {
margin-top: 2px;
+ width: 300px;
+ overflow: hidden;
}
.inflow .replies > .reply:nth-child(n+3) {
display: none;
}
.arrow {
display: none;
}
.replies > .reply:nth-child(1) > .arrow {
display: block;
position: absolute;
- left: 180px;
+ left: 20px;
top: -14px;
}
.inflow .row .replies {
margin: 10px 0;
float: left;
position: relative;
}
-.inflow .row.read > .replies {
+.inflow .row .replies:empty {
display: none;
}
+.inflow .row.read .replies {
+ display: none;
+}
+
+.inflow .row.read .subject {
+ color: #666;
+}
+
.inflow .row .messageAttachments {
background-color: transparent;
border-top: none;
padding: 5px 0px;
color: #ff5959;
font-weight: bold;
}
@@ -425,16 +441,17 @@ body {
position: absolute;
float: right;
margin-right: 0;
top: 0;
right: 0;
border-left: 1px solid #ccc;
width: 480px;
background-color: #fff;
+ z-index: 0;
}
#convDisplay .row.highlight {
background-color:#F2F2F2;
}
.widgets.fullMessage .row {
margin: 0;
@@ -453,16 +470,17 @@ body {
}
/*
.row.fullReply:nth-child(odd){
background-color: #f2f2f2;
}*/
.widgets.fullMessage .messageBody {
color: #666;
+ overflow: hidden;
}
.widgets.fullMessage .row.fullReply {
border-bottom: 1px dotted #ccc;
}
.widgets.fullMessage .row.fullReply .actions {
font-size: 12px;
--- a/client/api/rdapi.html
+++ b/client/api/rdapi.html
@@ -192,28 +192,18 @@
<div class="twitterActions">
<li>reply</li>
<li>forward</li>
<li>★</li>
</div>
</div>
<div class="c2">
<div class="subject"><a class="list subject" href="#">{subject}</a></div>
- <div class="messageBody">{first.body_preview}
- </div>
- </div>
- <div class="replies">
- {messages[1:] [}
- <div class="c3 reply">
- <div class="arrow"></div>
- {. body schemas['rd.msg.body']}
- <div class="messageReply noArrow">
- <span class="name">{body.from_display}</span> {body.body_preview}</div>
- </div>
- {]}
+ <div class="messageBody">{first.body_preview}</div>
+ <div class="replies">{messages[1:] [}<div class="reply"><div class="arrow"></div>{. body schemas['rd.msg.body']}<div class="messageReply noArrow"><span class="name">{body.from_display}</span> {body.body_preview}</div></div>{]}</div>
</div>
{. extraCount messages[1:].length}
{extraCount [}
<div class="c3">
<div class="more"><a href="#">view all replies (<span class="totalReplies">{}</span>)</a></div>
</div>
{]}
</div>