← Back to branch summary

~ubuntu-branches/ubuntu/precise/gwibber/precise-proposed

« back to all changes in this revision

Viewing changes to ui/themes/default/theme.html

  • Committer: Bazaar Package Importer
  • Author(s): Fabien Tassin
  • Date: 2009-02-20 14:45:57 UTC
  • Revision ID: james.westby@ubuntu.com-20090220144557-xmhe71jdn1mf7yo9
Tags: upstream-0.8
Import upstream version 0.8

Show diffs side-by-side

added added

removed removed

Lines of Context:
ui/themes/default/theme.html
 
1
<html>
 
2
  <head>
 
3
    <style>
 
4
      body {
 
5
        background: url(blue_stripe.png);
 
6
        word-break: break-word;
 
7
        color: white;
 
8
        font-size: 12px;
 
9
      }
 
10
      
 
11
      a { color: white; }
 
12
      
 
13
      a:hover, .time a:hover {
 
14
        text-decoration: underline;
 
15
      }
 
16
 
 
17
      p { line-height: 125% }
 
18
      
 
19
      td { vertical-align: top; }
 
20
 
 
21
      .message {
 
22
        padding: 10px;
 
23
        padding-bottom: 20px;
 
24
        margin-bottom: 5px;
 
25
        text-shadow: 1px 1px black;
 
26
        font-family: Lucida Grande;
 
27
        -webkit-border-radius: 7px;
 
28
      }
 
29
 
 
30
      .searchresult {
 
31
        padding: 1px;
 
32
        -webkit-border-radius: 7px;
 
33
        background: -webkit-gradient(linear, left top, left 220%, from(rgba(143, 6, 32, 0.8)), to(black))
 
34
      }
 
35
 
 
36
      .title {
 
37
        font-size: large;
 
38
        font-weight: bold;
 
39
      }
 
40
 
 
41
      .time {
 
42
        font-size: small;
 
43
      }
 
44
 
 
45
      .time a {
 
46
        text-decoration: none;
 
47
      }
 
48
 
 
49
      .imgbox {
 
50
        width: 48px;
 
51
        height: 48px;
 
52
        margin-right: 5px;
 
53
        background-image: url('');
 
54
        background-repeat: no-repeat;
 
55
        -webkit-border-radius: 7px;
 
56
        -webkit-box-reflect:below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.6, transparent), to(rgba(0,0,0, 0.6)));
 
57
      }
 
58
 
 
59
      .inlinenick {
 
60
        text-decoration: none;
 
61
        font-weight: bold;       
 
62
      }
 
63
 
 
64
      .messages h1 {
 
65
        text-align: center;
 
66
      }
 
67
 
 
68
      .replybutton {
 
69
        float: right;
 
70
        display: none;
 
71
      }
 
72
 
 
73
      .replybutton img
 
74
      {
 
75
        padding-left: 5px;
 
76
      }
 
77
 
 
78
      .diggbox {
 
79
        -webkit-border-radius: 7px; 
 
80
        margin-right: 5px;
 
81
        padding: 1px;
 
82
        text-align: center;
 
83
        color: black;
 
84
        text-shadow: none;
 
85
        background:  -webkit-gradient(linear, left top, left 220%, from(rgba(254, 240, 152, 0.9)), to(black));
 
86
        display: none;
 
87
      }
 
88
 
 
89
      .diggcount {
 
90
        font-size: large;
 
91
      }
 
92
 
 
93
      .unread {
 
94
        border: 3px solid rgba(110, 240, 255, 0.8);
 
95
        border-style: ridge;
 
96
      }
 
97
 
 
98
      .reply {
 
99
        border: 3px solid rgba(143, 6, 32, 0.8);
 
100
        border-style: ridge;
 
101
      }
 
102
 
 
103
      .private {
 
104
        border: 3px solid rgba(255, 44, 188, 0.8);
 
105
        border-style: ridge;
 
106
      }
 
107
 
 
108
      .dupes {
 
109
        display: none;
 
110
      }
 
111
 
 
112
      .toggledupe {
 
113
        float: left;
 
114
        display: none;
 
115
      }
 
116
    </style>
 
117
 
 
118
    <script src="jquery.js"></script>
 
119
    <script>
 
120
      // XXX: this is a twitter-specific hack currently...needs updating for other protocols
 
