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

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 { &:hover {
color: $accent-color; color: $accent-color;
background: rgba(#03b381, 0.06); background: rgba($accent-color, 0.06);
&::before { &::before {
background-color: $accent-color; background-color: $accent-color;

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

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

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

@ -59,7 +59,7 @@ limitations under the License.
flex: 1; flex: 1;
font-size: $font-14px; font-size: $font-14px;
font-weight: 600; font-weight: 600;
color: $eventtile-meta-color; color: $composer-button-color;
} }
.mx_WhoIsTypingTile_label > span { .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 // unified palette
// try to use these colors when possible // try to use these colors when possible
$accent-color: #03b381; $accent-color: #0DBD8B;
$accent-bg-color: rgba(3, 179, 129, 0.16); $accent-bg-color: rgba(3, 179, 129, 0.16);
$notice-primary-color: #ff4b55; $notice-primary-color: #ff4b55;
$notice-primary-bg-color: rgba(255, 75, 85, 0.16); $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) // button UI (white-on-green in light skin)
$accent-fg-color: #ffffff; $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-darker: #92caad;
$accent-color-alt: #238CF5; $accent-color-alt: #238CF5;
@ -202,7 +202,7 @@ $roomtile-focused-bg-color: #fff;
$username-variant1-color: #368bd6; $username-variant1-color: #368bd6;
$username-variant2-color: #ac3ba8; $username-variant2-color: #ac3ba8;
$username-variant3-color: #03b381; $username-variant3-color: #0DBD8B;
$username-variant4-color: #e64f7a; $username-variant4-color: #e64f7a;
$username-variant5-color: #ff812d; $username-variant5-color: #ff812d;
$username-variant6-color: #2dc2c5; $username-variant6-color: #2dc2c5;

2
src/Avatar.js
View file

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