diff --git a/packages/rocketchat-ui-account/client/accountFlex.html b/packages/rocketchat-ui-account/client/accountFlex.html
index 1a46bf3a9856974bb82010e78dab428ce7159e90..1e6b2afbfa1ace4710de65772efdc969d2ab77c6 100644
--- a/packages/rocketchat-ui-account/client/accountFlex.html
+++ b/packages/rocketchat-ui-account/client/accountFlex.html
@@ -4,7 +4,7 @@
{{> accountBox lighten=true }}
<button class="sidebar-flex__back-button sidebar-flex-content-active" data-action="back">
<svg class="sidebar-flex__back-icon">
- <use xlink:href="/images/icons.svg#arrow-back"></use>
+ <use href="#icon-arrow-back"></use>
</svg>
<span>Back to chat</span>
</button>
diff --git a/packages/rocketchat-ui-admin/client/adminFlex.html b/packages/rocketchat-ui-admin/client/adminFlex.html
index 5f9da86521a30de912fb63a0ca6d37e89ae94355..8b132c73f0088f7521cc4e47f1e55adedb65ef42 100644
--- a/packages/rocketchat-ui-admin/client/adminFlex.html
+++ b/packages/rocketchat-ui-admin/client/adminFlex.html
@@ -4,7 +4,7 @@
{{> accountBox lighten=true }}
<button class="sidebar-flex__back-button sidebar-flex-content-active" data-action="back">
<svg class="sidebar-flex__back-icon">
- <use xlink:href="/images/icons.svg#arrow-back"></use>
+ <use href="#icon-arrow-back"></use>
</svg>
<span>Back to chat</span>
</button>
@@ -40,7 +40,7 @@
<div class="rc-input__wrapper">
<div class="rc-input__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--magnifier">
- <use href="/images/icons.svg#magnifier"></use>
+ <use href="#icon-magnifier"></use>
</svg>
</div>
<input type="text" class="rc-input__element rc-input__element--small" name="settings-search" placeholder="{{_ 'Search'}}">
diff --git a/packages/rocketchat-ui-master/package.js b/packages/rocketchat-ui-master/package.js
index 4a0509d0723dee61caee4dba7f85f295622ddcbc..692e8613a485bdfa34faac42e8ba272993611e0f 100644
--- a/packages/rocketchat-ui-master/package.js
+++ b/packages/rocketchat-ui-master/package.js
@@ -31,4 +31,6 @@ Package.onUse(function(api) {
api.addFiles('client/main.js', 'client');
api.addFiles('server/inject.js', 'server');
+ api.addAssets('public/icons.svg', 'server');
+ api.addAssets('public/loading.css', 'server');
});
diff --git a/packages/rocketchat-ui-master/public/icons.svg b/packages/rocketchat-ui-master/public/icons.svg
new file mode 100644
index 0000000000000000000000000000000000000000..d9eb297d342990750a2b0fe5ef2779f262dc9ee2
--- /dev/null
+++ b/packages/rocketchat-ui-master/public/icons.svg
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" display="none">
+ <symbol id="icon-arrow-down" viewBox="0 0 10 6"><title>arrow-down</title><path d="M8.657.828L4.828 4.657 1 .828" stroke-width="1.5" fill="none"/></symbol>
+ <symbol id="icon-arrow-back" viewBox="0 0 20 14"><title>arrow-back</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M8 13.071L1.929 7 8 .929"/><path d="M3 7h14.003C18.106 7 19 7.89 19 9v3.5"/></g></symbol>
+ <symbol id="icon-at" viewBox="0 0 16 16"><title>at</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><circle cx="7" cy="7" r="3"/><path d="M9.68 13.469A7 7 0 1 1 14 7v.542"/><path d="M14 7.49c0 1.387-.781 2.51-2 2.51-1.219 0-2-1.112-2-2.51V3"/></g></symbol>
+ <symbol id="icon-cross" viewBox="0 0 12 12"><title>cross</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M10.243 1.757l-8.486 8.486M1.757 1.757l8.486 8.486"/></g></symbol>
+ <symbol id="icon-customize" viewBox="0 0 16 16"><title>customize</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M0 7h8m4 0h2M0 2h2m3.996 0H14M0 12h3m4 0h7" stroke-linecap="square"/><circle cx="4" cy="2" r="2"/><circle cx="10" cy="7" r="2"/><circle cx="5" cy="12" r="2"/></g></symbol>
+ <symbol id="icon-hashtag" viewBox="0 0 16 16"><title>hashtag</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M5 1v14M11 1v14M1 5h14M1 11h14"/></g></symbol>
+ <symbol id="icon-lock" viewBox="0 0 14 20"><title>lock</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M1 9h12v10H1zM3 5c0-2.21 1.795-4 4-4 2.21 0 4 1.795 4 4v4H3V5z"/></g></symbol>
+ <symbol id="icon-magnifier" viewBox="0 0 19 19"><title>magnifier</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><circle cx="6.5" cy="6.5" r="6.5"/><path d="M17 17l-5-5" stroke-linecap="square"/></g></symbol>
+ <symbol id="icon-plus" viewBox="0 0 14 14"><title>plus</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M7 1v12M13 7H1"/></g></symbol>
+ <symbol id="icon-user" viewBox="0 0 18 19"><title>user</title><path d="M1 16.832c0-4.948 6-3.958 6-5.937 0 0 .115-1.314-.546-1.98C5.63 8.092 5 7.102 5 5.454 5 2.993 6.79 1 9 1s4 1.994 4 4.453c0 1.625-.614 2.637-1.474 3.463-.628.648-.526 1.979-.526 1.979 0 1.979 6 .99 6 5.937 0 0-1.593 1.168-8 1.168s-8-1.168-8-1.168z" stroke-width="1.5" fill="none" fill-rule="evenodd"/></symbol>
+ <symbol id="icon-user-rounded" viewBox="0 0 18 18"><title>user-rounded</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><rect x=".75" y=".75" width="16.5" height="16.5" rx="2"/><path d="M3.002 17c0-3.75 4.499-3 4.499-4.5 0 0 .086-.996-.41-1.5-.618-.625-1.09-1.376-1.09-2.625C6.001 6.511 7.344 5 9 5c1.656 0 2.999 1.511 2.999 3.375 0 1.232-.46 2-1.105 2.625-.471.491-.395 1.5-.395 1.5 0 1.5 4.499.75 4.499 4.5"/></g></symbol>
+ <symbol id="icon-warning" viewBox="0 0 20 20"><title>warning</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M10 3l8 14H2z"/><path d="M10 9v5" stroke-linecap="square"/></g></symbol>
+</svg>
diff --git a/packages/rocketchat-ui-master/public/loading.css b/packages/rocketchat-ui-master/public/loading.css
new file mode 100644
index 0000000000000000000000000000000000000000..75be16552fded89ffd7899e641f7f2654b51e048
--- /dev/null
+++ b/packages/rocketchat-ui-master/public/loading.css
@@ -0,0 +1,56 @@
+.loading-animation {
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ display: flex;
+ align-items: center;
+ position: absolute;
+ justify-content: center;
+ text-align: center;
+}
+
+.loading-animation > div {
+ width: 10px;
+ height: 10px;
+ margin: 2px;
+ border-radius: 100%;
+ display: inline-block;
+ background-color: rgba(255, 255, 255, 0.6);
+ -webkit-animation: loading-bouncedelay 1.4s infinite ease-in-out both;
+ animation: loading-bouncedelay 1.4s infinite ease-in-out both;
+}
+
+.loading-animation .bounce1 {
+ -webkit-animation-delay: -0.32s;
+ animation-delay: -0.32s;
+}
+
+.loading-animation .bounce2 {
+ -webkit-animation-delay: -0.16s;
+ animation-delay: -0.16s;
+}
+
+@-webkit-keyframes loading-bouncedelay {
+ 0%,
+ 80%,
+ 100% {
+ -webkit-transform: scale(0);
+ }
+
+ 40% {
+ -webkit-transform: scale(1);
+ }
+}
+
+@keyframes loading-bouncedelay {
+ 0%,
+ 80%,
+ 100% {
+ transform: scale(0);
+ }
+
+ 40% {
+ transform: scale(1);
+ }
+}
diff --git a/packages/rocketchat-ui-master/server/dynamic-css.js b/packages/rocketchat-ui-master/server/dynamic-css.js
index 8aa6ca95108b344d2b3c10ae63b6b268650fa160..3021846b2f822cbdf30312d27c57e488de91e79a 100644
--- a/packages/rocketchat-ui-master/server/dynamic-css.js
+++ b/packages/rocketchat-ui-master/server/dynamic-css.js
@@ -45,9 +45,9 @@ export default () => {
const properties = [fontFamily, colors, customCss];
const run = list => {
return list.filter(setting => setting.value && setting.properties || setting.type !== 'color')
- .sort((a, b) => a._id.length - b._id.length)
- .map(setting => properties.reduce((ret, f) => ret || f(setting), ''))
- .join('\n');
+ .sort((a, b) => a._id.length - b._id.length)
+ .map(setting => properties.reduce((ret, f) => ret || f(setting), ''))
+ .join('\n');
};
DynamicCss.run = debounce(() => {
diff --git a/packages/rocketchat-ui-master/server/inject.js b/packages/rocketchat-ui-master/server/inject.js
index 7671e7a0f3453b86066c22f0cff470f53eee6f77..3e0c9a342a4a2c72e122c6064645a7c8f74ee477 100644
--- a/packages/rocketchat-ui-master/server/inject.js
+++ b/packages/rocketchat-ui-master/server/inject.js
@@ -17,50 +17,9 @@ RocketChat.models.Settings.find({_id:/theme-/}, {fields: { value: 1, properties:
Inject.rawHead('dynamic', `<script>(${ require('./dynamic-css.js').default.toString() })()</script>`);
-Inject.rawHead('page-loading', `
-<style>
-.loading-animation {
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- display: flex;
- align-items: center;
- position: absolute;
- justify-content: center;
- text-align: center;
-}
-.loading-animation > div {
- width: 10px;
- height: 10px;
- margin: 2px;
- border-radius: 100%;
- display: inline-block;
- background-color: rgba(255,255,255,0.6);
- -webkit-animation: loading-bouncedelay 1.4s infinite ease-in-out both;
- animation: loading-bouncedelay 1.4s infinite ease-in-out both;
-}
-.loading-animation .bounce1 {
- -webkit-animation-delay: -0.32s;
- animation-delay: -0.32s;
-}
-.loading-animation .bounce2 {
- -webkit-animation-delay: -0.16s;
- animation-delay: -0.16s;
-}
-@-webkit-keyframes loading-bouncedelay {
- 0%,
- 80%,
- 100% { -webkit-transform: scale(0) }
- 40% { -webkit-transform: scale(1.0) }
-}
-@keyframes loading-bouncedelay {
- 0%,
- 80%,
- 100% { transform: scale(0); }
- 40% { transform: scale(1.0); }
-}
-</style>`);
+Inject.rawHead('page-loading', `<style>${ Assets.getText('public/loading.css') }</style>`);
+
+Inject.rawBody('icons', Assets.getText('public/icons.svg'));
Inject.rawBody('page-loading-div', `
<div id="initial-page-loading" class="page-loading">
diff --git a/packages/rocketchat-ui-sidenav/client/accountBox.html b/packages/rocketchat-ui-sidenav/client/accountBox.html
index e25f33ef5f900f1908c1534b74650fc79dd5e543..4eafbb1c95155262e3f86fa5817ded0e70094f77 100644
--- a/packages/rocketchat-ui-sidenav/client/accountBox.html
+++ b/packages/rocketchat-ui-sidenav/client/accountBox.html
@@ -51,7 +51,7 @@
<ul class="rc-popover__list">
<li class="rc-popover__item" data-action="open" data-open="administration">
<svg class="rc-popover__item-icon rc-popover__item-icon--customize">
- <use xlink:href="/images/icons.svg#customize"></use>
+ <use href="#icon-customize"></use>
</svg>
<span>{{_ "Administration"}}</span>
</li>
@@ -64,7 +64,7 @@
<div class="sidebar__account-status-bullet {{bullet}}" title="{{visualStatus}}"></div>
<div class="sidebar__account-username">{{visualStatus}}</div>
<svg class="sidebar__account-arrow">
- <use xlink:href="/images/icons.svg#arrow-down"></use>
+ <use href="#icon-arrow-down"></use>
</svg>
</label>
</div>
diff --git a/packages/rocketchat-ui-sidenav/client/sidebarItem.html b/packages/rocketchat-ui-sidenav/client/sidebarItem.html
index 88f767b4ba92bccd72de7ba2f65066eb404bc8c7..2ae379e6ced9511fe8d687e22bf0ff1c6e062e9f 100644
--- a/packages/rocketchat-ui-sidenav/client/sidebarItem.html
+++ b/packages/rocketchat-ui-sidenav/client/sidebarItem.html
@@ -7,7 +7,7 @@
<div class="sidebar-item__picture">
{{#if icon}}
<svg class="sidebar-item__icon sidebar-item__icon--{{icon}}">
- <use xlink:href="/images/icons.svg#{{icon}}"></use>
+ <use href="#icon-{{icon}}"></use>
</svg>
{{else}}
<div class="sidebar-item__user-thumb">
diff --git a/packages/rocketchat-ui-sidenav/client/toolbar.html b/packages/rocketchat-ui-sidenav/client/toolbar.html
index 9456527925df9993064943c6d3319d478f6b05f5..817696a001a69206f80aed3cc33c9283ecb41127 100644
--- a/packages/rocketchat-ui-sidenav/client/toolbar.html
+++ b/packages/rocketchat-ui-sidenav/client/toolbar.html
@@ -7,13 +7,13 @@
<div class="rc-input__wrapper">
<div class="rc-input__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--magnifier">
- <use href="/images/icons.svg#magnifier"></use>
+ <use href="#icon-magnifier"></use>
</svg>
</div>
<input type="text" class="rc-input__element rc-input__element--small" placeholder="{{getPlaceholder}}">
<div class="rc-input__icon rc-input__icon--right">
<svg class="rc-input__icon-svg rc-input__icon-svg--cross">
- <use href="/images/icons.svg#cross"></use>
+ <use href="#icon-cross"></use>
</svg>
</div>
</div>
@@ -23,7 +23,7 @@
{{#if canCreate}}
<button class="rc-button rc-button--square rc-tooltip" aria-label="{{ _ 'Create_A_New_Channel' }}">
<svg class="toolbar__icon toolbar__search-create-channel">
- <use xlink:href="/images/icons.svg#plus"></use>
+ <use href="#icon-plus"></use>
</svg>
</button>
{{/if}}
diff --git a/packages/rocketchat-ui/client/components/selectDropdown.html b/packages/rocketchat-ui/client/components/selectDropdown.html
index a5fe2b0552a1a076a9d689b4b7421fd8102fd6e8..8e177d84bd9ca1ba6bdfd96621062301fee75697 100644
--- a/packages/rocketchat-ui/client/components/selectDropdown.html
+++ b/packages/rocketchat-ui/client/components/selectDropdown.html
@@ -5,7 +5,7 @@
<div class="rc-input__wrapper">
<div class="rc-input__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--at">
- <use href="/images/icons.svg#at"></use>
+ <use href="#icon-at"></use>
</svg>
</div>
{{ selectedUsers }}
diff --git a/packages/rocketchat-ui/client/views/app/createChannel.html b/packages/rocketchat-ui/client/views/app/createChannel.html
index 9dcc517af20bd4771cd3afa39b4a3ab47b1f01f7..de572d396613e82793ec3332c69db49c2e9a7157 100644
--- a/packages/rocketchat-ui/client/views/app/createChannel.html
+++ b/packages/rocketchat-ui/client/views/app/createChannel.html
@@ -38,7 +38,7 @@
<div class="rc-input__wrapper">
<div class="rc-input__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--{{iconType}}">
- <use href="/images/icons.svg#{{iconType}}"></use>
+ <use href="#icon-{{iconType}}"></use>
</svg>
</div>
<input name="name" type="text" class="rc-input__element" placeholder="Type channel name" autofocus>
@@ -49,7 +49,7 @@
<div class="rc-input__error">
<div class="rc-input__error-icon">
<svg class="rc-input__error-icon-svg rc-input__error-icon--warning">
- <use href="/images/icons.svg#warning"></use>
+ <use href="#icon-warning"></use>
</svg>
</div>
<div class="rc-input__error-message">canal já existe</div>
@@ -62,7 +62,7 @@
<div class="rc-input__wrapper">
<div class="rc-input__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--at">
- <use href="/images/icons.svg#at"></use>
+ <use href="#icon-at"></use>
</svg>
</div>
<div class="rc-tags">
@@ -73,7 +73,7 @@
</span>
<span class="rc-tags__tag-username">{{user}}</span>
<svg class="rc-tags__tag-icon">
- <use href="/images/icons.svg#cross"></use>
+ <use href="#icon-cross"></use>
</svg>
</span>
{{/each}}
diff --git a/packages/rocketchat-ui/client/views/app/fullModal.html b/packages/rocketchat-ui/client/views/app/fullModal.html
index 0b412f25101ecdd2d714480ac54e1e5cb6b804b8..f5eeb1842e598c938707268e063497395e10ede0 100644
--- a/packages/rocketchat-ui/client/views/app/fullModal.html
+++ b/packages/rocketchat-ui/client/views/app/fullModal.html
@@ -4,7 +4,7 @@
<button class="full-modal__back-button sidebar-content">
<span class="full-modal__back-text">{{_ "Cancel"}}</span>
<svg class="full-modal__back-icon">
- <use href="/images/icons.svg#cross"></use>
+ <use href="#icon-cross"></use>
</svg>
</button>
{{> Template.dynamic template=template}}
diff --git a/public/images/icons.svg b/public/images/icons.svg
deleted file mode 100644
index cbfaef433755b04ae7f281375061dc38193b0e30..0000000000000000000000000000000000000000
--- a/public/images/icons.svg
+++ /dev/null
@@ -1,15 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<svg xmlns="http://www.w3.org/2000/svg">
-<symbol id="arrow-down" viewBox="0 0 10 6"><title>arrow-down</title><path d="M8.657.828L4.828 4.657 1 .828" stroke-width="1.5" fill="none"/></symbol>
-<symbol id="arrow-back" viewBox="0 0 20 14"><title>arrow-back</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M8 13.071L1.929 7 8 .929"/><path d="M3 7h14.003C18.106 7 19 7.89 19 9v3.5"/></g></symbol>
-<symbol id="at" viewBox="0 0 16 16"><title>at</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><circle cx="7" cy="7" r="3"/><path d="M9.68 13.469A7 7 0 1 1 14 7v.542"/><path d="M14 7.49c0 1.387-.781 2.51-2 2.51-1.219 0-2-1.112-2-2.51V3"/></g></symbol>
-<symbol id="cross" viewBox="0 0 12 12"><title>cross</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M10.243 1.757l-8.486 8.486M1.757 1.757l8.486 8.486"/></g></symbol>
-<symbol id="customize" viewBox="0 0 16 16"><title>customize</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M0 7h8m4 0h2M0 2h2m3.996 0H14M0 12h3m4 0h7" stroke-linecap="square"/><circle cx="4" cy="2" r="2"/><circle cx="10" cy="7" r="2"/><circle cx="5" cy="12" r="2"/></g></symbol>
-<symbol id="hashtag" viewBox="0 0 16 16"><title>hashtag</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M5 1v14M11 1v14M1 5h14M1 11h14"/></g></symbol>
-<symbol id="lock" viewBox="0 0 14 20"><title>lock</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M1 9h12v10H1zM3 5c0-2.21 1.795-4 4-4 2.21 0 4 1.795 4 4v4H3V5z"/></g></symbol>
-<symbol id="magnifier" viewBox="0 0 19 19"><title>magnifier</title><g transform="translate(1 1)" stroke-width="1.5" fill="none" fill-rule="evenodd"><circle cx="6.5" cy="6.5" r="6.5"/><path d="M17 17l-5-5" stroke-linecap="square"/></g></symbol>
-<symbol id="plus" viewBox="0 0 14 14"><title>plus</title><g stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"><path d="M7 1v12M13 7H1"/></g></symbol>
-<symbol id="user" viewBox="0 0 18 19"><title>user</title><path d="M1 16.832c0-4.948 6-3.958 6-5.937 0 0 .115-1.314-.546-1.98C5.63 8.092 5 7.102 5 5.454 5 2.993 6.79 1 9 1s4 1.994 4 4.453c0 1.625-.614 2.637-1.474 3.463-.628.648-.526 1.979-.526 1.979 0 1.979 6 .99 6 5.937 0 0-1.593 1.168-8 1.168s-8-1.168-8-1.168z" stroke-width="1.5" fill="none" fill-rule="evenodd"/></symbol>
-<symbol id="user-rounded" viewBox="0 0 18 18"><title>user-rounded</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><rect x=".75" y=".75" width="16.5" height="16.5" rx="2"/><path d="M3.002 17c0-3.75 4.499-3 4.499-4.5 0 0 .086-.996-.41-1.5-.618-.625-1.09-1.376-1.09-2.625C6.001 6.511 7.344 5 9 5c1.656 0 2.999 1.511 2.999 3.375 0 1.232-.46 2-1.105 2.625-.471.491-.395 1.5-.395 1.5 0 1.5 4.499.75 4.499 4.5"/></g></symbol>
-<symbol id="warning" viewBox="0 0 20 20"><title>warning</title><g stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M10 3l8 14H2z"/><path d="M10 9v5" stroke-linecap="square"/></g></symbol>
-</svg>