css: Convert colors from rgba to hsla format.

This commit is contained in:
Aman Agrawal 2019-06-19 08:23:16 +05:30 committed by Tim Abbott
parent 3e589cf65e
commit 904422d8bc
15 changed files with 51 additions and 51 deletions

View File

@ -39,7 +39,7 @@ run_test('paste_handler', () => {
assert.equal(copy_and_paste.paste_handler_converter(input), assert.equal(copy_and_paste.paste_handler_converter(input),
'love the **Zulip****Organization**.'); 'love the **Zulip****Organization**.');
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>'; 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: hsla(210, 13%, 12%, 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), assert.equal(copy_and_paste.paste_handler_converter(input),
'The `JSDOM` constructor'); 'The `JSDOM` constructor');

View File

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

View File

@ -246,7 +246,7 @@
.hotspot-inline { .hotspot-inline {
width: 350px; width: 350px;
max-width: 95%; max-width: 95%;
box-shadow: 0 5px 10px rgba(133, 136, 142, 0.1); box-shadow: 0 5px 10px hsla(220, 4%, 54%, 0.1);
border-radius: 4px; border-radius: 4px;
background-color: hsl(0, 0%, 98%); background-color: hsl(0, 0%, 98%);
margin: 0 auto; margin: 0 auto;

View File

@ -89,7 +89,7 @@
border-radius: 4px; border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.6); border: 1px solid hsla(0, 0%, 100%, 0.6);
text-align: center; text-align: center;
color: hsl(0, 0%, 100%); color: hsl(0, 0%, 100%);

View File

@ -513,7 +513,7 @@ on a dark background, and don't change the dark labels dark either. */
} }
.history-limited-box { .history-limited-box {
background-color: rgba(0, 0, 0, 0.2); background-color: hsla(0, 0%, 0%, 0.2);
} }
#feedback_container, #feedback_container,
@ -576,7 +576,7 @@ on a dark background, and don't change the dark labels dark either. */
.simplebar-track .simplebar-scrollbar::before { .simplebar-track .simplebar-scrollbar::before {
background-color: hsl(0, 0%, 100%); background-color: hsl(0, 0%, 100%);
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.33); box-shadow: 0px 0px 0px 1px hsla(0, 0%, 0%, 0.33);
} }
.collapse-settings-btn:hover { .collapse-settings-btn:hover {

View File

@ -314,7 +314,7 @@ ul.remind_me_popover .remind_icon {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background-color: rgba(0, 0, 0, 0.7); background-color: hsla(0, 0%, 0%, 0.7);
z-index: 103; z-index: 103;

View File

@ -121,7 +121,7 @@
color: hsl(0, 0%, 100%); color: hsl(0, 0%, 100%);
background-color: hsl(185, 38%, 55%); background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%)); background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.2);
border: 0; border: 0;
height: 40px; height: 40px;
margin: 5px 0 0 0; margin: 5px 0 0 0;
@ -137,7 +137,7 @@
.stripe-button-el:hover { .stripe-button-el:hover {
background-color: hsl(169, 65%, 42%); background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.3);
} }
.stripe-button-el:active, .stripe-button-el:active,

View File

@ -88,9 +88,9 @@
} }
.portico-landing.integrations .searchbar input { .portico-landing.integrations .searchbar input {
-webkit-box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.03); -webkit-box-shadow: 0px 0px 7px 2px hsla(0, 0%, 0%, 0.03);
-moz-box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.03); -moz-box-shadow: 0px 0px 7px 2px hsla(0, 0%, 0%, 0.03);
box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.03); box-shadow: 0px 0px 7px 2px hsla(0, 0%, 0%, 0.03);
font-size: 1em; font-size: 1em;
font-family: inherit; font-family: inherit;

View File

@ -28,7 +28,7 @@ button {
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
background-color: hsl(173, 100%, 98%); 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); box-shadow: 8px 4px 8px 0 hsla(0, 0%, 0%, 0.2), 0 6px 20px 0 hsla(0, 0%, 0%, 0.19);
} }
#fixture_body { #fixture_body {

View File

