Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

css: Convert colors from rgb to hsl format. 

Note that we are not converting the stream colors.
This commit is contained in:
Aman Agrawal 2019-06-19 00:28:40 +05:30 committed by Tim Abbott
parent 549338dc50
commit 3e589cf65e
12 changed files with 33 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend_tests/node_tests/copy_and_paste.js
View File

@ -35,31 +35,31 @@ var createPasteEvent = function () {
run_test('paste_handler', () => {
var input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: rgb(34, 34, 34); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;"><span> </span>love the<span> </span><b>Zulip</b><b> </b></span><b style="color: rgb(34, 34, 34); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">Organization</b><span style="color: rgb(34, 34, 34); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">.</span>';
var input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: hsl(0, 0%, 13%); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial;"><span> </span>love the<span> </span><b>Zulip</b><b> </b></span><b style="color: hsl(0, 0%, 13%); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial;">Organization</b><span style="color: hsl(0, 0%, 13%); font-family: arial, sans-serif; font-size: 12.8px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial;">.</span>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'love the **Zulip****Organization**.');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">The<span> </span></span><code style="box-sizing: border-box; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 13.6px; padding: 0.2em 0.4em; margin: 0px; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; color: rgb(36, 41, 46); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">JSDOM</code><span style="color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;"><span> </span>constructor</span>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: hsl(210, 12%, 16%); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">The<span> </span></span><code style="box-sizing: border-box; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 13.6px; padding: 0.2em 0.4em; margin: 0px; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; color: hsl(210, 12%, 16%); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">JSDOM</code><span style="color: hsl(210, 12%, 16%); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;"><span> </span>constructor</span>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'The `JSDOM` constructor');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><a href="https://zulip.readthedocs.io/en/latest/subsystems/logging.html" target="_blank" title="https://zulip.readthedocs.io/en/latest/subsystems/logging.html" style="color: rgb(0, 136, 204); text-decoration: none; cursor: pointer; font-family: &quot;Source Sans Pro&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);">https://zulip.readthedocs.io/en/latest/subsystems/logging.html</a>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><a href="https://zulip.readthedocs.io/en/latest/subsystems/logging.html" target="_blank" title="https://zulip.readthedocs.io/en/latest/subsystems/logging.html" style="color: hsl(200, 100%, 40%); text-decoration: none; cursor: pointer; font-family: &quot;Source Sans Pro&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%);">https://zulip.readthedocs.io/en/latest/subsystems/logging.html</a>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'https://zulip.readthedocs.io/en/latest/subsystems/logging.html');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><a class="reference external" href="https://zulip.readthedocs.io/en/latest/overview/contributing.html" style="box-sizing: border-box; color: rgb(155, 89, 182); text-decoration: none; cursor: pointer; outline: 0px; font-family: Lato, proxima-nova, &quot;Helvetica Neue&quot;, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(252, 252, 252);">Contributing to Zulip</a>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><a class="reference external" href="https://zulip.readthedocs.io/en/latest/overview/contributing.html" style="box-sizing: border-box; color: hsl(283, 39%, 53%); text-decoration: none; cursor: pointer; outline: 0px; font-family: Lato, proxima-nova, &quot;Helvetica Neue&quot;, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 99%);">Contributing to Zulip</a>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'[Contributing to Zulip](https://zulip.readthedocs.io/en/latest/overview/contributing.html)');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: rgb(0, 0, 0); font-family: &quot;Helvetica Neue&quot;, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-size: 13px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">1. text</span>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><span style="color: hsl(0, 0%, 0%); font-family: &quot;Helvetica Neue&quot;, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-size: 13px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">1. text</span>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'1. text');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><h1 style="box-sizing: border-box; font-size: 2em; margin-top: 0px !important; margin-right: 0px; margin-bottom: 16px; margin-left: 0px; font-weight: 600; line-height: 1.25; padding-bottom: 0.3em; border-bottom: 1px solid rgb(234, 236, 239); color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">Zulip overview</h1>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><h1 style="box-sizing: border-box; font-size: 2em; margin-top: 0px !important; margin-right: 0px; margin-bottom: 16px; margin-left: 0px; font-weight: 600; line-height: 1.25; padding-bottom: 0.3em; border-bottom: 1px solid hsl(216, 14%, 93%); color: hsl(210, 12%, 16%); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">Zulip overview</h1>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'Zulip overview');
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><i style="box-sizing: inherit; color: rgb(0, 0, 0); font-family: Verdana, sans-serif; font-size: 15px; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">This text is italic</i>';
input = '<meta http-equiv="content-type" content="text/html; charset=utf-8"><i style="box-sizing: inherit; color: hsl(0, 0%, 0%); font-family: Verdana, sans-serif; font-size: 15px; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: hsl(0, 0%, 100%); text-decoration-style: initial; text-decoration-color: initial;">This text is italic</i>';
assert.equal(copy_and_paste.paste_handler_converter(input),
'*This text is italic*');

2
frontend_tests/node_tests/templates.js
View File

@ -621,7 +621,7 @@ run_test('draft_table_body', () => {
draft_id: '1',
is_stream: true,
stream: 'all',
stream_color: '#FF0000', // rgb(255, 0, 0)
stream_color: '#FF0000', // hsl(0, 100%, 50%)
topic: 'tests',
content: 'Public draft',
},

2
static/styles/components.scss
View File

@ -70,7 +70,7 @@ a.no-underline:hover {
.simplebar-track {
.simplebar-scrollbar::before {
background-color: rgb(0, 0, 0);
background-color: hsl(0, 0%, 0%);
box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.33);
}

4
static/styles/night_mode.scss
View File

@ -575,7 +575,7 @@ on a dark background, and don't change the dark labels dark either. */
}
.simplebar-track .simplebar-scrollbar::before {
background-color: rgb(255, 255, 255);
background-color: hsl(0, 0%, 100%);
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.33);
}
@ -584,7 +584,7 @@ on a dark background, and don't change the dark labels dark either. */
}
#loading_more_messages_indicator path {
fill: rgb(255, 255, 255);
fill: hsl(0, 0%, 100%);
}
}

