Add more internal CSS variables.

This commit is contained in:
Paul
2021-07-10 15:42:13 +01:00
parent 9846262e8b
commit ef5944b065
28 changed files with 110 additions and 128 deletions

View File

@@ -23,9 +23,9 @@ const EditorBase = styled.div`
textarea {
resize: none;
padding: 12px;
border-radius: 3px;
white-space: pre-wrap;
font-size: var(--text-size);
border-radius: var(--border-radius);
background: var(--secondary-header);
}

View File

@@ -27,18 +27,20 @@ const VoiceBase = styled.div`
background: var(--secondary-background);
.status {
position: absolute;
color: var(--success);
background: var(--primary-background);
flex: 1 0;
display: flex;
position: absolute;
align-items: center;
padding: 10px;
font-size: 14px;
font-weight: 600;
border-radius: 7px;
flex: 1 0;
user-select: none;
color: var(--success);
border-radius: var(--border-radius);
background: var(--primary-background);
svg {
margin-inline-end: 4px;
cursor: help;

View File

@@ -18,7 +18,7 @@
&[data-empty="true"] {
img {
height: 120px;
border-radius: 8px;
border-radius: var(--border-radius);
}
gap: 16px;
@@ -35,12 +35,12 @@
}
.friend {
padding: 0 10px;
height: 60px;
display: flex;
border-radius: 5px;
align-items: center;
padding: 0 10px;
cursor: pointer;
align-items: center;
border-radius: var(--border-radius);
&:hover {
background: var(--secondary-background);
@@ -110,9 +110,9 @@
display: flex;
cursor: pointer;
margin-top: 1em;
border-radius: 7px;
align-items: center;
flex-direction: row;
border-radius: var(--border-radius);
background: var(--secondary-background);
svg {

View File

@@ -34,10 +34,10 @@
.details {
text-align: center;
border-radius: 3px;
align-self: center;
padding: 32px 16px 16px 16px;
background: rgba(0, 0, 0, 0.6);
border-radius: var(--border-radius);
h1 {
margin: 0;

View File

@@ -4,10 +4,10 @@
width: 100%;
padding: 1em;
display: flex;
border-radius: 6px;
overflow: hidden;
align-items: center;
background: var(--secondary-header);
overflow: hidden;
border-radius: var(--border-radius);
.avatar {
cursor: pointer;
@@ -144,7 +144,7 @@
img {
cursor: pointer;
border-radius: 8px;
border-radius: var(--border-radius);
transition: border 0.3s;
border: 3px solid transparent;
@@ -195,10 +195,10 @@
place-items: center;
cursor: pointer;
border-radius: 8px;
transition: border 0.3s;
background: var(--hover);
border: 3px solid transparent;
border-radius: var(--border-radius);
img {
max-width: 100%;
@@ -262,8 +262,8 @@
min-width: 0;
flex-grow: 1;
padding: 8px;
border-radius: 4px;
font-family: var(--codeblock-font);
border-radius: var(--border-radius);
background: var(--secondary-background);
> div {
@@ -285,8 +285,8 @@
.entry {
padding: 12px;
margin-top: 8px;
border-radius: 6px;
border: 1px solid black;
border-radius: var(--border-radius);
span {
flex: 1;
@@ -312,8 +312,8 @@
height: 38px;
display: grid;
cursor: pointer;
border-radius: 6px;
place-items: center;
border-radius: var(--border-radius);
background: var(--primary-background);
}
@@ -339,29 +339,6 @@
top: 48px;
}
}
/*.override {
display: flex;
}
.picker {
width: 30px;
height: 30px;
flex-shrink: 0;
border-radius: 4px;
overflow: hidden;
margin-inline-end: 4px;
//TOFIX - Looks wonky on Chromium
border: 1px solid black;
}
.text {
border-radius: 4px;
padding: 0 4px 0;
}*/
}
}
}
@@ -383,11 +360,11 @@
}
.entry {
margin: 10px 0;
padding: 16px;
display: flex;
border-radius: 6px;
margin: 10px 0;
flex-direction: column;
border-radius: var(--border-radius);
background: var(--secondary-header);
&[data-active="true"] {