maemo.org - Talk - Customize N900 Conversations

maemo.org - Talk (https://talk.maemo.org/index.php)

- Maemo 5 / Fremantle (https://talk.maemo.org/forumdisplay.php?f=40)

- - Customize N900 Conversations (https://talk.maemo.org/showthread.php?t=36618)

Re: Customize N900 Conversations

Quick question:

I have tried to change the background colour but how do I then change the text to black? I couldn't read it when I made it yellow using FFFF00 or F3FF33.

And I can't seem to click on a conversation from the other person and forward the text on. Any ideas?

thanks

Re: Customize N900 Conversations

Quote:

Originally Posted by bonerp (Post 568851)

Quick question:

I have tried to change the background colour but how do I then change the text to black? I couldn't read it when I made it yellow using FFFF00 or F3FF33.

have you tried googling for "css text color"?

i don't think so... first hit: "color: #123ADF;"

Quote:

And I can't seem to click on a conversation from the other person and forward the text on. Any ideas?

thanks

mhm... nope...
bubble-clicking is an js-issue...
maybe you've changed something there?
if not... mhm... maybe the Bubble*Clicked css block is responsible too... but i wouldn't think so...
(but some things aren't as logical as they seem to be ^^)

Re: Customize N900 Conversations

Is there a way I can remove the colons after the persons name?

Thanks!

Re: Customize N900 Conversations

I understand near enough everything about html and css, and have not had a problem with any of this thread except for 1 tiny thing in the conversations screen.

(see attatched screenshot)

If i receive a one line message from somebody, it appears vertically in the middle, just as i want it to.

But when i send out a one line message, it appears abit higher up in the message box than vertical middle.

I don't understand this because the css code looks ok and is set to vertical-middle.

Code:

div.BubbleSelf {

  -moz-border-radius: 30px ;

  border-style: solid;

  border-width: 1px;



  margin-left: 0px;

  margin-right: 0px;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

  /* overflow: hidden; this bugs mouse events. see bug #123077 */

}



div.BubbleOther {

  -moz-border-radius: 30px ;

  border-style: solid;

  border-width: 1px;



  margin-left: 0px;

  margin-right: 0px;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

  /* overflow: hidden; this bugs mouse events. see bug #123077 */

}

Re: Customize N900 Conversations

the problem isn't in these block of codes.
please post the whole css code. thx. :)

Re: Customize N900 Conversations

A different approach to the "bubble" style conversations, I have made a simpler version, that is similar to the main conversations screen.

I'm still making a few changes, but I'll upload it if anyone wants it before I'm finished.

I just need a way of removing the ":" after the persons name to match the main screen more, anyone know how to do this?

Edit: See this post to download it - http://talk.maemo.org/showpost.php?p...&postcount=412

Re: Customize N900 Conversations

i like your idea putting the timestamp right next to the name and the text under both elementes :)

Re: Customize N900 Conversations

Quote:

Originally Posted by b666m (Post 570628)

the problem isn't in these block of codes.
please post the whole css code. thx. :)

Code:

/**

 * Style rules for the MessageBuffer

 */



/**

 * the body defaults

 */

body {

  margin-left: 16px;

  margin-right: 16px;

}



/**

 * The table column formats

 */



div.Message {

  padding-bottom: 8px;

  clear:          both;

  display:        block;

  padding-left: 8px;

}



div.Message:first-child {

  padding-top: 0px;

}



div.Message:last-child {

  padding-bottom: 0px;

}



div.BubbleSelf {

  -moz-border-radius: 6px ;

  border-style: solid;

  border-width: 1px;



  margin-left: 0px;

  margin-right: 0px;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

  /* overflow: hidden; this bugs mouse events. see bug #123077 */

}



div.BubbleOther {

  -moz-border-radius: 6px ;

  border-style: solid;

  border-width: 1px;



  margin-left: 0px;

  margin-right: 0px;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

  /* overflow: hidden; this bugs mouse events. see bug #123077 */

}



div.BubbleSpacer {

  padding: 0px;

  margin: 0px;

  vertical-align: middle;

  display: table-cell;

  width: 664px;

  max-width: 664px;

  height: 52px;

}



div.BubbleSelfClicked {

  -moz-border-radius: 6px ;

  border-style: solid;

  border-width: 1px;



  margin-left: 0px;

  margin-right: 0px;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

 /* overflow: hidden; this bugs mouse events. see bug #123077 */

}





div.BubbleOtherClicked {

  -moz-border-radius: 6px ;

  border-style: solid;

  border-width: 1px;

  text-shadow: 0.1em 0.1em #000;

  vertical-align: middle;

  padding: 4px 8px;



  display: inline-block;

  width: 664px;

  min-height: 56px;

  /* overflow: hidden; this bugs mouse events. see bug #123077 */

}



/**

 * Others' Avatars

 *

 * This needs a "drop down" shadow, but no idea if that can be done

 *Adele: please note that this drop down shadow might be subjected to change

 *I've talked about it with Vilja who's in charge of address book layout

 *and we might change it so that it's a double border colour to indicate

 *that the avatar is clickable. drop shawdow doesn't seem to work with

 *dark backgrounds unless it's a light colour drop shadow.

 *PLEASE tell me if it's difficult to implement the drop shadow.

 * Looks like drop shadow is dropped from ui specs. And bug 139130 made me

 *remove the space for it anyway.

 */



div.Avatar {

  width: 64px;

  display: inline-block;

  vertical-align: middle;

}



.MessageAvatar {

  width: 64px;

  height:64px;

  outline-style: solid;

  outline-width: 1px;

  -moz-outline-radius: 6px;

}



img.MessagePresence {

  vertical-align: middle;

  width: 16px;

  height: 16px;

}



/**

 * the Name field

 */

span.MessageNameField {

  word-wrap: break-word;

  vertical-align: middle;

}



/**

 * the Text field

 */

span.MessageText {

  text-align: left;

  vertical-align: middle;

  word-wrap: break-word;

}



span.MessageTextSelf {

  text-align: left;

  vertical-align: middle;

  color: red;

  word-wrap: break-word;

}



span.MessageTextOther {

  text-align: left;

  vertical-align: middle;

  color: blue;

  word-wrap: break-word;

}



/**

 * the TimeStamp default rules

 */

div.MessageRight {

  float: right;

  padding-left: 16px;

  white-space: nowrap;

  text-align: right;

  display: inline-block;

}



img.MessageBusinessCardImg {

  vertical-align: middle;

  padding-right: 4px;

}



img.MessageStatusImg {

  vertical-align: middle;

  padding-right: 8px;

}



.MessagingWidgetsSmiley {

  height: 24px;

  width: 24px;

}

Re: Customize N900 Conversations

m165: Can you upload those changes?

Re: Customize N900 Conversations

@munkiii:

what happens if you comment out / delete the red line:

Code:

div.Message {

  padding-bottom: 8px;

  clear:          both;

  display:        block;

  padding-left: 8px;

}