Commit d04a7df2 authored by JC Brand's avatar JC Brand

Update room features markup to use font awesome

parent 181b1836
...@@ -6249,10 +6249,6 @@ body.reset { ...@@ -6249,10 +6249,6 @@ body.reset {
#conversejs .chatroom .box-flyout .chatroom-body .occupants .occupants-heading { #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupants-heading {
padding: 0.3em 0; padding: 0.3em 0;
font-weight: bold; } font-weight: bold; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature {
font-size: 12px;
width: 100%; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants .chatroom-features, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants .chatroom-features,
#conversejs .chatroom .box-flyout .chatroom-body .occupants .chatroom-features { #conversejs .chatroom .box-flyout .chatroom-body .occupants .chatroom-features {
width: 100%; } width: 100%; }
...@@ -6284,6 +6280,12 @@ body.reset { ...@@ -6284,6 +6280,12 @@ body.reset {
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list {
padding-top: 0; } padding-top: 0; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature {
width: 100%; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature .fa,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature .fa {
color: #777; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li {
cursor: default; cursor: default;
...@@ -6293,10 +6295,9 @@ body.reset { ...@@ -6293,10 +6295,9 @@ body.reset {
padding: 0.2em 0.5em 0.2em 0; padding: 0.2em 0.5em 0.2em 0;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; } white-space: nowrap; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li [class^="icon-"], #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li [class*=" icon-"], #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li .fa,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li [class^="icon-"], #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li .fa {
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li [class*=" icon-"] { margin-right: 0.5em; }
padding-right: 0.5em; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature {
font-size: 10px; } font-size: 10px; }
......
...@@ -6366,10 +6366,6 @@ body { ...@@ -6366,10 +6366,6 @@ body {
#conversejs .chatroom .box-flyout .chatroom-body .occupants .occupants-heading { #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupants-heading {
padding: 0.3em 0; padding: 0.3em 0;
font-weight: bold; } font-weight: bold; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature {
font-size: 14px;
width: 100%; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants .chatroom-features, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants .chatroom-features,
#conversejs .chatroom .box-flyout .chatroom-body .occupants .chatroom-features { #conversejs .chatroom .box-flyout .chatroom-body .occupants .chatroom-features {
width: 100%; } width: 100%; }
...@@ -6401,6 +6397,12 @@ body { ...@@ -6401,6 +6397,12 @@ body {
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list {
padding-top: 0; } padding-top: 0; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature {
width: 100%; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature .fa,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul.features-list .feature .fa {
color: #777; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li {
cursor: default; cursor: default;
...@@ -6410,10 +6412,9 @@ body { ...@@ -6410,10 +6412,9 @@ body {
padding: 0.2em 0.5em 0.2em 0; padding: 0.2em 0.5em 0.2em 0;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; } white-space: nowrap; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li [class^="icon-"], #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li [class*=" icon-"], #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li .fa,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li [class^="icon-"], #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li .fa {
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li [class*=" icon-"] { margin-right: 0.5em; }
padding-right: 0.5em; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.feature,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.feature {
font-size: 10px; } font-size: 10px; }
......
...@@ -153,15 +153,6 @@ ...@@ -153,15 +153,6 @@
font-weight: bold; font-weight: bold;
} }
ul {
li {
&.feature {
font-size: $font-size-small;
width: 100%;
}
}
}
.chatroom-features { .chatroom-features {
width: 100%; width: 100%;
.feature { .feature {
...@@ -194,6 +185,12 @@ ...@@ -194,6 +185,12 @@
} }
&.features-list { &.features-list {
padding-top: 0; padding-top: 0;
.feature {
width: 100%;
.fa {
color: $text-color;
}
}
} }
li { li {
cursor: default; cursor: default;
...@@ -203,8 +200,8 @@ ...@@ -203,8 +200,8 @@
padding: 0.2em 0.5em 0.2em 0; padding: 0.2em 0.5em 0.2em 0;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
[class^="icon-"], [class*=" icon-"] { .fa {
padding-right: 0.5em; margin-right: 0.5em;
} }
&.feature { &.feature {
font-size: $font-size-tiny; font-size: $font-size-tiny;
......
...@@ -3,42 +3,42 @@ ...@@ -3,42 +3,42 @@
{[ } ]} {[ } ]}
<ul class="features-list"> <ul class="features-list">
{[ if (o.passwordprotected) { ]} {[ if (o.passwordprotected) { ]}
<li class="feature" title="{{{ o.tt_passwordprotected }}}"><span class="icon-lock"></span>{{{ o.label_passwordprotected }}}</li> <li class="feature" title="{{{ o.tt_passwordprotected }}}"><span class="fa fa-lock"></span>{{{ o.label_passwordprotected }}}</li>
{[ } ]} {[ } ]}
{[ if (o.unsecured) { ]} {[ if (o.unsecured) { ]}
<li class="feature" title="{{{ o.tt_unsecured }}}"><span class="icon-unlocked"></span>{{{ o.label_unsecured }}}</li> <li class="feature" title="{{{ o.tt_unsecured }}}"><span class="fa fa-unlock"></span>{{{ o.label_unsecured }}}</li>
{[ } ]} {[ } ]}
{[ if (o.hidden) { ]} {[ if (o.hidden) { ]}
<li class="feature" title="{{{ o.tt_hidden }}}"><span class="icon-eye-blocked"></span>{{{ o.label_hidden }}}</li> <li class="feature" title="{{{ o.tt_hidden }}}"><span class="fa fa-eye-slash"></span>{{{ o.label_hidden }}}</li>
{[ } ]} {[ } ]}
{[ if (o.public_room) { ]} {[ if (o.public_room) { ]}
<li class="feature" title="{{{ o.tt_public }}}"><span class="icon-eye"></span>{{{ o.label_public }}}</li> <li class="feature" title="{{{ o.tt_public }}}"><span class="fa fa-eye"></span>{{{ o.label_public }}}</li>
{[ } ]} {[ } ]}
{[ if (o.membersonly) { ]} {[ if (o.membersonly) { ]}
<li class="feature" title="{{{ o.tt_membersonly }}}"><span class="icon-address-book"></span>{{{ o.label_membersonly }}}</li> <li class="feature" title="{{{ o.tt_membersonly }}}"><span class="fa fa-address-book"></span>{{{ o.label_membersonly }}}</li>
{[ } ]} {[ } ]}
{[ if (o.open) { ]} {[ if (o.open) { ]}
<li class="feature" title="{{{ o.tt_open }}}"><span class="icon-globe"></span>{{{ o.label_open }}}</li> <li class="feature" title="{{{ o.tt_open }}}"><span class="fa fa-globe"></span>{{{ o.label_open }}}</li>
{[ } ]} {[ } ]}
{[ if (o.persistent) { ]} {[ if (o.persistent) { ]}
<li class="feature" title="{{{ o.tt_persistent }}}"><span class="icon-save"></span>{{{ o.label_persistent }}}</li> <li class="feature" title="{{{ o.tt_persistent }}}"><span class="fa fa-save"></span>{{{ o.label_persistent }}}</li>
{[ } ]} {[ } ]}
{[ if (o.temporary) { ]} {[ if (o.temporary) { ]}
<li class="feature" title="{{{ o.tt_temporary }}}"><span class="icon-snowflake"></span>{{{ o.label_temporary }}}</li> <li class="feature" title="{{{ o.tt_temporary }}}"><span class="fa fa-snowflake"></span>{{{ o.label_temporary }}}</li>
{[ } ]} {[ } ]}
{[ if (o.nonanonymous) { ]} {[ if (o.nonanonymous) { ]}
<li class="feature" title="{{{ o.tt_nonanonymous }}}"><span class="icon-idcard-dark"></span>{{{ o.label_nonanonymous }}}</li> <li class="feature" title="{{{ o.tt_nonanonymous }}}"><span class="fa fa-idcard-dark"></span>{{{ o.label_nonanonymous }}}</li>
{[ } ]} {[ } ]}
{[ if (o.semianonymous) { ]} {[ if (o.semianonymous) { ]}
<li class="feature" title="{{{ o.tt_semianonymous }}}"><span class="icon-info"></span>{{{ o.label_semianonymous }}}</li> <li class="feature" title="{{{ o.tt_semianonymous }}}"><span class="fa fa-user-secret"></span>{{{ o.label_semianonymous }}}</li>
{[ } ]} {[ } ]}
{[ if (o.moderated) { ]} {[ if (o.moderated) { ]}
<li class="feature" title="{{{ o.tt_moderated }}}"><span class="icon-legal"></span>{{{ o.label_moderated }}}</li> <li class="feature" title="{{{ o.tt_moderated }}}"><span class="fa fa-gavel"></span>{{{ o.label_moderated }}}</li>
{[ } ]} {[ } ]}
{[ if (o.unmoderated) { ]} {[ if (o.unmoderated) { ]}
<li class="feature" title="{{{ o.tt_unmoderated }}}"><span class="icon-info"></span>{{{ o.label_unmoderated }}}</li> <li class="feature" title="{{{ o.tt_unmoderated }}}"><span class="fa fa-info-circle"></span>{{{ o.label_unmoderated }}}</li>
{[ } ]} {[ } ]}
{[ if (o.mam_enabled) { ]} {[ if (o.mam_enabled) { ]}
<li class="feature" title="{{{ o.tt_mam_enabled }}}"><span class="icon-database"></span>{{{ o.label_mam_enabled }}}</li> <li class="feature" title="{{{ o.tt_mam_enabled }}}"><span class="fa fa-database"></span>{{{ o.label_mam_enabled }}}</li>
{[ } ]} {[ } ]}
</ul> </ul>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment