paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-03 21:43:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

css: Split out user_circles.scss.

Browse Source 
This is a pure code move.

We want to use user circles in the left sidebar,
so this code will no longer belong in
right-sidebar.scss.

This code is just related to drawing the circles.
We can still position in size in other CSS files
(with more context-specific selectors).
This commit is contained in:
Steve Howell
2019-02-16 23:29:16 +00:00
committed by Tim Abbott
parent 815d009006
commit 3c8c2abd99
3 changed files with 37 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
static/js/bundles/app.js
View File

@@ -222,6 +222,7 @@ import "styles/input_pill.scss";
import "styles/informational-overlays.scss";
import "styles/compose.scss";
import "styles/reactions.scss";
import "styles/user_circles.scss";
import "styles/left-sidebar.scss";
import "styles/right-sidebar.scss";
import "styles/lightbox.scss";

33
static/styles/right-sidebar.scss
View File

@@ -65,39 +65,6 @@
width: 8px;
height: 8px;
margin: 0px 5px;
border-radius: 50%;
border: 1px solid;
float: left;
position: relative;
top: 5px;
}
.user_active .user-status-indicator,
.group-pm-status-indicator {
background-color: hsl(106, 74%, 44%);
border-color: hsl(106, 74%, 44%);
}
.user_idle .user-status-indicator {
border-color: hsl(29, 84%, 51%);
background-color: hsl(29, 84%, 51%);
background: -moz-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsla(0, 0%, 100%, 0.0)), color-stop(50%, hsla(29, 84%, 51%, 1.0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* IE10+ */
background: linear-gradient(to bottom, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ec7e18', GradientType=0 ); /* IE6-9; filters only work with hex colors */
}
// We show "away" users identically to long-gone
// users, but this may change.
.user_away_me .user-status-indicator,
.user_away_them .user-status-indicator,
.user-status-indicator {
background-color: none;
border-color: hsl(0, 0%, 50%);
}
.user_unknown .user-status-indicator {

36
static/styles/user_circles.scss Normal file
View File

@@ -0,0 +1,36 @@
.user-status-indicator,
.group-pm-status-indicator {
border-radius: 50%;
border: 1px solid;
float: left;
position: relative;
top: 5px;
}
.user_active .user-status-indicator,
.group-pm-status-indicator {
background-color: hsl(106, 74%, 44%);
border-color: hsl(106, 74%, 44%);
}
.user_idle .user-status-indicator {
border-color: hsl(29, 84%, 51%);
background-color: hsl(29, 84%, 51%);
background: -moz-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsla(0, 0%, 100%, 0.0)), color-stop(50%, hsla(29, 84%, 51%, 1.0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* IE10+ */
background: linear-gradient(to bottom, hsla(0, 0%, 100%, 0.0) 50%, hsla(29, 84%, 51%, 1.0) 50%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ec7e18', GradientType=0 ); /* IE6-9; filters only work with hex colors */
}
// We show "away" users identically to long-gone
// users, but this may change.
.user_away_me .user-status-indicator,
.user_away_them .user-status-indicator,
.user-status-indicator {
background-color: none;
border-color: hsl(0, 0%, 50%);
}