Resources/Message Styles/Smooth Operator.AdiumMessageStyle/Contents/Resources/Mockup-SpecialCases.html
author mathuaerknedam
Mon Aug 30 20:18:59 2010 -0500 (21 months ago)
changeset 3017 8531dd20d6d6
parent 2958 ddbcd74f6c8e
child 3342 bf1b88542bf6
permissions -rw-r--r--
Updating message styles with changes from /xtras/mathuaerknedam
     1 <?xml version="1.0" encoding="utf-8"?>
     2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
     3 <html>
     4 <head>
     5 	<title>
     6 		Smooth Operator message style mockup
     7 	</title>
     8 
     9 	<style type="text/css">
    10 		@import url( "./Variants/time-icon.css" );
    11 
    12 		body
    13 		{
    14 			font-size: 7.5pt;
    15 			border-bottom: 1px solid yellow;
    16 
    17 			//background: url(/Library/Desktop\ Pictures/Plants/Petals.jpg) center repeat;
    18 			//background: url(/Library/Desktop\ Pictures/Plants/Leaves.jpg) center repeat;
    19 			//background: url(/Library/Desktop\ Pictures/Nature/Zen\ Garden.jpg) center repeat;
    20 		}
    21 
    22 </style>
    23 </head>
    24 
    25 <body>
    26 
    27 <div id="x-header">
    28 	<style type="text/css">
    29 		@import url(./Header.css);
    30 	</style>
    31 
    32 	<div id="x-hide" class="x-toggle" onClick="hide_header();"></div>
    33 	<div id="x-show" class="x-toggle" onClick="show_header();" style="display: none"></div>
    34 	<div id="x-wrap">
    35 		<span class="x-date">Wednesday, June 09, 2004</span>
    36 		<span class="x-time">12:45:48</span>
    37 		<img class="serviceIcon" src="/Users/mneedham/src/Adium/build/Release-Debug/Adium.app/Contents/Resources/Service Icons/Aqua.AdiumServiceIcons/aim.png" alt="AIM"/>
    38 		<span class="x-sender x-incoming">Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff</span>
    39 		<span class="x-sender x-outgoing">EvanEvanEvanEvanEvanEvanEvanEvanEvanEvan</span>
    40 		<img class="x-icon x-incoming" src="/Users/mneedham/Library/Application%20Support/Adium%202.0/Users/Default/libpurple/icons/8c814ad7cf1b910b74a9c84fb2b6a85e3cc8cba1.png" />
    41 		<span class="x-iconmask x-incoming" style="-webkit-mask-box-image: url(/Users/mneedham/Library/Application%20Support/Adium%202.0/Users/Default/libpurple/icons/8c814ad7cf1b910b74a9c84fb2b6a85e3cc8cba1.png);"></span>
    42 		<span class="x-color x-incoming" style="background-color: blue"></span>
    43 		<img class="x-icon x-outgoing" src="/Users/mneedham/Library/Application%20Support/Adium%202.0/Users/Default/libpurple/icons/23c091f19e3feacaf0cc782065025af54fc64cd0.png" />
    44 		<span class="x-iconmask x-outgoing" style="-webkit-mask-box-image: url(/Users/mneedham/Library/Application%20Support/Adium%202.0/Users/Default/libpurple/icons/23c091f19e3feacaf0cc782065025af54fc64cd0.png);"></span>
    45 		<span class="x-color x-outgoing" style="background-color: seagreen"></span>
    46 	</div>
    47 </div>
    48 
    49 <!--
    50 <div id="topic" title="1.3.6 http://adium.im || Adium VV? See http://adium.im/blog/2009/08/pidgin-2-6-0-and-adium-vv/ || #adium-devl for development talk || Paste into http://paste.lisp.org/new/adium">
    51 	<div id="x-topic">
    52 		<style type="text/css">
    53 			@import url(./Topic.css);
    54 		</style>
    55 
    56 		<div id="x-hide" class="x-toggle" onclick="hide_header();" style=""></div>
    57 		<div id="x-show" class="x-toggle" onclick="show_header();" style="display: none; "></div>
    58 		<div id="x-wrap" style="top: 8px; ">
    59 			<img class="serviceIcon" title="IRC" alt="IRC" src="/Users/mneedham/Applications/AdiumNightly/Adium.app/Contents/Frameworks/AdiumLibpurple.framework/Resources/irc.png">
    60 			<span id="topicEdit" ondblclick="this.setAttribute('contentEditable', true); this.focus();">1.3.6 http://adium.im || Adium VV? See http://adium.im/blog/2009/08/pidgin-2-6-0-and-adium-vv/ || #adium-devl for development talk || Paste into http://paste.lisp.org/new/adium"</span>
    61 		</div>
    62 	</div>
    63 </div>
    64 --!>
    65 
    66 <div id="Chat" class="groupchat">
    67 
    68 <div class="history date_separator event SERVICE showIcons">
    69 	<span class="x-wrap">
    70 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
    71 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
    72 		<span class="x-mark"></span>
    73 		<span class="x-message" title="12:45:48">Wednesday, June 09, 2004 </span>
    74 	</span>
    75 </div>
    76 
    77 
    78 <div class="history outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
    79 	<img class="x-icon" src="./outgoing_icon.png" />
    80 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
    81 	<span class="x-color" style="background-color: seagreen"></span>
    82 	<span class="x-wrap">
    83 		<span class="x-sender" title="TekJew">Evan </span>
    84 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
    85 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
    86 		<span class="x-mark"></span>
    87 		<span class="x-message">So a priest, a rabbi, and a chicken walk into a bar. </span>
    88 	</span>
    89 </div>
    90 
    91 <div class="history incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
    92 	<img class="x-icon" src="./incoming_icon.png" />
    93 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
    94 	<span class="x-color" style="background-color: blue"></span>
    95 	<span class="x-wrap">
    96 		<span class="x-sender" title="fetchgreebledonx">Jeff </span>
    97 		<span class="x-rtime" title="19 Apr 2004">12:46:07 </span>
    98 		<span class="x-ltime" title="19 Apr 2004">12:46:07 </span>
    99 		<span class="x-mark"></span>
   100 		<span class="x-message">I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore.I'mprettysureI'veheardthisonebefore. </span>
   101 	</span>
   102 	<div class="history consecutive incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   103 		<img class="x-icon" src="./incoming_icon.png" />
   104 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   105 		<span class="x-color" style="background-color: blue"></span>
   106 		<span class="x-wrap">
   107 			<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   108 			<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   109 			<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   110 			<span class="x-mark"></span>
   111 			<span class="x-message">So what happens next? </span>
   112 		</span>
   113 	</div>
   114 </div>
   115 
   116 <div class="history outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   117 	<img class="x-icon" src="./outgoing_icon.png" />
   118 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
   119 	<span class="x-color" style="background-color: seagreen"></span>
   120 	<span class="x-wrap">
   121 		<span class="x-sender" title="TekJew">Evan </span>
   122 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
   123 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
   124 		<span class="x-mark"></span>
   125 		<span class="x-message">So a priest, a rabbi, and a chicken walk into a bar. </span>
   126 	</span>
   127 </div>
   128 
   129 <div class="history incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   130 	<img class="x-icon" src="./incoming_icon.png" />
   131 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   132 	<span class="x-color" style="background-color: blue"></span>
   133 	<span class="x-wrap">
   134 		<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   135 		<span class="x-rtime" title="19 Apr 2004">12:46:07 </span>
   136 		<span class="x-ltime" title="19 Apr 2004">12:46:07 </span>
   137 		<span class="x-mark"></span>
   138 		<span class="x-message">I'm pretty sure I've heard this one before. </span>
   139 	</span>
   140 	<div class="history consecutive incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   141 		<img class="x-icon" src="./incoming_icon.png" />
   142 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   143 		<span class="x-color" style="background-color: blue"></span>
   144 		<span class="x-wrap">
   145 			<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   146 			<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   147 			<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   148 			<span class="x-mark"></span>
   149 			<span class="x-message">So what happens next? </span>
   150 		</span>
   151 		<div class="history consecutive incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   152 			<img class="x-icon" src="./incoming_icon.png" />
   153 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   154 			<span class="x-color" style="background-color: blue"></span>
   155 			<span class="x-wrap">
   156 				<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   157 				<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   158 				<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   159 				<span class="x-mark"></span>
   160 				<span class="x-message">So what happens next? </span>
   161 			</span>
   162 		</div>
   163 	</div>
   164 </div>
   165 
   166 <div class="history incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   167 	<img class="x-icon" src="./incoming_icon.png" />
   168 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   169 	<span class="x-color" style="background-color: blue"></span>
   170 	<span class="x-wrap">
   171 		<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   172 		<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   173 		<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   174 		<span class="x-mark"></span>
   175 		<span class="x-message">So what happens next? </span>
   176 	</span>
   177 </div>
   178 
   179 <div class="history date_separator event SERVICE showIcons">
   180 	<span class="x-wrap">
   181 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
   182 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
   183 		<span class="x-mark"></span>
   184 		<span class="x-message" title="12:45:48">|Wednesday, June 09, 2004 </span>
   185 	</span>
   186 </div>
   187 
   188 <div class="history outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   189 	<img class="x-icon" src="./outgoing_icon.png" />
   190 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
   191 	<span class="x-color" style="background-color: seagreen"></span>
   192 	<span class="x-wrap">
   193 		<span class="x-sender" title="TekJew">Evan </span>
   194 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
   195 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
   196 		<span class="x-mark"></span>
   197 		<span class="x-message">So a priest, a rabbi, and a chicken walk into a bar. </span>
   198 	</span>
   199 </div>
   200 
   201 <div class="history incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   202 	<img class="x-icon" src="./incoming_icon.png" />
   203 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   204 	<span class="x-color" style="background-color: blue"></span>
   205 	<span class="x-wrap">
   206 		<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   207 		<span class="x-rtime" title="19 Apr 2004">12:46:07 </span>
   208 		<span class="x-ltime" title="19 Apr 2004">12:46:07 </span>
   209 		<span class="x-mark"></span>
   210 		<span class="x-message">I'm pretty sure I've heard this one before. </span>
   211 	</span>
   212 	<div class="history consecutive incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   213 		<img class="x-icon" src="./incoming_icon.png" />
   214 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   215 		<span class="x-color" style="background-color: blue"></span>
   216 		<span class="x-wrap">
   217 			<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   218 			<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   219 			<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   220 			<span class="x-mark"></span>
   221 			<span class="x-message">|So what happens next? </span>
   222 		</span>
   223 	</div>
   224 </div>
   225 
   226 <!--
   227 <div class="date_separator event SERVICE showIcons">
   228 	<span class="x-wrap">
   229 		<span class="x-rtime" title="19 Apr 2004">12:45:48 </span>
   230 		<span class="x-ltime" title="19 Apr 2004">12:45:48 </span>
   231 		<span class="x-mark"></span>
   232 		<span class="x-message" title="12:45:48">Wednesday, June 09, 2004 </span>
   233 	</span>
   234 </div>
   235 --!>
   236 
   237 <div class="outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   238 	<img class="x-icon" src="./outgoing_icon.png" />
   239 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
   240 	<span class="x-color" style="background-color: seagreen"></span>
   241 	<span class="x-wrap">
   242 		<span class="x-sender" title="TekJew">EvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvanEvan </span>
   243 		<span class="x-rtime" title="19 Apr 2004">12:46:50 </span>
   244 		<span class="x-ltime" title="19 Apr 2004">12:46:50 </span>
   245 		<span class="x-mark"></span>
   246 		<span class="x-message">|If I remember correctly, they explode outward at the speed of light. </span>
   247 	</span>
   248 	<div class="consecutive outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   249 		<img class="x-icon" src="./outgoing_icon.png" />
   250 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
   251 		<span class="x-color" style="background-color: seagreen"></span>
   252 		<span class="x-wrap">
   253 			<span class="x-sender" title="TekJew">Evan </span>
   254 			<span class="x-rtime" title="19 Apr 2004">12:47:00 </span>
   255 			<span class="x-ltime" title="19 Apr 2004">12:47:00 </span>
   256 			<span class="x-mark"></span>
   257 			<span class="x-message">But that might be if you cross the streams… </span>
   258 		</span>
   259 		<div class="consecutive outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   260 			<img class="x-icon" src="./outgoing_icon.png" />
   261 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon.png);"></span>
   262 			<span class="x-color" style="background-color: seagreen"></span>
   263 			<span class="x-wrap">
   264 				<span class="x-sender" title="TekJew">Evan </span>
   265 				<span class="x-rtime" title="19 Apr 2004">12:46:50 </span>
   266 				<span class="x-ltime" title="19 Apr 2004">12:46:50 </span>
   267 				<span class="x-mark"></span>
   268 				<span class="x-message">If I remember correctly, they explode outward at the speed of light. </span>
   269 			</span>
   270 		</div>
   271 	</div>
   272 </div>
   273 
   274 <div class="mention incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   275 	<img class="x-icon" src="./incoming_icon_wide.png" />
   276 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon_wide.png);"></span>
   277 	<span class="x-color" style="background-color: blue"></span>
   278 	<span class="x-wrap">
   279 		<span class="x-sender" title="fetchgreebledonx">Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff Jeff </span>
   280 		<span class="x-rtime" title="19 Apr 2004">12:47:06 </span>
   281 		<span class="x-ltime" title="19 Apr 2004">12:47:06 </span>
   282 		<span class="x-mark"></span>
   283 		<span class="x-message">…thus negating all existence! </span>
   284 	</span>
   285 </div>
   286 
   287 <div class="outgoing message SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   288 	<img class="x-icon" src="./outgoing_icon_tall.png" />
   289 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./outgoing_icon_tall.png);"></span>
   290 	<span class="x-color" style="background-color: seagreen"></span>
   291 	<span class="x-wrap">
   292 		<span class="x-sender" title="TekJew">Evan </span>
   293 		<span class="x-rtime" title="19 Apr 2004">12:47:51 </span>
   294 		<span class="x-ltime" title="19 Apr 2004">12:47:51 </span>
   295 		<span class="x-mark"></span>
   296 		<span class="x-message">Precisely! it's a risk one takes whenever one walks into a bar, I'm afraid. Especially if one is a chicken. </span>
   297 	</span>
   298 </div>
   299 
   300 <div class="event notification SERVICE showIcons">
   301 	<span class="x-wrap">
   302 		<span class="x-rtime" title="19 Apr 2004">12:47:54 </span>
   303 		<span class="x-ltime" title="19 Apr 2004">12:47:54 </span>
   304 		<span class="x-mark"></span>
   305 		<span class="x-message">Jeff wants your attention! </span>
   306 	</span>
   307 </div>
   308 
   309 <div class="status away SERVICE showIcons">
   310 	<span class="x-wrap">
   311 		<span class="x-rtime" title="19 Apr 2004">12:47:54 </span>
   312 		<span class="x-ltime" title="19 Apr 2004">12:47:54 </span>
   313 		<span class="x-mark"></span>
   314 		<span class="x-message">Jeff went away </span>
   315 	</span>
   316 	<div class="consecutive status away_message SERVICE showIcons">
   317 		<span class="x-wrap">
   318 			<span class="x-rtime" title="19 Apr 2004">12:47:55 </span>
   319 			<span class="x-ltime" title="19 Apr 2004">12:47:55 </span>
   320 			<span class="x-mark"></span>
   321 			<span class="x-message">Away Message: "Away for the sake of being away. Away for the sake of being away. Away for the sake of being away. Away for the sake of being away. " </span>
   322 		</span>
   323 	</div>
   324 </div>
   325 
   326 <div class="incoming autoreply message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   327 	<img class="x-icon" src="incoming_icon.png" />
   328 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./incoming_icon.png);"></span>
   329 	<span class="x-color" style="background-color: blue"></span>
   330 	<span class="x-wrap">
   331 		<span class="x-sender" title="fetchgreebledonx">Jeff (Autoreply) </span>
   332 		<span class="x-rtime" title="19 Apr 2004">12:47:51 </span>
   333 		<span class="x-ltime" title="19 Apr 2004">12:47:51 </span>
   334 		<span class="x-mark"></span>
   335 		<span class="x-message">Away for the sake of being away. Away for the sake of being away. Away for the sake of being away. Away for the sake of being away. Away for the sake of being away. </span>
   336 	</span>
   337 </div>
   338 
   339 <div class="outgoing message firstFocus SERVICE showIcons xx-TekJew" style="background-color: seagreen;">
   340 	<img class="x-icon" src="./buddy_icon.png" />
   341 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./buddy_icon.png);"></span>
   342 	<span class="x-color" style="background-color: seagreen" src="buddy_icon.png"></span>
   343 	<span class="x-wrap">
   344 		<span class="x-sender" title="TekJew">Evan </span>
   345 		<span class="x-rtime" title="19 Apr 2004">12:48:02 </span>
   346 		<span class="x-ltime" title="19 Apr 2004">12:48:02 </span>
   347 		<span class="x-mark"></span>
   348 		<span class="x-message">Gotta run; catch ya later <a href="http://slashdot.org">;) </a></span>
   349 	</span>
   350 	<span id="insert"></span>
   351 </div>
   352 
   353 <div class="incoming message SERVICE showIcons xx-fetchgreebledonx" style="background-color: blue;">
   354 	<img class="x-icon" src="./buddy_icon.png" />
   355 	<span class="x-iconmask" style="-webkit-mask-box-image: url(./buddy_icon.png);"></span>
   356 	<span class="x-color" style="background-color: blue" src="buddy_icon.png"></span>
   357 	<span class="x-wrap">
   358 		<span class="x-sender" title="fetchgreebledonx">Jeff </span>
   359 		<span class="x-rtime" title="19 Apr 2004">12:46:32 </span>
   360 		<span class="x-ltime" title="19 Apr 2004">12:46:32 </span>
   361 		<span class="x-mark"></span>
   362 		<span class="x-message">So what happens next? </span>
   363 	</span>
   364 </div>
   365 
   366 </div>
   367 
   368 <hr id="focus" style="position: absolute; top: 424px;">
   369 
   370 <script src="./Footer.js" type="text/javascript" charset="utf-8"></script>
   371 
   372 </body>
   373 </html>