Reply
Thread Tools
Posts: 2,829 | Thanked: 1,459 times | Joined on Dec 2009 @ Finland
#291
Hey,

Has someone made "dull" layout for conversations. Something like this:

Contact: message here date|clock
Me: message here date|clock

Contact with link to contact card.
 
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#292
and for your joy: ^^



Code:
div.Avatar {
  width: 60px;
  display: inline-block;
  vertical-align: middle;
}

.MessageAvatar {
  width: 60px;
  height:60px;
  -moz-border-radius: 15px 30px 30px 15px / 10px 20px 20px 10px;
  border-width: 2px;
  border-style: solid;
the mozilla engine seems to be the latest out there (from firefox 3.5) otherwise this command wouldn't work (this is what the site i've posted one site back tells me ^^)
 
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#293
Originally Posted by slender View Post
Hey,

Has someone made "dull" layout for conversations. Something like this:

Contact with link to contact card.
mhm... i only made sms conversation in an im conversation style... with both avatars on the left side... but the date is in the message-bubble as usual...

you want to have the date outside this bubble, right? maybe in an extra bubble or just as a text outside?
 
Posts: 2,829 | Thanked: 1,459 times | Joined on Dec 2009 @ Finland
#294
Originally Posted by b666m View Post
mhm... i only made sms conversation in an im conversation style... with both avatars on the left side... but the date is in the message-bubble as usual...

you want to have the date outside this bubble, right? maybe in an extra bubble or just as a text outside?
Heh. Thank you for your help. But my whole point is to have really really basic "dull" and effective/pixel wise conversation so no bubbles no effects (but colors yes) no avatars. Bit like on irc.

Last edited by slender; 2010-02-25 at 16:37.
 
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#295
Originally Posted by slender View Post
Heh. Thank you for your help. But my whole point is to have really really basic "dull" and effective/pixel wise conversation so no bubbles no effects (but colors yes) no avatars. Bit like on irc.
aaaaaaaah... now i get your point

let's see what i can do for you (:
 
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#296
mhm... first attempt:



i thought it might be a good idea to have the background-colors because you can identify faster who wrote the message.
(don't know if you're thinking the same way ^^)

but you can change the background-colors for not seeing any kind of bubbles...

any suggestions? (:

edit: oh... i forgot to edit the min-height of those messages... that's why one-liners look kind of mis-aligned... but that's quick-to-fix
 

The Following User Says Thank You to b666m For This Useful Post:
Posts: 2,829 | Thanked: 1,459 times | Joined on Dec 2009 @ Finland
#297
Haa. Looks better. I didn't thought that separation can be made also with backgrounds. On my digsby I have colored my contact conversation on red and my own text just black or on this case white so it really jumps to your eyes, but this is also fine. It would be nice if it is possible to take all padding between conversations away.

Last edited by slender; 2010-02-25 at 17:36.
 
Posts: 21 | Thanked: 4 times | Joined on Jan 2010 @ Germany
#298
omg b666m where did you learn to code that good?? I wish I could do this too I'd really like to get the message bubble's corners rounded same as the avatars are... got this problem in IM conversations cause I'm not using the bubbles css postet earlier in this Thread, it was way too laggy...
 
Schturman's Avatar
Posts: 5,339 | Thanked: 4,133 times | Joined on Jan 2010 @ Israel
#299
Originally Posted by b666m View Post
ehm.... first attempt... strike: ^^



Code:
div.Avatar {
  width: 60px;
  display: inline-block;
  vertical-align: middle;
}

.MessageAvatar {
  width: 60px;
  height:60px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-bottomright: 15px;
  /*-moz-border-radius-bottomleft: 20px;*/
  border-width: 2px;
  border-style: solid;
edit: as you can see.... bottomleft no corner... topleft 5px... topright 10px... bottomright 15px... all with a 2px border... for your orientation when planning the border-radius
Haaaa, Thanks ! Looks nice !
But I tried getting this on the IM
 
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#300
Originally Posted by slender View Post
Haa. Looks better. I didn't thought that separation can be made also with backgrounds. On my digsby I have colored my contact conversation on red and my own text just black or on this case white so it really jumps to your eyes, but this is also fine. It would be nice if it is possible to take all padding between conversations away.
i can remove that paddings/margins.

you could describe how you like to see the layout.

which background color(s), which font color(s) and so on...

maybe you could make a screenshot or picture how you would like to have it (:
 
Reply

Tags
bada rox, his lunchbox


 
Forum Jump


All times are GMT. The time now is 02:39.