mirror of
https://github.com/danbulant/Nertivia-Client
synced 2026-07-05 11:00:50 +00:00
changed colors for more popouts.
This commit is contained in:
parent
3587d6e96e
commit
017b76e9c1
8 changed files with 55 additions and 26 deletions
|
|
@ -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 {
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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 {
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue