From 0a69520d6452fad04beb7078e0046c848a6fabdd Mon Sep 17 00:00:00 2001
From: Karl Prieb <karl@prieb.me>
Date: Mon, 2 Jan 2017 19:42:08 -0200
Subject: [PATCH] create info-font-color classes
---
packages/rocketchat-emoji/emojiPicker.html | 2 +-
.../client/messageAttachment.html | 2 +-
packages/rocketchat-theme/server/colors.less | 75 ++++++++-----------
.../message/message.coffee | 5 +-
.../message/message.html | 10 +--
packages/rocketchat-ui/views/app/room.html | 2 +-
6 files changed, 45 insertions(+), 51 deletions(-)
diff --git a/packages/rocketchat-emoji/emojiPicker.html b/packages/rocketchat-emoji/emojiPicker.html
index 8f4c4395660..c711418b0fc 100644
--- a/packages/rocketchat-emoji/emojiPicker.html
+++ b/packages/rocketchat-emoji/emojiPicker.html
@@ -21,7 +21,7 @@
<ul class="filter-list">
{{#each category}}
<li class="filter-item {{activeCategory .}}" title="{{categoryName .}}">
- <a href="#{{.}}" class="category-link info-font-color"><i class="category-icon icon-{{.}}"></i></a>
+ <a href="#{{.}}" class="category-link color-info-font-color"><i class="category-icon icon-{{.}}"></i></a>
</li>
{{/each}}
</ul>
diff --git a/packages/rocketchat-message-attachments/client/messageAttachment.html b/packages/rocketchat-message-attachments/client/messageAttachment.html
index 7860efe8775..51a92296abf 100644
--- a/packages/rocketchat-message-attachments/client/messageAttachment.html
+++ b/packages/rocketchat-message-attachments/client/messageAttachment.html
@@ -3,7 +3,7 @@
<!-- <div>fallback: {{fallback}}</div> -->
{{pretext}}
<div class="attachment-block">
- <div class="attachment-block-border" style="background-color: {{color}}"></div>
+ <div class="attachment-block-border background-info-font-color" style="background-color: {{color}}"></div>
{{#if author_name}}
{{#if author_link}}
<div class="attachment-author">
diff --git a/packages/rocketchat-theme/server/colors.less b/packages/rocketchat-theme/server/colors.less
index 32b3f0be66b..80c69b52832 100755
--- a/packages/rocketchat-theme/server/colors.less
+++ b/packages/rocketchat-theme/server/colors.less
@@ -1,21 +1,3 @@
-.global-font-family {
- font-family: @body-font-family;
-}
-
-.color-primary-font-color {
- color: @primary-font-color;
-}
-
-.border-component-color {
- border-color: @component-color;
-}
-
-.code-colors {
- background-color: @code-background-color;
- border-color: @code-border-color;
- color: @code-font-color;
-}
-
/** ----------------------------------------------------------------------------
* Derivative colours (fixed variants of inherited variables)
*/
@@ -38,6 +20,36 @@
@code-border-color: #cccccc;
@code-font-color: #333333;
+/** ----------------------------------------------------------------------------
+ * Transparency variables
+ */
+
+.global-font-family {
+ font-family: @body-font-family;
+}
+
+.color-primary-font-color {
+ color: @primary-font-color;
+}
+
+.border-component-color {
+ border-color: @component-color;
+}
+
+.code-colors {
+ background-color: @code-background-color;
+ border-color: @code-border-color;
+ color: @code-font-color;
+}
+
+.color-info-font-color {
+ color: @info-font-color;
+}
+
+.background-info-font-color {
+ background-color: @info-font-color;
+}
+
/** ----------------------------------------------------------------------------
* Transparency variables
*/
@@ -133,10 +145,6 @@
background-color: @transparent-lighter;
}
-/** ----------------------------------------------------------------------------
- * Document components
- */
-
.filter-item {
border-color: @secondary-background-color;
@@ -149,9 +157,9 @@
}
}
-.info-font-color {
- color: @info-font-color;
-}
+/** ----------------------------------------------------------------------------
+ * Document components
+ */
.secondary-background-color {
background-color: @secondary-background-color;
@@ -578,10 +586,6 @@ a:hover {
}
.messages-box {
- .start {
- color: @info-font-color;
- }
-
.editing .body,
textarea.editing {
background-color: lighten(@pending-color, 40%);
@@ -616,10 +620,6 @@ a:hover {
color: @primary-font-color;
}
- &.system .body {
- color: @info-font-color;
- }
-
.toggle-options {
color: @secondary-font-color;
}
@@ -642,11 +642,9 @@ a:hover {
background-color: @content-background-color;
}
- &.new-day::after,
.info,
.user-view,
.message-alias {
- color: @info-font-color;
border-color: @component-color;
}
@@ -656,7 +654,6 @@ a:hover {
.is-bot,
.role-tag {
- background-color: @info-font-color;
color: contrast(@info-font-color);
}
@@ -681,12 +678,6 @@ a:hover {
.highlight-text {
background-color: @selection-background;
}
-
- .attachment {
- .attachment-block-border {
- background-color: @info-font-color;
- }
- }
}
/** ----------------------------------------------------------------------------
diff --git a/packages/rocketchat-ui-message/message/message.coffee b/packages/rocketchat-ui-message/message/message.coffee
index 48a688d0f71..2c05788f8de 100644
--- a/packages/rocketchat-ui-message/message/message.coffee
+++ b/packages/rocketchat-ui-message/message/message.coffee
@@ -32,8 +32,11 @@ Template.message.helpers
return 'temp'
body: ->
return Template.instance().body
- system: ->
+ system: (returnClass) ->
if RocketChat.MessageTypes.isSystemMessage(this)
+ if returnClass
+ return 'color-info-font-color'
+
return 'system'
edited: ->
return Template.instance().wasEdited
diff --git a/packages/rocketchat-ui-message/message/message.html b/packages/rocketchat-ui-message/message/message.html
index 5ce8b8995a0..e0436bf27e4 100644
--- a/packages/rocketchat-ui-message/message/message.html
+++ b/packages/rocketchat-ui-message/message/message.html
@@ -25,16 +25,16 @@
{{/if}}
{{/if}}
{{#if alias}}
- <button type="button" class="user user-card-message" data-username="{{u.username}}" tabindex="1">{{alias}} <span class="message-alias">@{{u.username}}</span></button>
+ <button type="button" class="user user-card-message" data-username="{{u.username}}" tabindex="1">{{alias}} <span class="message-alias color-info-font-color">@{{u.username}}</span></button>
{{else}}
<button type="button" class="user user-card-message" data-username="{{u.username}}" tabindex="1">{{u.username}}</button>
{{/if}}
- <span class="info">
+ <span class="info color-info-font-color">
{{#each roleTags}}
- <span class="role-tag" data-role="{{description}}">{{description}}</span>
+ <span class="role-tag background-info-font-color" data-role="{{description}}">{{description}}</span>
{{/each}}
{{#if isBot}}
- <span class="is-bot">BOT</span>
+ <span class="is-bot background-info-font-color">BOT</span>
{{/if}}
<span class="time" title='{{date}} {{time}}'>{{time}}</span>
{{#if edited}}
@@ -50,7 +50,7 @@
<i class="icon-cog message-cog" aria-label="{{_ "Actions"}}"></i>
</div>
</span>
- <div class="body" dir="auto">
+ <div class="body {{system true}}" dir="auto">
{{{body}}}
{{#if hasOembed}}
{{#each urls}}
diff --git a/packages/rocketchat-ui/views/app/room.html b/packages/rocketchat-ui/views/app/room.html
index ed71415adc8..2f6db29b976 100644
--- a/packages/rocketchat-ui/views/app/room.html
+++ b/packages/rocketchat-ui/views/app/room.html
@@ -86,7 +86,7 @@
{{> loading}}
</li>
{{else}}
- <li class="start">
+ <li class="start color-info-font-color">
{{_ "Start_of_conversation"}}
</li>
{{/if}}
--
GitLab