xtras/mathuaerknedam 185:27829855de94: yMous: mention/focus indi...
commits at adium.im
commits at adium.im
Thu Nov 5 17:45:50 UTC 2009
details: http://hg.adium.im/xtras/mathuaerknedam/rev/27829855de94
revision: 185:27829855de94
author: mathuaerknedam
date: Thu Nov 05 11:45:36 2009 -0600
yMous: mention/focus indicators are now much more like they were before, though the mention highlighting might be too subtle.
diffs (478 lines):
diff -r e3e8244cce9e -r 27829855de94 yMous ☿.AdiumMessageStyle/Contents/Resources/Content.html
--- a/yMous ☿.AdiumMessageStyle/Contents/Resources/Content.html Wed Nov 04 23:09:22 2009 -0600
+++ b/yMous ☿.AdiumMessageStyle/Contents/Resources/Content.html Thu Nov 05 11:45:36 2009 -0600
@@ -1,17 +1,17 @@
<div class="x-wrapper %messageClasses% %service% xx-%senderScreenName%" title="%senderPrefix% %senderScreenName%%status% · %service% · %time% · %time{dd MMM yyyy}%">
+ <span class="x-focus"></span>
<span class="x-iconsmall"><img src="%userIconPath%" /></span>
<span class="x-sender">%sender%</span>
<span class="x-mark" style="background-color: %senderColor%; color: %senderColor%">‣</span>
<span class="x-message">%message%</span>
<span class="x-time">%time%</span>
- <span class="x-mention"></span>
</div>
<div id="insert" class="x-wrapper">
+ <span class="x-focus"></span>
<span class="x-iconsmall"></span>
<span class="x-sender"></span>
<span class="x-mark"></span>
<span class="x-message"></span>
<span class="x-time"></span>
- <span class="x-mention"></span>
</div>
diff -r e3e8244cce9e -r 27829855de94 yMous ☿.AdiumMessageStyle/Contents/Resources/Mockup.html
--- a/yMous ☿.AdiumMessageStyle/Contents/Resources/Mockup.html Wed Nov 04 23:09:22 2009 -0600
+++ b/yMous ☿.AdiumMessageStyle/Contents/Resources/Mockup.html Thu Nov 05 11:45:36 2009 -0600
@@ -50,120 +50,120 @@
<div id="Chat" class="">
<div class="x-wrapper history date_separator event" title="date_separator · AIM · 12:45:48 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="buddy_icon.png" /></span>
<span class="x-sender"></span>
<span class="x-mark" style="background-color: cyan; color: cyan;">‣</span>
<span class="x-message">Wednesday, June 09, 2004</span>
<span class="x-time">12:45:48</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper history outgoing message xx-TekJew" title="Evan · AIM · 12:45:48 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./outgoing_icon.png" /></span>
<span class="x-sender">Evan</span>
<span class="x-mark" style="background-color: seagreen; color: seagreen;">‣</span>
<span class="x-message">So a priest, a rabbi, and a chicken walk into a bar.</span>
<span class="x-time">12:45:48</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper history incoming message xx-fetchgreebledonx" title="Jeff · AIM · 12:46:07 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./incoming_icon.png" /></span>
<span class="x-sender">Jeff</span>
<span class="x-mark" style="background-color: blue; color: blue;">‣</span>
<span class="x-message">I'm pretty sure I've heard this one before.</span>
<span class="x-time">12:46:07</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper history consecutive incoming message xx-fetchgreebledonx" title="Jeff · AIM · 12:46:32 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./incoming_icon.png" /></span>
<span class="x-sender">Jeff</span>
<span class="x-mark" style="background-color: blue; color: blue;">‣</span>
<span class="x-message">So what happens next?</span>
<span class="x-time">12:46:32</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper outgoing message xx-TekJew" title="Evan · AIM · 12:46:50 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./outgoing_icon.png" /></span>
<span class="x-sender">Evan</span>
<span class="x-mark" style="background-color: seagreen; color: seagreen;">‣</span>
<span class="x-message">If I remember correctly, they explode outward at the speed of light.</span>
<span class="x-time">12:46:50</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper consecutive outgoing message xx-TekJew" title="Evan · AIM · 12:47:00 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./outgoing_icon.png" /></span>
<span class="x-sender">Evan</span>
<span class="x-mark" style="background-color: seagreen; color: seagreen;">‣</span>
<span class="x-message">But that might be if you cross the streams…</span>
<span class="x-time">12:47:00</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper incoming message xx-fetchgreebledonx" title="Jeff · AIM · 12:47:06 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./incoming_icon.png" /></span>
<span class="x-sender">Jeff</span>
<span class="x-mark" style="background-color: blue; color: blue;">‣</span>
<span class="x-message">…thus negating all existence!</span>
<span class="x-time">12:47:06</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper outgoing message mention xx-TekJew" title="Evan · AIM · 12:47:51 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./outgoing_icon.png" /></span>
<span class="x-sender">Evan</span>
<span class="x-mark" style="background-color: seagreen; color: seagreen;">‣</span>
<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>
<span class="x-time">12:47:51</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper status away" title="away · AIM · 12:47:54 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="buddy_icon.png" /></span>
<span class="x-sender"></span>
<span class="x-mark" style="background-color: cyan; color: cyan;">‣</span>
<span class="x-message">Jeff went away</span>
<span class="x-time">12:47:54</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper consecutive status away_message" title="away_message · AIM · 12:47:55 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="buddy_icon.png" /></span>
<span class="x-sender"></span>
<span class="x-mark" style="background-color: cyan; color: cyan;">‣</span>
<span class="x-message">Away Message: "Away for the sake of being away."</span>
<span class="x-time">12:47:55</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper focus incoming message auto_reply xx-fetchgreebledonx" title="Jeff · AIM (Autoreply) · 12:47:51 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./incoming_icon.png" /></span>
<span class="x-sender">Jeff (Autoreply)</span>
<span class="x-mark" style="background-color: blue; color: blue;">‣</span>
<span class="x-message">Away for the sake of being away.</span>
<span class="x-time">12:47:51</span>
-<span class="x-mention"></span>
</div>
<div class="x-wrapper action outgoing message xx-TekJew" title="Evan · AIM · 12:48:02 · 19 Apr 2004">
+<span class="x-focus"></span>
<span class="x-iconsmall"><img src="./outgoing_icon.png" /></span>
<span class="x-sender">Evan</span>
<span class="x-mark" style="background-color: seagreen; color: seagreen;">‣</span>
<span class="x-message">Gotta run; catch ya later ;)</span>
<span class="x-time">12:48:02</span>
-<span class="x-mention"></span>
</div>
<div id="insert" class="x-wrapper">
+<span class="x-focus"></span>
<span class="x-iconsmall"></span>
<span class="x-sender"></span>
<span class="x-mark"></span>
<span class="x-message"></span>
<span class="x-time"></span>
-<span class="x-mention"></span>
</div>
</div>
diff -r e3e8244cce9e -r 27829855de94 yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_Base.css
--- a/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_Base.css Wed Nov 04 23:09:22 2009 -0600
+++ b/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_Base.css Thu Nov 05 11:45:36 2009 -0600
@@ -51,9 +51,12 @@
position: relative;
}
-.x-wrapper,
+.x-focus,
+.x-iconsmall,
+.x-sender,
.x-mark,
-.x-message
+.x-message,
+.x-time
{
-webkit-transition: background-color .4s linear;
}
@@ -62,19 +65,20 @@
.x-sender,
.x-mark,
.x-message,
-.x-mention,
+.x-focus,
.x-time
{
display: table-cell;
}
-.mention .x-mention:before
+.focus .x-focus:before
{
font-family: AppleGothic;
content: "\23af";
content: "\2605";
- margin-right: 3px;
- margin-left: 1px;
+ content: "\feff";
+ width: 16px;
+ margin-right: 2px;
}
.IRC .x-iconsmall img,
@@ -97,7 +101,7 @@
{
max-height: 1.1em;
max-width: 1.1em;
- padding-left: 4px;
+ //padding-left: 4px;
opacity: .875;
}
diff -r e3e8244cce9e -r 27829855de94 yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseM.css
--- a/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseM.css Wed Nov 04 23:09:22 2009 -0600
+++ b/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseM.css Thu Nov 05 11:45:36 2009 -0600
@@ -23,6 +23,7 @@
border-bottom: 4px solid hsla(0, 0%, 100%, 1);
}
+#Chat > div:first-of-type .x-focus,
#Chat > div:first-of-type .x-iconsmall,
#Chat > div:first-of-type .x-sender,
#Chat > div:first-of-type .x-time
@@ -30,6 +31,7 @@
border-top: 4px solid hsla(0, 0%, 90%, 1);
}
+#insert .x-focus,
#insert .x-iconsmall,
#insert .x-sender,
#insert .x-time
@@ -43,6 +45,7 @@
border-top: 16px solid hsla(0, 0%, 100%, 1) !important;
}
+.history + :not(.history) .x-focus,
.history + :not(.history) .x-iconsmall,
.history + :not(.history) .x-sender,
.history + :not(.history) .x-time
@@ -50,6 +53,26 @@
border-top: 16px solid hsla(0, 0%, 90%, 1) !important;
}
+.mention .x-focus,
+.mention .x-iconsmall,
+.mention .x-sender,
+.mention .x-time,
+.history.mention .x-focus,
+.history.mention .x-iconsmall,
+.history.mention .x-sender,
+.history.mention .x-time
+{
+ background-color: hsla(0, 0%, 94%, 1) !important;
+}
+
+.mention .x-mark,
+.mention .x-message,
+.history.mention .x-mark,
+.history.mention .x-message
+{
+ background-color: hsla(0, 0%, 95%, 1) !important;
+}
+
.x-wrapper:hover,
.x-wrapper.x-hover
{
@@ -68,14 +91,18 @@
background-color: hsla(0, 0%, 80%, 1);
}
-.x-wrapper:hover,
+.x-wrapper:hover:not(.focus) > .x-focus,
+.x-wrapper:hover > .x-iconsmall,
+.x-wrapper:hover > .x-sender,
.x-wrapper:hover > .x-mark,
.x-wrapper:hover > .x-message,
-.x-wrapper:hover > .x-mention,
-.x-wrapper.x-hover,
+.x-wrapper:hover > .x-time,
+.x-wrapper.x-hover > .x-focus,
+.x-wrapper.x-hover > .x-iconsmall,
+.x-wrapper.x-hover > .x-sender,
.x-wrapper.x-hover > .x-mark,
.x-wrapper.x-hover > .x-message,
-.x-wrapper.x-hover > .x-mention
+.x-wrapper.x-hover > .x-time
{
background-color: hsla(0, 0%, 75%, 1) !important;
}
@@ -103,50 +130,20 @@
/*----------*/
-.mention .x-mark,
-.mention .x-message,
-.history.mention .x-mark,
-.history.mention .x-message
-{
- //background-color: hsla(0, 25%, 85%, 1) !important;
-}
-
-.mention:hover .x-mark,
-.history.mention:hover .x-mark,
-.mention:hover .x-message,
-.history.mention:hover .x-message,
-.mention.x-hover .x-mark,
-.history.mention.x-hover .x-mark,
-.mention.x-hover .x-message,
-.history.mention.x-hover .x-message
-{
- //background-color: hsla(0, 50%, 85%, 1) !important;
-}
-
-.mention .x-iconsmall,
-.mention .x-sender,
-.mention .x-mark,
-.mention .x-message,
-.mention .x-time,
-.mention .x-mention
-{
- //background-color: hsla(0, 0%, 95%, 1);
-}
-
.focus .x-iconsmall,
.focus .x-sender,
.focus .x-mark,
.focus .x-message,
.focus .x-time,
-.focus .x-mention
+.focus .x-focus
{
- border-top: 4px solid hsla(0, 0%, 63%, 1) !important;
+ //border-top: 4px solid hsla(0, 0%, 63%, 1) !important;
}
-.x-mention
+.focus .x-focus
{
border-left: 1px solid hsla(0, 0%, 63%, 1) !important;
- background: white;
+ background: red;
}
#topic #x-header
diff -r e3e8244cce9e -r 27829855de94 yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseS.css
--- a/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseS.css Wed Nov 04 23:09:22 2009 -0600
+++ b/yMous ☿.AdiumMessageStyle/Contents/Resources/Variants/_Themes/_BaseS.css Thu Nov 05 11:45:36 2009 -0600
@@ -23,6 +23,7 @@
border-bottom: 4px solid hsla(0, 0%, 0%, 1);
}
+#Chat > div:first-of-type .x-focus,
#Chat > div:first-of-type .x-iconsmall,
#Chat > div:first-of-type .x-sender,
#Chat > div:first-of-type .x-time
@@ -30,6 +31,7 @@
border-top: 4px solid hsla(0, 0%, 12.5%, 1);
}
+#insert .x-focus,
#insert .x-iconsmall,
#insert .x-sender,
#insert .x-time
@@ -43,6 +45,7 @@
border-top: 16px solid hsla(0, 0%, 0%, 1) !important;
}
+.history + :not(.history) .x-focus,
.history + :not(.history) .x-iconsmall,
.history + :not(.history) .x-sender,
.history + :not(.history) .x-time
@@ -50,6 +53,28 @@
border-top: 16px solid hsla(0, 0%, 12.5%, 1) !important;
}
+.mention .x-focus,
+.mention .x-iconsmall,
+.mention .x-sender,
+.mention .x-time,
+.history.mention .x-focus,
+.history.mention .x-iconsmall,
+.history.mention .x-sender,
+.history.mention .x-time
+{
+ //background-color: hsla(0, 25%, 15%, 1) !important;
+ background-color: hsla(0, 0%, 17.5%, 1) !important;
+}
+
+.mention .x-mark,
+.mention .x-message,
+.history.mention .x-mark,
+.history.mention .x-message
+{
+ //background-color: hsla(0, 25%, 15%, 1) !important;
+ background-color: hsla(0, 0%, 15%, 1) !important;
+}
+
.x-wrapper:hover,
.x-wrapper.x-hover
{
@@ -68,14 +93,18 @@
background-color: hsla(0, 0%, 20%, 1);
}
-.x-wrapper:hover,
+.x-wrapper:hover:not(.focus) > .x-focus,
+.x-wrapper:hover > .x-iconsmall,
+.x-wrapper:hover > .x-sender,
.x-wrapper:hover > .x-mark,
.x-wrapper:hover > .x-message,
-.x-wrapper:hover > .x-mention,
-.x-wrapper.x-hover,
+.x-wrapper:hover > .x-time,
+.x-wrapper.x-hover > .x-focus,
+.x-wrapper.x-hover > .x-iconsmall,
+.x-wrapper.x-hover > .x-sender,
.x-wrapper.x-hover > .x-mark,
.x-wrapper.x-hover > .x-message,
-.x-wrapper.x-hover > .x-mention
+.x-wrapper.x-hover > .x-time
{
background-color: hsla(0, 0%, 25%, 1) !important;
}
@@ -103,50 +132,20 @@
/*----------*/
-.mention .x-mark,
-.mention .x-message,
-.history.mention .x-mark,
-.history.mention .x-message
-{
- //background-color: hsla(0, 25%, 15%, 1) !important;
-}
-
-.mention:hover .x-mark,
-.history.mention:hover .x-mark,
-.mention:hover .x-message,
-.history.mention:hover .x-message,
-.mention.x-hover .x-mark,
-.history.mention.x-hover .x-mark,
-.mention.x-hover .x-message,
-.history.mention.x-hover .x-message
-{
- //background-color: hsla(0, 50%, 15%, 1) !important;
-}
-
-.mention .x-iconsmall,
-.mention .x-sender,
-.mention .x-mark,
-.mention .x-message,
-.mention .x-time,
-.mention .x-mention
-{
- //background-color: hsla(0, 0%, 15%, 1);
-}
-
.focus .x-iconsmall,
.focus .x-sender,
.focus .x-mark,
.focus .x-message,
.focus .x-time,
-.focus .x-mention
+.focus .x-focus
{
- border-top: 4px solid hsla(0, 0%, 37%, 1) !important;
+ //border-top: 4px solid hsla(0, 0%, 37%, 1) !important;
}
-.x-mention
+.focus .x-focus
{
border-left: 1px solid hsla(0, 0%, 37%, 1) !important;
- background: black;
+ background: red;
}
#topic #x-header
More information about the commits
mailing list