changed colors for more popouts.

This commit is contained in:
supertiger1234 2020-02-06 11:49:05 +00:00
parent 3587d6e96e
commit 017b76e9c1
8 changed files with 55 additions and 26 deletions

View file

@ -119,14 +119,15 @@ export default {
.button { .button {
padding: 10px; padding: 10px;
background: #062c3a; background: rgba(0, 0, 0, 0.2);
border-radius: 4px;
margin: auto; margin: auto;
transition: 0.3s; transition: 0.3s;
user-select: none; user-select: none;
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
background: #041e27; background: rgba(0, 0, 0, 0.5);
} }
.bottom { .bottom {

View file

@ -50,6 +50,7 @@ export default {
margin-bottom: 10px; margin-bottom: 10px;
} }
.button { .button {
border-radius: 4px;
padding: 10px; padding: 10px;
background: rgba(255, 0, 0, 0.719); background: rgba(255, 0, 0, 0.719);
margin: auto; margin: auto;

View file

@ -224,7 +224,8 @@ export default {
align-self: center; align-self: center;
margin-top: 10px; margin-top: 10px;
justify-content: center; justify-content: center;
background-color: #044050; background-color: rgba(0, 0, 0, 0.4);
border-radius: 4px;
flex-shrink: 0; flex-shrink: 0;
.avatar { .avatar {
@ -237,6 +238,7 @@ export default {
margin-top: 35px; margin-top: 35px;
} }
.button { .button {
background: rgba(0, 0, 0, 0.2);
margin-bottom: 16px; margin-bottom: 16px;
} }
} }
@ -249,6 +251,9 @@ export default {
margin-top: 10px; margin-top: 10px;
padding: 5px; padding: 5px;
margin-left: 2px; margin-left: 2px;
.button {
background: rgba(0, 0, 0, 0.2);
}
.banner-image { .banner-image {
position: relative; position: relative;
width: 250px; width: 250px;
@ -292,7 +297,7 @@ export default {
.input { .input {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background-color: #044050; background-color: rgba(0, 0, 0, 0.4);
padding: 10px; padding: 10px;
align-self: center; align-self: center;
margin: 10px; margin: 10px;
@ -302,9 +307,16 @@ export default {
margin-top: 2px; margin-top: 2px;
margin-bottom: 0; margin-bottom: 0;
width: 190px; width: 190px;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 4px;
}
.input-title {
font-size: 14px;
margin-left: 2px;
} }
.button { .button {
background: #033442; background: rgba(0, 0, 0, 0.3);
border-radius: 4px;
padding: 10px; padding: 10px;
align-self: center; align-self: center;
margin: 5px; margin: 5px;
@ -313,7 +325,7 @@ export default {
transition: 0.3s; transition: 0.3s;
} }
.button:hover { .button:hover {
background: #022831; background: rgba(0, 0, 0, 0.5);
} }
.save-button { .save-button {
margin-top: 10px; margin-top: 10px;

View file

@ -88,9 +88,8 @@ export default {
overflow: auto; overflow: auto;
.member { .member {
display: flex; display: flex;
background: #052935; background: rgba(0, 0, 0, 0.5);
height: 30px; height: 30px;
margin: 5px;
padding: 5px; padding: 5px;
align-content: center; align-content: center;
align-items: center; align-items: center;
@ -122,6 +121,7 @@ export default {
user-select: none; user-select: none;
flex-shrink: 0; flex-shrink: 0;
margin-left: 5px; margin-left: 5px;
font-weight: bold;
} }
} }
} }

View file

@ -212,10 +212,10 @@ export default {
align-self: center; align-self: center;
} }
.channel:hover { .channel:hover {
background: #04232d; background: rgba(0, 0, 0, 0.2);
} }
.channel.selected { .channel.selected {
background: #03191f; background: rgba(0, 0, 0, 0.4);
} }
.add-channel-button { .add-channel-button {
background: rgba(17, 148, 255, 0.692); background: rgba(17, 148, 255, 0.692);
@ -231,16 +231,17 @@ export default {
overflow: hidden; overflow: hidden;
} }
.button { .button {
background: #024554; background: rgba(0, 0, 0, 0.2);
padding: 10px; padding: 10px;
align-self: center; align-self: center;
margin: 5px; margin: 5px;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
transition: 0.3s; transition: 0.3s;
border-radius: 4px;
} }
.button:hover { .button:hover {
background: #02303c; background: rgba(0, 0, 0, 0.4);
} }
.button.warn { .button.warn {
background: rgba(255, 17, 17, 0.692); background: rgba(255, 17, 17, 0.692);
@ -271,16 +272,22 @@ export default {
.input { .input {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background-color: #044050; background-color: rgba(0, 0, 0, 0.4);
padding: 10px; padding: 10px;
margin: 10px; margin: 10px;
border-radius: 4px;
} }
.input input { .input input {
width: initial; width: initial;
margin-top: 2px; margin-top: 2px;
margin-bottom: 0; margin-bottom: 0;
border-radius: 4px;
} }
.input-title {
font-size: 14px;
margin-left: 2px;
}
.check-box { .check-box {
display: flex; display: flex;
margin: 5px; margin: 5px;

View file

@ -339,10 +339,10 @@ export default {
align-self: center; align-self: center;
} }
.role:hover { .role:hover {
background: #04232d; background: rgba(0, 0, 0, 0.2);
} }
.role.selected { .role.selected {
background: #03191f; background: rgba(0, 0, 0, 0.4);
} }
.add-role-button { .add-role-button {
background: rgba(17, 148, 255, 0.692); background: rgba(17, 148, 255, 0.692);
@ -358,16 +358,17 @@ export default {
overflow: hidden; overflow: hidden;
} }
.button { .button {
background: #024554; background: rgba(0, 0, 0, 0.4);
padding: 10px; padding: 10px;
align-self: center; align-self: center;
margin: 5px; margin: 5px;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
transition: 0.3s; transition: 0.3s;
border-radius: 4px;
} }
.button:hover { .button:hover {
background: #02303c; background: rgba(0, 0, 0, 0.6);
} }
.button.warn { .button.warn {
background: rgba(255, 17, 17, 0.692); background: rgba(255, 17, 17, 0.692);
@ -398,7 +399,8 @@ export default {
.input { .input {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background-color: #044050; border-radius: 4px;
background-color: rgba(0, 0, 0, 0.4);
padding: 10px; padding: 10px;
margin: 10px; margin: 10px;
} }
@ -407,6 +409,7 @@ export default {
margin-bottom: 0; margin-bottom: 0;
background-color: rgba(0, 0, 0, 0.4); background-color: rgba(0, 0, 0, 0.4);
margin-top: 0; margin-top: 0;
border-radius: 4px;
} }
.role-name { .role-name {
@ -420,6 +423,7 @@ export default {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
transition: 0.2s; transition: 0.2s;
margin-top: 5px; margin-top: 5px;
border-radius: 4px;
} }
.color-picker { .color-picker {

View file

@ -237,16 +237,16 @@ export default {
align-self: center; align-self: center;
} }
.tab:hover { .tab:hover {
background: #072935; background: rgba(0, 0, 0, 0.4);
} }
.critical { .critical {
color: red; color: red;
} }
.tab.selected { .tab.selected {
background: #051f28; background: rgba(0, 0, 0, 0.4);
} }
.header { .header {
background: #05222d; background: rgba(0, 0, 0, 0.4);
display: flex; display: flex;
height: 50px; height: 50px;
flex-shrink: 0; flex-shrink: 0;

View file

@ -206,7 +206,8 @@ export default {
} }
.toggle { .toggle {
background-color: #044050; background-color: rgba(0, 0, 0, 0.4);
border-radius: 4px;
padding: 10px; padding: 10px;
margin-left: 10px; margin-left: 10px;
display: flex; display: flex;
@ -220,6 +221,7 @@ export default {
width: 20px; width: 20px;
height: 20px; height: 20px;
background: rgb(95, 95, 95); background: rgb(95, 95, 95);
border-radius: 4px;
margin-right: 5px; margin-right: 5px;
&.selected { &.selected {
background: rgb(34, 156, 255); background: rgb(34, 156, 255);
@ -233,7 +235,8 @@ export default {
} }
.input { .input {
background-color: #044050; background-color: rgba(0, 0, 0, 0.4);
border-radius: 4px;
padding: 10px; padding: 10px;
margin: 10px; margin: 10px;
align-self: flex-start; align-self: flex-start;
@ -245,7 +248,7 @@ export default {
margin-bottom: 5px; margin-bottom: 5px;
} }
textarea { textarea {
background: #032d38; background-color: rgba(0, 0, 0, 0.4);
resize: none; resize: none;
outline: none; outline: none;
margin-top: 2px; margin-top: 2px;
@ -262,7 +265,8 @@ export default {
.button { .button {
padding: 10px; padding: 10px;
background: #024554; border-radius: 4px;
background-color: rgba(0, 0, 0, 0.4);
-webkit-transition: background 0.3s; -webkit-transition: background 0.3s;
transition: 0.3s; transition: 0.3s;
-webkit-user-select: none; -webkit-user-select: none;
@ -276,7 +280,7 @@ export default {
} }
.button:hover { .button:hover {
background: #02303c; background-color: rgba(0, 0, 0, 0.6);
} }
.button.disabled { .button.disabled {
background: grey; background: grey;