2
static/styles/popovers.scss
View File

@ -141,7 +141,7 @@ ul.remind_me_popover .remind_icon {
&:hover {
cursor: pointer;
color: rgb(0, 136, 204);
color: hsl(200, 100%, 40%);
}
}

8
static/styles/portico/billing.scss
View File

@ -120,7 +120,7 @@
font-weight: 400;
color: hsl(0, 0%, 100%);
background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, rgb(76, 181, 205), rgb(37, 177, 151));
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
border: 0;
height: 40px;
@ -136,13 +136,13 @@
}
.stripe-button-el:hover {
background-color: rgb(37, 177, 151);
background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
}
.stripe-button-el:active,
.stripe-button-el:not(:disabled):active {
background-color: rgb(25, 139, 118);
background-color: hsl(169, 70%, 32%);
span {
background: 0;
box-shadow: none;
@ -158,7 +158,7 @@
.stripe-button-el:hover:disabled {
box-shadow: none;
background-color: rgb(200, 200, 200);
background-color: hsl(0, 0%, 78%);
pointer-events: none;
}

16
static/styles/portico/integrations_dev_panel.css
View File

@ -1,17 +1,17 @@
circle {
fill: rgb(0, 0, 0);
fill: hsl(0, 0%, 0%);
stroke-width: 1.93936479;
stroke: transparent;
}
path {
fill: rgb(82, 194, 175);
stroke: rgb(82, 194, 175);
fill: hsl(170, 48%, 54%);
stroke: hsl(170, 48%, 54%);
}
button {
background-color: rgb(220, 244, 233);
color: rgb(46, 139, 87);
background-color: hsl(152, 52%, 91%);
color: hsl(146, 50%, 36%);
}
#custom_http_headers {
@ -27,7 +27,7 @@ button {
padding-top: 20px;
padding-left: 10px;
padding-right: 10px;
background-color: rgb(247, 255, 254);
background-color: hsl(173, 100%, 98%);
box-shadow: 8px 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
@ -41,7 +41,7 @@ button {
width: 100%;
height: 500px;
resize: vertical;
background-color: rgb(256, 256, 256);
background-color: hsl(0, 0%, 100%);
}
#top-navbar {
@ -73,7 +73,7 @@ button {
}
.optional {
color: rgb(128, 128, 128);
color: hsl(0, 0%, 50%);
}
.pad-small {

8
static/styles/portico/landing-page.scss
View File

@ -1374,7 +1374,7 @@ nav ul li.active::after {
font-weight: 400;
color: hsl(0, 0%, 100%);
background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, rgb(76, 181, 205), rgb(37, 177, 151));
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
border: 0;
position: absolute;
@ -1388,7 +1388,7 @@ nav ul li.active::after {
}
.tour .carousel-inner .start-button:hover {
background-color: rgb(37, 177, 151);
background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
}
@ -1548,13 +1548,13 @@ nav ul li.active::after {
color: hsl(0, 0%, 100%);
background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, rgb(76, 181, 205), rgb(37, 177, 151));
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
border: 0;
}
.tour .carousel-inner button.call-to-action:hover {
background-color: rgb(37, 177, 151);
background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
}

2
static/styles/portico/portico.scss
View File

@ -9,7 +9,7 @@ body {
.digest-address-link {
margin-top: 10px;
color: rgb(153, 153, 153);
color: hsl(0, 0%, 60%);
font-size: 12px;
text-align: center;
}

4
static/styles/zulip.scss
View File

@ -1010,8 +1010,8 @@ td.pointer {
.private-message .date_row {
background-color: hsla(192, 19%, 75%, 0.2);
box-shadow:
inset 2px 0px 0px 0px rgb(68, 68, 68),
-1px 0px 0px 0px rgb(68, 68, 68);
inset 2px 0px 0px 0px hsl(0, 0%, 27%),
-1px 0px 0px 0px hsl(0, 0%, 27%);
}
.message-header-contents {

2
static/templates/group_pms.handlebars
View File

@ -5,7 +5,7 @@
{{#if fraction_present}}
<span class="user_circle_fraction" style="background:rgba(68,194,29,{{fraction_present}});"></span>
{{else}}
<span class="user_circle_fraction" style="background:none; border-color:rgb(127,127,127);"></span>
<span class="user_circle_fraction" style="background:none; border-color:hsl(0, 0%, 50%);"></span>
{{/if}}
<a href="{{href}}" data-name="{{name}}" title="{{name}}" class="group-pm-link">{{short_name}}</a>
<span class="count"><span class="value"></span></span>

2
static/templates/sidebar_private_message_list.handlebars
View File

@ -8,7 +8,7 @@
{{#if fraction_present}}
<span class="{{user_circle_class}} user_circle" style="background:rgba(68,194,29,{{fraction_present}});"></span>
{{else}}
<span class="{{user_circle_class}} user_circle" style="background:none; border-color:rgb(127,127,127);"></span>
<span class="{{user_circle_class}} user_circle" style="background:none; border-color:hsl(0, 0%, 50%);"></span>
{{/if}}
{{else}}
<span class="{{user_circle_class}} user_circle"></span>