121
      function addUserHeader(data) {
 
122
        html = '<div id="'+ data.gId +'" class="message '+ data.username + data.protocol + ' ' + data.aId + data.bgcolor +'" title="'+ data.sender_nick +'">' +
 
123
                        '<center> \
 
124
                        <p class="content"> \
 
125
                        <span class="title">'+ data.sender +'</span><br /> \
 
126
                        <span class="text">'+ data.sender_followers_count +' followers</span><br /> \
 
127
                        <span class="text">'+ data.sender_location +'</span><br /> \
 
128
                        <span class="text"><a href="'+ data.external_profile_url  +'">'+ data.external_profile_url +'</a></span> \
 
129
                        </p> \
 
130
                        </center> \
 
131
                </div>'
 
132
                $(".header").html(html);
 
133
      }
 
134
 
 
135
      function addMessages(messages, msg) {
 
136
        clearMessages()
 
137
        $.each(messages, function() {addMessage(this, msg)});
 
138
      }
 
139
 
 
140
      function clearMessages() {
 
141
        $(".messages").html("");
 
142
      }
 
143
 
 
144
      function addDiggCount(message, data) {
 
145
        message.html('<p><span class="diggcount">' + data.diggs + '</span><br /><small>diggs</small></p>');
 
146
        message.css('display', 'block');
 
147
      }
 
148
 
 
149
      function setAccountConfig(data) {
 
150
        $.each(data, function() {
 
151
          for (var conf in this) {
 
152
            if (conf.search("color") > 0)
 
153
              setMessageColor(this.id, conf, this[conf].red, this[conf].green, this[conf].blue, 0.6);
 
154
          }
 
155
        });
 
156
      }
 
157
 
 
158
      function setGtkConfig(data) {
 
159
 
 
160
      }
 
161
 
 
162
      function addMessage(data, msg) {
 
163
        html = '<div id="'+ data.gId +'" class="message '+ data.username + data.protocol + ' ' + data.aId + data.bgcolor +'">' +
 
164
          '<table><tr>' +
 
165
            (data.image ? '<td class="imagecolumn"> \
 
166
              <a href="'+ data.profile_url +'"> \
 
167
                <div class="imgbox" title="'+ data.sender_nick +'" style="background-image: url('+ data.image +');"></div> \
 
168
              </a> \
 
169
              <br />\
 
170
              <div class="diggbox"></div> \
 
171
            </td>' : '') + '<td> \
 
172
              <p class="content"> \
 
173
                <span class="title">'+ (data.title == undefined ? data.sender : data.title) +'</span> \
 
174
                <span class="time"> (<a href="'+ data.url +'">'+ data.time_string +'</a>' +
 
175
                    (data.reply_nick ? ' <a href="'+ data.reply_url +'">'+ msg.reply +' '+ data.reply_nick +'</a>' : '') +
 
176
                    ')</span><br /> \
 
177
                <span class="text">'+ data.html_string +'</span> \
 
178
              </p> \
 
179
            </td></tr> \
 
180
          </table> \
 
181
          <div class="toggledupe"><img src="add.png" /></div> \
 
182
          <div class="dupes"></div> \
 
183
          <div class="replybutton">' +
 
184
            (data.can_thread ? '<a href="gwibber:thread/' + data.message_index + '"><img src="thread.png" /></a>' : '') +
 
185
            '<a href="gwibber:reply/'+ data.message_index +'"><img src="reply.png" /></a> \
 
186
          </div> \
 
187
        </div>'
 
188
 
 
189
        if (data.is_duplicate) {
 
190
          $("#" + data.gId + " .dupes:first").append(html);
 
191
          $("#" + data.gId + " .toggledupe:first").show(0).unbind().toggle(
 
192
            function() {$(this).parent().find(".dupes").show(100)},
 
193
            function() {$(this).parent().find(".dupes").hide(100)});
 
194
        } else $(".messages").append(html);
 
195
 
 
196
        if (data.protocol == "digg")
 
197
          addDiggCount($(".diggbox:last"), data);
 
198
 
 
199
        if (data.is_unread)
 
200
          $(".message:last").addClass("unread");          
 
201
 
 
202
        if (data.is_reply)
 
203
          $(".message:last").addClass("reply");
 
204
 
 
205
        if (data.is_private)
 
206
          $(".message:last").addClass("private");
 
207
 
 
208
        $(".message:last").hover(
 
209
          function() {$(this).find(".replybutton").fadeIn(100)},
 
210
          function() {$(this).find(".replybutton").hide(0)});
 
211
      }
 
212
 
 
213
      function setMessageColor(aId, colorName, r, g, b, a) {
 
214
        $('.'+aId+colorName).css('background', '-webkit-gradient(linear, left top, left 220%, from(rgba('+r+','+g+','+b+','+a+')), to(black))')
 
215
      }
 
216
    </script>
 
217
  </head>
 
218
  <body>
 
219
    <div class="header">
 
220
    </div>
 
221
    <div class="messages">
 
222
    </div>
 
223
  </body>
 
224
</html>
 
225