applying of htmlFormatMsg() for 'bio' field in peer/group profile

css/style.css

@@ -80,6 +80,13 @@ h3
     font-size: 14px;
     color: rgba( 0, 0, 0, .5 );
 }
+
+samp {
+    background-color: #F0EFCC;
+    padding-left: 2px;
+    padding-right: 2px;
+}
+
 .clearfix:before,
 .clearfix:after
 {
@@ -779,6 +786,11 @@ textarea.splited-post {
 {
     vertical-align: top;
 }
+
+.twister-user .bio a {
+    color: #e34f42;
+}
+
 .followers
 {
     font-size: 12px;
@@ -1068,12 +1080,6 @@ ol.toptrends-list {
     word-wrap: break-word;
 }
 
-.post-text samp {
-    background-color: #F0EFCC;
-    padding-left: 2px;
-    padding-right: 2px;
-}
-
 .post-context {
     font-size: 11px;
     margin: 2px 16px 4px 60px;

js/interface_common.js

@@ -172,7 +172,7 @@ function openGroupProfileModalWithNameHandler(groupAlias) {
 
                     getAvatar(ret.members[i], item.find('.twister-user-photo'));
                     getFullname(ret.members[i], item.find('.twister-user-full'));
-                    getBio(ret.members[i], item.find('.bio'));
+                    getBioToElem(ret.members[i], item.find('.bio'));
                 }
 
                 elemFitNextIntoParentHeight(req.modal.content.find('.profile-card'));
@@ -314,7 +314,7 @@ function fillWhoToFollowModal(list, hlist, start) {
 
                     getAvatar(utf, item.find('.twister-user-photo'));
                     getFullname(utf, item.find('.twister-user-full'));
-                    getBio(utf, item.find('.bio'));
+                    getBioToElem(utf, item.find('.bio'));
                     getFullname(followingUsers[i], item.find('.followed-by').text(followingUsers[i]));
 
                     item.find('.twister-user-remove').remove();

js/twister_actions.js

@@ -329,7 +329,7 @@ function updateProfileData(profileModalContent, username) {
     getFullname( username, profileModalContent.find(".profile-name") );
     getLocation( username, profileModalContent.find(".profile-location") );
     getWebpage( username, profileModalContent.find(".profile-url") );
-    getBio( username, profileModalContent.find(".profile-bio") );
+    getBioToElem(username, profileModalContent.find('.profile-bio'));
     getTox( username, profileModalContent.find(".profile-tox") );
     getBitmessage( username, profileModalContent.find(".profile-bitmessage") );
     getAvatar( username, profileModalContent.find(".profile-card-photo") );

js/twister_io.js

@@ -249,9 +249,13 @@ function getFullname( username, item ){
     }
 }
 
-// get bio and store it in item.text
+// get bio, format it as post message and store result to elem
-function getBio( username, item ){
+function getBioToElem(peerAlias, elem) {
-    getProfileResource( username, "bio", item);
+    getProfileResource(peerAlias, 'bio', undefined,
+        function (req, ret) {
+            req.elem.html(htmlFormatMsg(ret).html);
+        }, {elem: elem}
+    );
 }
 
 // get tox address and store it in item.text

theme_calm/css/style.css

@@ -98,6 +98,13 @@ h3
     font-size: 14px;
     color: rgba( 0, 0, 0, .5 );
 }
+
+samp {
+    background-color: #EEE;
+    padding-left: 2px;
+    padding-right: 2px;
+}
+
 .isFollowing:after {
     color: #1a1;
     content: '\2714';
@@ -959,6 +966,23 @@ textarea.splited-post {
 {
     vertical-align: top;
 }
+
+.twister-user .bio a {
+    font: italic 13px "Open Sans", sans-serif;
+    text-decoration: none;
+    color: #b46e67;
+    -webkit-transition: all 200ms;
+    -moz-transition: all 200ms;
+    -ms-transition: all 200ms;
+    -o-transition: all 200ms;
+    transition: all 200ms;
+}
+
+.twister-user .bio a:hover {
+    color: #e18881;
+    opacity: .8;
+}
+
 .followers
 {
     font-size: 12px;
@@ -1276,12 +1300,6 @@ textarea.splited-post {
     word-wrap: break-word;
 }
 
-.post-text samp {
-    background: #EEE;
-    padding-left: 2px;
-    padding-right: 2px;
-}
-
 .post-context {
     font-size: 11px;
     margin: 2px 16px 4px 60px;

theme_nin/css/style.css

@@ -273,6 +273,12 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   display: block;
 }
 
+samp {
+    background-color: #EEE;
+    padding-left: 2px;
+    padding-right: 2px;
+}
+
 /* FONTS */
 /* line 2, ../sass/_utils.sass */
 .clear-fix:after, .userMenu ul:after, .profile-modal .profile-data:after, .profile-card .twister-user-info:after, .forEdition.profile-card:after, .postboard:after, .following:after, .expanded-content:after, .following-list li:after, .twistday-reminder li:after, .mini-following-info:after, .network.singleBlock:after, .options .tab-content:after, .promoted-posts-only:after, .dashboard.right:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after, #postboard-top:after, #postboard-top .post-area:after, .who-to-follow ol:after, .toptrends ol:after, .twistday-reminder ol:after, .twister-user:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after {
@@ -881,12 +887,6 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   padding: 0;
 }
 
-.post-text samp {
-    background-color: #EEE;
-    padding-left: 2px;
-    padding-right: 2px;
-}
-
 /* line 138, ../sass/_postboard.sass */
 .post-context {
   font-size: 11px;

theme_nin/sass/_commons.sass

@@ -1,6 +1,6 @@
 *
   outline: none!important
-  
+
 li
   list-style: none
 
@@ -15,7 +15,7 @@ html, body
 br
   display: block
 
-img 
+img
   background: $main-background-color
   +border-radius(2px)
 
@@ -26,7 +26,7 @@ a
     color: $main-color-color
     text-decoration: none
 
-p 
+p
   padding: 5px 0
 
 
@@ -36,13 +36,16 @@ h2, h3
   letter-spacing: 0.07em
   font-weight: 500
   line-height: 1.8em
-  
+
+samp
+  background-color: #EEE
+  padding-left: 2px
+  padding-right: 2px
 
 
 textarea, input[type=text]
   font: .95em/1.3em $main-font-family
   font-weight: 400
-  
 
 /* isFollowing */
 
@@ -57,7 +60,7 @@ textarea, input[type=text]
   line-height: 10px
   &:hover
     text-decoration: none!important
-  h3 &  
+  h3 &
     display: none
 
 /************** BUTTONS ************/
@@ -68,7 +71,7 @@ button, a.button
   display: inline-block
   line-height: 1em
   font-weight: 500
-  margin: 0 
+  margin: 0
   float: none
   text-shadow: 2px 2px 0 rgba(black,0)
   +transition-property(background)

theme_nin/sass/_postboard.sass

@@ -138,10 +138,6 @@
     word-wrap: break-word
     min-height: 25px
     padding: 0
-    samp
-        background-color: #EEE
-        padding-left: 2px
-        padding-right: 2px
 
 .post-context
     font-size: 11px