thegamer/Cable-Desktop
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Better RTL languages support:

Browse source 
- Fixed text alignment in RTL messages.
- Added support for search box.
- Added support for conversation name.
- Added support for contact name.
- Added support for last message timestamp and last message preview.

//FREEBIE
This commit is contained in:
bitim 2016-07-05 03:54:02 +03:00 committed by lilia
parent 61e7b685e6
commit a1eccc2c49
2 changed files with 14 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
background.html
View file

@ -20,7 +20,7 @@
</div>
<h1>Signal</h1>
<div class='tool-bar clearfix'>
<input type='search' class='search' placeholder='{{ searchForPeopleOrGroups }}'>
<input type='search' class='search' placeholder='{{ searchForPeopleOrGroups }}' dir='auto'>
<span class='search-icon'></span>
</div>
</div>
@ -80,7 +80,7 @@
</div>
<span class='conversation-title'>
{{ #name }}
<span class='conversation-name'>{{ name }}</span>
<span class='conversation-name' dir='auto'>{{ name }}</span>
{{ /name }}
{{ #number }}
<span class='conversation-number'>{{ number }}</span>
@ -136,7 +136,7 @@
<script type='text/x-tmpl-mustache' id='message'>
{{> avatar }}
<div class='bubble' style='background-color: {{ avatar.color }};'>
<div class='sender'>{{ sender }}</div>
<div class='sender' dir='auto'>{{ sender }}</div>
<div class='attachments'></div>
<p class='content' dir='auto'>{{ message }}</p>
<div class='meta'>
@ -179,7 +179,7 @@
<span>{{ name }}</span><span class='remove'>x</span>
</script>
<script type='text/x-tmpl-mustache' id='contact_name_and_number'>
<h3 class='name'> {{ title }} </h3>
<h3 class='name' dir='auto'> {{ title }} </h3>
<div class='number'>{{ number }}</div>
</script>
<script type='text/x-tmpl-mustache' id='contact'>
@ -195,13 +195,13 @@
<script type='text/x-tmpl-mustache' id='conversation-preview'>
{{> avatar }}
<div class='contact-details'>
<span class='last-timestamp' data-timestamp={{ last_message_timestamp }}> </span>
<span class='last-timestamp' data-timestamp={{ last_message_timestamp }} dir='auto'> </span>
{{> contact_name_and_number }}
{{ #unreadCount }}
<span class='unread-count'>{{ unreadCount }}</span>
{{ /unreadCount }}
{{ #last_message }}
<p class='last-message'> {{ last_message }} </p>
<p class='last-message' dir='auto'> {{ last_message }} </p>
{{ /last_message }}
</div>
</script>
@ -304,7 +304,7 @@
<script type='text/x-tmpl-mustache' id='recipients-input'>
<div class='recipients-container'>
<span class='recipients'></span>
<input type='text' class='search' placeholder='{{ placeholder }}' />
<input type='text' class='search' placeholder='{{ placeholder }}' dir='auto' />
</div>
<div class='results'>
<div class='new-contact contact hide'></div>
@ -330,7 +330,7 @@
<span class='error-icon'></span>
</div>
{{ /errors }}
<span class='name'>{{ name }}</span>
<span class='name' dir='auto'>{{ name }}</span>
{{ #errors }}
{{ #message }}
<p class='error-message'>{{message}}</p>

9
stylesheets/manifest.css
View file

@ -276,7 +276,8 @@ img.emoji {
vertical-align: middle;
display: inline-block;
margin: 0 0 0 8px;
width: calc(100% - 44px - 8px - 4px); }
width: calc(100% - 44px - 8px - 4px);
text-align: left; }
.contact-details p {
overflow-x: hidden;
text-overflow: ellipsis; }
@ -286,7 +287,8 @@ img.emoji {
font-size: 1em;
font-weight: 400;
text-overflow: ellipsis;
overflow-x: hidden; }
overflow-x: hidden;
text-align: left; }
.contact-details .number {
color: #616161;
font-size: small; }
@ -977,7 +979,8 @@ li.entry .error-icon-container {
box-shadow: 0 3px 3px -4px black;
word-wrap: break-word;
margin-left: 8px;
max-width: 30em; }
max-width: 30em;
text-align: -webkit-auto; }
@media (max-width: 899px) {
.message-container .bubble,
.message-list .bubble {