@ -461,7 +461,7 @@ nav ul li.active::after {
.portico-landing.features-app section.hero .image { .portico-landing.features-app section.hero .image {
height: 400px; height: 400px;
width: 40%; width: 40%;
background-color: rgba(0, 0, 0, 0.05); background-color: hsla(0, 0%, 0%, 0.05);
} }
.portico-landing.features-app section.keyboard-shortcuts { .portico-landing.features-app section.keyboard-shortcuts {
@ -553,7 +553,7 @@ nav ul li.active::after {
background-color: hsl(0, 0%, 100%); background-color: hsl(0, 0%, 100%);
border-radius: 10px; border-radius: 10px;
box-shadow: 10px 20px 80px rgba(0, 0, 0, 0.15); box-shadow: 10px 20px 80px hsla(0, 0%, 0%, 0.15);
} }
.portico-landing.features-app section.notifications .envelope { .portico-landing.features-app section.notifications .envelope {
@ -621,7 +621,7 @@ nav ul li.active::after {
width: 400px; width: 400px;
height: 280px; height: 280px;
background: linear-gradient(135deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.2)); background: linear-gradient(135deg, hsla(0, 0%, 0%, 0.05), hsla(0, 0%, 0%, 0.2));
border-radius: 4px; border-radius: 4px;
background-image: url(/static/images/landing-page/notifications.jpg); background-image: url(/static/images/landing-page/notifications.jpg);
@ -702,7 +702,7 @@ nav ul li.active::after {
} }
.portico-landing.hello .gradients .gradient.dark-blue { .portico-landing.hello .gradients .gradient.dark-blue {
background: linear-gradient(10deg, rgba(15, 46, 57, 0) 50%, rgba(15, 46, 57, 0.7)); background: linear-gradient(10deg, hsla(196, 58%, 14%, 0) 50%, hsla(196, 58%, 14%, 0.7));
} }
.portico-landing.hello .gradients .gradient.green { .portico-landing.hello .gradients .gradient.green {
@ -818,7 +818,7 @@ nav ul li.active::after {
font-size: 3em; font-size: 3em;
font-weight: 400; font-weight: 400;
text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.2); text-shadow: 0px 0px 20px hsla(0, 0%, 100%, 0.2);
} }
.portico-landing.hello .hero header p { .portico-landing.hello .hero header p {
@ -827,7 +827,7 @@ nav ul li.active::after {
font-size: 1.5em; font-size: 1.5em;
font-weight: 300; font-weight: 300;
line-height: 1.4; line-height: 1.4;
text-shadow: 0px 0px 5px rgba(10, 66, 51, 0.3), 0px 0px 20px rgba(255, 255, 255, 0.2); text-shadow: 0px 0px 5px hsla(164, 74%, 15%, 0.3), 0px 0px 20px hsla(0, 0%, 100%, 0.2);
} }
.portico-landing.hello .hero header a { .portico-landing.hello .hero header a {
@ -847,17 +847,17 @@ nav ul li.active::after {
font-weight: 500; font-weight: 500;
color: hsl(148, 23%, 51%); color: hsl(148, 23%, 51%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.2);
transition: all 0.2s ease; transition: all 0.2s ease;
} }
.portico-landing.hello .hero header button:hover { .portico-landing.hello .hero header button:hover {
box-shadow: 0px 3px 10px rgba(255, 255, 255, 0.2); box-shadow: 0px 3px 10px hsla(0, 0%, 100%, 0.2);
} }
.portico-landing.hello .hero header button:active { .portico-landing.hello .hero header button:active {
box-shadow: 0px 3px 20px rgba(255, 255, 255, 0.5); box-shadow: 0px 3px 20px hsla(0, 0%, 100%, 0.5);
} }
.portico-landing.hello .hero header .download-button { .portico-landing.hello .hero header .download-button {
@ -1361,10 +1361,10 @@ nav ul li.active::after {
height: 520px; height: 520px;
margin: 20px auto; margin: 20px auto;
padding: 30px 20px; padding: 30px 20px;
background-color: rgba(246, 247, 249, 0.6); background-color: hsla(220, 20%, 97%, 0.6);
background: linear-gradient(rgba(246, 247, 249, 0.4), rgba(246, 247, 249, 0.9)); background: linear-gradient(hsla(220, 20%, 97%, 0.4), hsla(220, 20%, 97%, 0.9));
border-radius: 12px; border-radius: 12px;
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.02); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.02);
position: relative; position: relative;
} }
@ -1375,7 +1375,7 @@ nav ul li.active::after {
color: hsl(0, 0%, 100%); color: hsl(0, 0%, 100%);
background-color: hsl(185, 38%, 55%); background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%)); background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.3);
border: 0; border: 0;
position: absolute; position: absolute;
left: 50%; left: 50%;
@ -1389,7 +1389,7 @@ nav ul li.active::after {
.tour .carousel-inner .start-button:hover { .tour .carousel-inner .start-button:hover {
background-color: hsl(169, 65%, 42%); background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.3);
} }
.tour .carousel-inner .start-image { .tour .carousel-inner .start-image {
@ -1549,13 +1549,13 @@ nav ul li.active::after {
background-color: hsl(185, 38%, 55%); background-color: hsl(185, 38%, 55%);
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%)); background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.2);
border: 0; border: 0;
} }
.tour .carousel-inner button.call-to-action:hover { .tour .carousel-inner button.call-to-action:hover {
background-color: hsl(169, 65%, 42%); background-color: hsl(169, 65%, 42%);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 10px hsla(0, 0%, 0%, 0.3);
} }
.tour .carousel-control { .tour .carousel-control {
@ -1716,7 +1716,7 @@ nav ul li.active::after {
width: 60%; width: 60%;
margin: 0 auto; margin: 0 auto;
border: none; border: none;
border-bottom: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid hsla(0, 0%, 100%, 0.2);
} }
.portico-landing .testimonials .company-container { .portico-landing .testimonials .company-container {
@ -2103,7 +2103,7 @@ nav ul li.active::after {
} }
.portico-landing.apps .hero .info .cta { .portico-landing.apps .hero .info .cta {
text-shadow: 0px 0px 60px rgba(0, 0, 0, 0.3); text-shadow: 0px 0px 60px hsla(0, 0%, 0%, 0.3);
max-width: 600px; max-width: 600px;
} }
@ -2346,7 +2346,7 @@ nav ul li.active::after {
top: 0; top: 0;
left: 0; left: 0;
background-color: rgba(15, 24, 48, 0.7); background-color: hsla(224, 52%, 12%, 0.7);
z-index: 0; z-index: 0;
} }
@ -2501,7 +2501,7 @@ nav ul li.active::after {
} }
.gradients .gradient.dark-blue { .gradients .gradient.dark-blue {
background: linear-gradient(10deg, rgba(15, 46, 57, 0) 50%, rgba(15, 46, 57, 0.7)); background: linear-gradient(10deg, hsla(196, 58%, 14%, 0) 50%, hsla(196, 58%, 14%, 0.7));
} }
.gradients .gradient.green { .gradients .gradient.green {
@ -2571,7 +2571,7 @@ nav ul li.active::after {
width: 300px; width: 300px;
height: 500px; height: 500px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 10px hsla(0, 0%, 0%, 0.1);
text-align: left; text-align: left;
@ -2741,7 +2741,7 @@ nav ul li.active::after {
.pricing-overlay.pricing-model.active { .pricing-overlay.pricing-model.active {
opacity: 1; opacity: 1;
pointer-events: all; pointer-events: all;
background-color: rgba(0, 0, 0, 0.6); background-color: hsla(0, 0%, 0%, 0.6);
} }
.pricing-overlay.pricing-model .price-box { .pricing-overlay.pricing-model .price-box {
@ -2842,15 +2842,15 @@ nav ul li.active::after {
@keyframes box-shadow-pulse { @keyframes box-shadow-pulse {
0% { 0% {
box-shadow: 0px 0px 0px rgba(106, 201, 185, 0); box-shadow: 0px 0px 0px hsla(170, 47%, 60%, 1);
} }
50% { 50% {
box-shadow: 0px 0px 25px rgba(106, 201, 185, 0.8); box-shadow: 0px 0px 25px hsla(170, 47%, 60%, 0.8);
} }
100% { 100% {
box-shadow: 0px 0px 0px rgba(106, 201, 185, 0); box-shadow: 0px 0px 0px hsla(170, 47%, 60%, 1);
} }
} }
@ -3491,7 +3491,7 @@ nav ul li.active::after {
} }
nav .content > ul.show { nav .content > ul.show {
outline-color: rgba(32, 62, 80, 0.7); outline-color: hsla(203, 43%, 22%, 0.7);
} }
nav ul .exit { nav ul .exit {

View File

@ -52,7 +52,7 @@ body {
height: 29px; height: 29px;
background-color: hsl(0, 0%, 100%); background-color: hsl(0, 0%, 100%);
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 4px hsla(0, 0%, 0%, 0.1);
z-index: 100; z-index: 100;
} }
@ -183,7 +183,7 @@ body {
.app.help { .app.help {
display: inline-flex; display: inline-flex;
box-shadow: 0px -20px 50px rgba(0, 0, 0, 0.04); box-shadow: 0px -20px 50px hsla(0, 0%, 0%, 0.04);
overflow: auto; overflow: auto;
color: hsl(0, 0%, 27%); color: hsl(0, 0%, 27%);
@ -776,7 +776,7 @@ input.text-error {
border-radius: 4px; border-radius: 4px;
border: 1px solid hsl(0, 0%, 87%); border: 1px solid hsl(0, 0%, 87%);
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 5px hsla(0, 0%, 0%, 0.1);
} }
.portico-header .dropdown.show ul { .portico-header .dropdown.show ul {
@ -835,7 +835,7 @@ input.text-error {
} }
.portico-header .dropdown-pill { .portico-header .dropdown-pill {
border: 1px solid rgba(0, 0, 0, 0.2); border: 1px solid hsla(0, 0%, 0%, 0.2);
border-radius: 4px; border-radius: 4px;
margin-left: 10px; margin-left: 10px;
font-weight: 400; font-weight: 400;
@ -928,7 +928,7 @@ a.bottom-signup-button {
.table.table-striped { .table.table-striped {
background-color: hsl(0, 0%, 100%); background-color: hsl(0, 0%, 100%);
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 4px hsla(0, 0%, 0%, 0.1);
} }
.team-profiles { .team-profiles {

View File

@ -1907,13 +1907,13 @@ thead .actions {
} }
.custom_user_field .pill-container:focus-within { .custom_user_field .pill-container:focus-within {
border-color: rgba(82, 168, 236, 0.8); border-color: hsla(206, 80%, 62%, 0.8);
outline: 0; outline: 0;
outline: 1px dotted \9; outline: 1px dotted \9;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); -webkit-box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075), 0 0 8px hsla(206, 80%, 62%, 0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); -moz-box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075), 0 0 8px hsla(206, 80%, 62%, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075), 0 0 8px hsla(206, 80%, 62%, 0.6);
} }
#get_api_key_button { #get_api_key_button {

View File

@ -1579,7 +1579,7 @@ a:hover code {
height: 80px; height: 80px;
padding: 5px; padding: 5px;
z-index: 1; z-index: 1;
text-shadow: rgba(0, 0, 0, .01) 0 0 1px; text-shadow: hsla(0, 0%, 0%, 0.01) 0 0 1px;
.message_embed_title { .message_embed_title {
padding-top: 0px; padding-top: 0px;

View File

@ -3,7 +3,7 @@
<li data-user-ids="{{user_ids_string}}" class="group-pms-sidebar-entry narrow-filter"> <li data-user-ids="{{user_ids_string}}" class="group-pms-sidebar-entry narrow-filter">
<div class="selectable_sidebar_block"> <div class="selectable_sidebar_block">
{{#if fraction_present}} {{#if fraction_present}}
<span class="user_circle_fraction" style="background:rgba(68,194,29,{{fraction_present}});"></span> <span class="user_circle_fraction" style="background:hsla(106, 74%, 44%, {{fraction_present}});"></span>
{{else}} {{else}}
<span class="user_circle_fraction" style="background:none; border-color:hsl(0, 0%, 50%);"></span> <span class="user_circle_fraction" style="background:none; border-color:hsl(0, 0%, 50%);"></span>
{{/if}} {{/if}}

View File

@ -6,7 +6,7 @@
<div class="pm_left_col"> <div class="pm_left_col">
{{#if is_group}} {{#if is_group}}
{{#if fraction_present}} {{#if fraction_present}}
<span class="{{user_circle_class}} user_circle" style="background:rgba(68,194,29,{{fraction_present}});"></span> <span class="{{user_circle_class}} user_circle" style="background:hsla(106, 74%, 44%, {{fraction_present}});"></span>
{{else}} {{else}}
<span class="{{user_circle_class}} user_circle" style="background:none; border-color:hsl(0, 0%, 50%);"></span> <span class="{{user_circle_class}} user_circle" style="background:none; border-color:hsl(0, 0%, 50%);"></span>
{{/if}} {{/if}}