Just to make toolarea a little bit less ugly

master
Stefan Otto 2018-07-18 11:20:32 +02:00
parent de5d769f7e
commit f17f6b54c1
4 changed files with 15 additions and 17 deletions

View File

@ -61,7 +61,7 @@
} }
[data-component='MessageList'] { [data-component='MessageList'] {
background-color: rgba(#fff, 0.9); background-color: rgba(#000, 0.1);
height: 91vmin; height: 91vmin;
overflow-y: scroll; overflow-y: scroll;
padding-top: 5px; padding-top: 5px;
@ -71,10 +71,9 @@
margin: 5px; margin: 5px;
display: flex; display: flex;
word-wrap: break-word; word-wrap: break-word;
color: rgba(#000, 1.0)
> .client { > .client {
background-color: rgba(#fff, 0.9); background-color: rgba(#000, 0.1);
border-radius: 5px; border-radius: 5px;
padding: 6px; padding: 6px;
max-width: 215px; max-width: 215px;
@ -83,17 +82,16 @@
> .message-text { > .message-text {
font-size: 1.3vmin; font-size: 1.3vmin;
color: rgba(#000, 1.0);
} }
> .message-time { > .message-time {
font-size: 1vmin; font-size: 1vmin;
color: rgba(#777, 1.0) opacity:0.8;
} }
} }
> .response { > .response {
background-color: rgba(#fff, 0.9); background-color: rgba(#000, 0.1);
border-radius: 5px; border-radius: 5px;
padding: 6px; padding: 6px;
max-width: 215px; max-width: 215px;
@ -102,12 +100,11 @@
> .message-text { > .message-text {
font-size: 1.3vmin; font-size: 1.3vmin;
color: rgba(#000, 1.0);
} }
> .message-time { > .message-time {
font-size: 1vmin; font-size: 1vmin;
color: rgba(#777, 1.0); opacity: 0.8;
} }
} }
} }
@ -116,7 +113,7 @@
[data-component='Sender'] { [data-component='Sender'] {
align-items: center; align-items: center;
display: flex; display: flex;
background-color: rgba(#fff, 0.9); background-color: rgba(#000, 0.1);
height: 6vmin; height: 6vmin;
padding: 0.5vmin; padding: 0.5vmin;
border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;
@ -125,8 +122,8 @@
width: 100%; width: 100%;
border: 0; border: 0;
border-radius: 5px; border-radius: 5px;
background-color: rgba(#fff, 0.9); background-color: rgba(#000, 0.1);
color: #000; color: #fff;
height: 30px; height: 30px;
padding-left: 10px; padding-left: 10px;
font-size: 1.4vmin; font-size: 1.4vmin;

View File

@ -125,8 +125,7 @@
float: left; float: left;
width: auto; width: auto;
border: none; border: none;
display: block;
outline: 0; outline: 0;
padding: 0.6vmin; padding: 1vmin;
} }
} }

View File

@ -271,7 +271,7 @@
right: 0; right: 0;
width: 20%; width: 20%;
height: 100%; height: 100%;
background-color: #FFF; background-color: rgba(0,0,0,0.1);
transition: width 0.3s; transition: width 0.3s;
} }
} }

View File

@ -73,6 +73,7 @@
[data-component='ToolArea'] { [data-component='ToolArea'] {
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #fff;
> .tabs { > .tabs {
display: flex; display: flex;
@ -84,7 +85,7 @@
display: block; display: block;
padding: 1vmin 0 0.8vmin 0; padding: 1vmin 0 0.8vmin 0;
cursor: pointer; cursor: pointer;
background: rgba(#000, 0.3); background: rgba(0,0,0,0.3);
font-weight: bold; font-weight: bold;
transition: background ease 0.2s; transition: background ease 0.2s;
text-align: center; text-align: center;
@ -111,7 +112,7 @@
height: 100%; height: 100%;
display: none; display: none;
padding: 1vmin; padding: 1vmin;
background: #fff; background: rgba(0,0,0,0.1);
} }
> input[type="radio"] { > input[type="radio"] {
@ -119,11 +120,12 @@
} }
> input[type="radio"]:checked + label { > input[type="radio"]:checked + label {
background: #fff; background: rgba(0,0,0,0.1);
} }
> input[type="radio"]:checked + label + .tab { > input[type="radio"]:checked + label + .tab {
display: block; display: block;
background: rgba(0,0,0,0.1);
} }
} }
} }