PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge branch 'bwindel/polish' into 'element'

Browse source 
More polish

See merge request new-vector/element/element-web/matrix-react-sdk!21
This commit is contained in:
J. Ryan Stinnett 2020-07-14 19:35:41 +00:00
commit 9d094a793c
5 changed files with 29 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
res/css/structures/_HomePage.scss
View file

@ -72,7 +72,7 @@ limitations under the License.
&:hover {
color: $accent-color;
background: rgba(#03b381, 0.06);
background: rgba($accent-color, 0.06);
&::before {
background-color: $accent-color;

40
res/css/structures/_RightPanel.scss
View file

@ -51,20 +51,18 @@ limitations under the License.
.mx_RightPanel_headerButton {
cursor: pointer;
flex: 0 0 auto;
vertical-align: top;
margin-left: 5px;
margin-right: 5px;
text-align: center;
border-bottom: 2px solid transparent;
height: 20px;
width: 20px;
margin-left: 1px;
margin-right: 1px;
height: 32px;
width: 32px;
position: relative;
border-radius: 100%;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
top: 6px; // center with parent of 32px
left: 6px; // center with parent of 32px
height: 20px;
width: 20px;
background-color: $rightpanel-button-color;
@ -98,14 +96,22 @@ limitations under the License.
mask-position: center;
}
.mx_RightPanel_headerButton_highlight::after {
content: '';
position: absolute;
bottom: -6px;
left: 0;
right: 0;
height: 2px;
background-color: $button-bg-color;
.mx_RightPanel_headerButton_highlight {
background: rgba($accent-color, 0.25);
// make the icon the accent color too
&::before {
background-color: $accent-color;
}
}
.mx_RightPanel_headerButton:not(.mx_RightPanel_headerButton_highlight) {
&:hover {
background: rgba($accent-color, 0.1);
&::before {
background-color: $accent-color;
}
}
}
.mx_RightPanel_headerButton_badge {

2
res/css/views/rooms/_WhoIsTypingTile.scss
View file

@ -59,7 +59,7 @@ limitations under the License.
flex: 1;
font-size: $font-14px;
font-weight: 600;
color: $eventtile-meta-color;
color: $composer-button-color;
}
.mx_WhoIsTypingTile_label > span {

6
res/themes/light/css/_light.scss
View file

@ -14,7 +14,7 @@ $monospace-font-family: Inconsolata, Twemoji, 'Apple Color Emoji', 'Segoe UI Emo
// unified palette
// try to use these colors when possible
$accent-color: #03b381;
$accent-color: #0DBD8B;
$accent-bg-color: rgba(3, 179, 129, 0.16);
$notice-primary-color: #ff4b55;
$notice-primary-bg-color: rgba(255, 75, 85, 0.16);
@ -35,7 +35,7 @@ $focus-bg-color: #dddddd;
// button UI (white-on-green in light skin)
$accent-fg-color: #ffffff;
$accent-color-50pct: rgba(3, 179, 129, 0.5); //#03b381 in rgb
$accent-color-50pct: rgba($accent-color, 0.5);
$accent-color-darker: #92caad;
$accent-color-alt: #238CF5;
@ -202,7 +202,7 @@ $roomtile-focused-bg-color: #fff;
$username-variant1-color: #368bd6;
$username-variant2-color: #ac3ba8;
$username-variant3-color: #03b381;
$username-variant3-color: #0DBD8B;
$username-variant4-color: #e64f7a;
$username-variant5-color: #ff812d;
$username-variant6-color: #2dc2c5;

2
src/Avatar.js
View file

@ -82,7 +82,7 @@ function urlForColor(color) {
const colorToDataURLCache = new Map();
export function defaultAvatarUrlForString(s) {
const defaultColors = ['#03b381', '#368bd6', '#ac3ba8'];
const defaultColors = ['#0DBD8B', '#368bd6', '#ac3ba8'];
let total = 0;
for (let i = 0; i < s.length; ++i) {
total += s.charCodeAt(i);