Updated major UI overhaul
This commit is contained in:
516
ui.css
516
ui.css
@@ -21,7 +21,7 @@ body {
|
||||
|
||||
/*font-family: 'Droid Sans';*/
|
||||
font-size: 32px;
|
||||
color: #FFF;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
h1 {
|
||||
@@ -67,6 +67,7 @@ h1 {
|
||||
margin-top: 0.1em;
|
||||
color: #AAA;
|
||||
padding-top: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.color-primary {
|
||||
@@ -80,14 +81,14 @@ h1 {
|
||||
/* Note: We are defining :hover and .active separately because :active:not(.active) isn't working, and to avoid using !important */
|
||||
|
||||
.button:hover {
|
||||
background-color: rgb(27, 80, 55);
|
||||
background-color: #1b5037;
|
||||
}
|
||||
|
||||
.button:active {
|
||||
background-color: rgb(45, 128, 89);
|
||||
background-color: #2d8059;
|
||||
}
|
||||
.button.active {
|
||||
background-color: rgb(27, 80, 55);
|
||||
background-color: #1b5037;
|
||||
}
|
||||
|
||||
.button:disabled, .button.disabled {
|
||||
@@ -134,15 +135,46 @@ h1 {
|
||||
overflow: hidden;
|
||||
|
||||
box-sizing: border-box;
|
||||
border: 3px solid #17452f;
|
||||
|
||||
background-color: #373021;
|
||||
//border: 3px solid #17452f;
|
||||
background-color: rgba(55, 48, 33, 0.8);
|
||||
|
||||
display: flex;
|
||||
|
||||
left: -100%;
|
||||
transition: left 0.2s linear;
|
||||
}
|
||||
|
||||
.home-container {
|
||||
background-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.home-right {
|
||||
width: 22%;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
}
|
||||
.home-left {
|
||||
width: 22%;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
}
|
||||
.home-center {
|
||||
width: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.home-background {
|
||||
background-color: rgba(55, 48, 33, 0.8);
|
||||
}
|
||||
|
||||
.content.in {
|
||||
left: 0%;
|
||||
transition: left 0.2s linear;
|
||||
@@ -156,6 +188,19 @@ h1 {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.contentNoBG.in {
|
||||
left: 0%;
|
||||
transition: left 0.2s linear;
|
||||
}
|
||||
.contentNoBG.out {
|
||||
left: 100%;
|
||||
transition: left 0.2s linear;
|
||||
}
|
||||
|
||||
.contentNoBG.hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.list-filter {
|
||||
width: 25%;
|
||||
padding: 1%;
|
||||
@@ -173,7 +218,7 @@ h1 {
|
||||
|
||||
.list-filter h1 {
|
||||
text-align: center;
|
||||
color: #FFF;
|
||||
color: #ffffff;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@@ -251,7 +296,7 @@ h1 {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #FFF;
|
||||
border: 1px solid #ffffff;
|
||||
margin: 0.5em;
|
||||
|
||||
z-index: 1;
|
||||
@@ -356,16 +401,153 @@ h1 {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-top: 0.2em;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
/* Animated Circles CSS */
|
||||
|
||||
.hexagons {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.hexagons li {
|
||||
position: absolute;
|
||||
display: block;
|
||||
list-style: none;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: rgba(96, 183, 199, 0.5);
|
||||
animation: animate 25s linear infinite;
|
||||
bottom: calc(-150px - 40vh);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(1) {
|
||||
left: 25%;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 20s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(47, 44, 92, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(2) {
|
||||
left: 10%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 25s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(96, 183, 199, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(3) {
|
||||
left: 70%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 20s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(47, 44, 92, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(4) {
|
||||
left: 40%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 15s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(114, 63, 145, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(5) {
|
||||
left: 65%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 20s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(96, 183, 199, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(6) {
|
||||
left: 75%;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 25s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(114, 63, 145, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(7) {
|
||||
left: 35%;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 30s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(47, 44, 92, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(8) {
|
||||
left: 50%;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 35s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(114, 63, 145, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(9) {
|
||||
left: 20%;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 40s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(47, 44, 92, 0.5);
|
||||
}
|
||||
|
||||
.hexagons li:nth-child(10) {
|
||||
left: 85%;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 45s;
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
background: rgba(96, 183, 199, 0.5);
|
||||
}
|
||||
|
||||
@keyframes animate {
|
||||
0% {
|
||||
transform: translateY(0) rotate(0deg);
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
transform: translateY(-60vh) rotate(360deg);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(-120vh) rotate(720deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.home-content-root {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.content-shortcuts {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
width: 24%;
|
||||
padding: 1%;
|
||||
height: 58%;
|
||||
left: 1%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
}
|
||||
@@ -382,51 +564,28 @@ h1 {
|
||||
}
|
||||
|
||||
.content-debug {
|
||||
position: absolute;
|
||||
top: 71%;
|
||||
width: 24%;
|
||||
padding: 1% 0.5em;
|
||||
height: 26%;
|
||||
left: 1%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
}
|
||||
|
||||
.content-feed {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
width: 52%;
|
||||
padding: 1%;
|
||||
height: 19%;
|
||||
left: 26%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
padding: 0.5em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.content-avatar-functions {
|
||||
position: absolute;
|
||||
top: 31%;
|
||||
width: 52%;
|
||||
padding: 1%;
|
||||
height: 37%;
|
||||
left: 26%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
}
|
||||
|
||||
.content-panic {
|
||||
position: absolute;
|
||||
top: 71%;
|
||||
width: 52%;
|
||||
padding: 1%;
|
||||
height: 26%;
|
||||
left: 26%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.content-feed {
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
margin-bottom: 10px;
|
||||
height: 74%;
|
||||
}
|
||||
|
||||
.content-panic .action-btn {
|
||||
@@ -442,13 +601,6 @@ h1 {
|
||||
}
|
||||
|
||||
.content-shortcuts-2 {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
width: 20%;
|
||||
padding: 1%;
|
||||
height: 36.5%;
|
||||
left: 79%;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
}
|
||||
@@ -461,23 +613,49 @@ h1 {
|
||||
text-align: center;
|
||||
}
|
||||
#home .content-shortcuts-2 .action-btn img {
|
||||
width: 2em;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.content-call {
|
||||
position: absolute;
|
||||
top: 49%;
|
||||
width: 20%;
|
||||
padding: 1%;
|
||||
height: 48%;
|
||||
left: 79%;
|
||||
|
||||
.content-profile {
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
|
||||
text-align: center;
|
||||
padding: 0.5em 0 0.5em 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.content-profile .button-root {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.content-profile .profile-btn {
|
||||
padding: 0.5em 0em;
|
||||
text-align: center;
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
display: flex;
|
||||
min-width: 45%;
|
||||
justify-content: center;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.content-profile .profile-btn img {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
.content-profile .profile-btn p {
|
||||
align-self: center;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.content-profile p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@keyframes calling {
|
||||
@@ -485,28 +663,39 @@ h1 {
|
||||
100% {box-shadow: 0 0 2em 1em #0AA48E}
|
||||
}
|
||||
|
||||
.call-profile {
|
||||
width: 8em;
|
||||
height: 8em;
|
||||
border-radius: 50%;
|
||||
margin: 2em 0;
|
||||
.profile-icon {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.profile-pic {
|
||||
width: 10.5em;
|
||||
height: 10em;
|
||||
margin: 0.5em 0;
|
||||
background: #333333;
|
||||
aspect-ratio: 1/cos(30deg);
|
||||
clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
|
||||
}
|
||||
|
||||
.call-profile.calling {
|
||||
animation: calling 2s infinite alternate;
|
||||
}
|
||||
|
||||
.call-name {
|
||||
.profile-username {
|
||||
font-size: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.call-duration {
|
||||
font-size: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
.profile-rank {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.profile-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.content-caption {
|
||||
width: 100%;
|
||||
@@ -659,6 +848,11 @@ h1 {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.row-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.content-world-actions .world-fileSize {
|
||||
position: absolute;
|
||||
top: 7.4em;
|
||||
@@ -868,6 +1062,9 @@ h1 {
|
||||
|
||||
padding: 0.5em;
|
||||
}
|
||||
.world-instancing.group {
|
||||
height: 89%;
|
||||
}
|
||||
.world-instancing.in {
|
||||
left: 35%;
|
||||
transition: left 0.2s linear;
|
||||
@@ -895,6 +1092,14 @@ h1 {
|
||||
display: flex;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
#instance_group {
|
||||
width: 100%;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
}
|
||||
.group #instance_group {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.btn-region .region-select {
|
||||
width: 33.333333%;
|
||||
@@ -912,7 +1117,7 @@ h1 {
|
||||
.btn-region .region-select:hover,
|
||||
.btn-rule .rule-select.active,
|
||||
.btn-rule .rule-select:hover {
|
||||
background-color: rgba(27, 80, 55, 1);
|
||||
background-color: #1b5037;
|
||||
}
|
||||
|
||||
.inp-hidden {
|
||||
@@ -1063,6 +1268,10 @@ h1 {
|
||||
width: 8.000000em;
|
||||
}
|
||||
|
||||
.content-instance-information .hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.content-instance-buttons {
|
||||
position: absolute;
|
||||
top: 77%;
|
||||
@@ -1073,7 +1282,7 @@ h1 {
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
|
||||
|
||||
display: flex;
|
||||
}
|
||||
.content-instance-buttons .instance-btn {
|
||||
@@ -1147,7 +1356,7 @@ h1 {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #FFF;
|
||||
border: 2px solid #ffffff;
|
||||
margin: 1em;
|
||||
|
||||
z-index: 1;
|
||||
@@ -1437,12 +1646,12 @@ h1 {
|
||||
border: 3px solid #59885d;
|
||||
|
||||
background-color: #373021;
|
||||
|
||||
|
||||
padding: 1em;
|
||||
|
||||
left: -100%;
|
||||
transition: left 0.2s linear;
|
||||
|
||||
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
@@ -1551,7 +1760,7 @@ h1 {
|
||||
box-sizing: border-box;
|
||||
border: 3px solid #59885d;
|
||||
|
||||
background-color: rgba(27, 80, 55, 0.5);
|
||||
background-color: rgba(27, 80, 55, 0.8);
|
||||
|
||||
display: flex;
|
||||
}
|
||||
@@ -1563,12 +1772,12 @@ h1 {
|
||||
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
color: #FFF;
|
||||
color: #ffffff;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.toolbar-btn.deactivated {
|
||||
background-color: rgba(14, 40, 27, 1);
|
||||
background-color: rgba(14, 40, 27, 0.4);
|
||||
}
|
||||
|
||||
.toolbar-btn + .toolbar-btn {
|
||||
@@ -1582,7 +1791,7 @@ h1 {
|
||||
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
color: #FFF;
|
||||
color: #ffffff;
|
||||
font-size: 1.3em;
|
||||
|
||||
border-left: 3px solid #59885d;
|
||||
@@ -1692,7 +1901,7 @@ h1 {
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 0;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border: 0.25em solid rgb(128, 128, 128);
|
||||
}
|
||||
|
||||
@@ -1706,10 +1915,10 @@ h1 {
|
||||
|
||||
/*Settings*/
|
||||
.settings-categorie {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
.settings-categorie.active {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
.settings-categorie h1 {
|
||||
margin-top: 0;
|
||||
@@ -1740,20 +1949,37 @@ h1 {
|
||||
margin-bottom: 1em;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.message-image {
|
||||
width: 5em;
|
||||
height: 5em;
|
||||
height: 100%;
|
||||
|
||||
border-right: 3px solid #59885d;
|
||||
|
||||
margin-right: 1em;
|
||||
margin-right: 0.6em;
|
||||
}
|
||||
|
||||
.message-text-wrapper {
|
||||
flex: 1;
|
||||
padding: 0.5em 0;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.message-name {
|
||||
font-size: 1.3em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.message-text {
|
||||
margin-right: 0.6em;
|
||||
padding-left: 0.4em;
|
||||
padding-top: 0.4em;
|
||||
}
|
||||
|
||||
.button-root {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.message-btn {
|
||||
@@ -1779,21 +2005,21 @@ h1 {
|
||||
height: 79vh;
|
||||
}
|
||||
.noMessagesInfo {
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
border-radius: 0.25em;
|
||||
border: 3px solid #59885d;
|
||||
|
||||
display: flex;
|
||||
display: flex;
|
||||
|
||||
top: 38%;
|
||||
bottom: 38%;
|
||||
height: auto;
|
||||
top: 38%;
|
||||
bottom: 38%;
|
||||
height: auto;
|
||||
|
||||
left: 20%;
|
||||
width: 60%;
|
||||
left: 20%;
|
||||
width: 60%;
|
||||
|
||||
padding: 1.2em;
|
||||
padding: 1.2em;
|
||||
}
|
||||
|
||||
.noMessagesInfo img {
|
||||
@@ -1982,7 +2208,7 @@ h1 {
|
||||
border-radius: 0.25em;
|
||||
padding: 0.5em;
|
||||
margin-left: -0.05em;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/*Quick Menu*/
|
||||
@@ -2002,21 +2228,21 @@ h1 {
|
||||
background-color: rgba(128, 128, 128, 0.8);
|
||||
|
||||
position: absolute;
|
||||
|
||||
|
||||
top: 140px;
|
||||
left: 140px;
|
||||
|
||||
|
||||
padding: 0.25em 0;
|
||||
}
|
||||
|
||||
.quick-menu-wrapper .action-btn {
|
||||
width: 10em;
|
||||
height: 10em;
|
||||
width: 10em;
|
||||
height: 10em;
|
||||
|
||||
padding: 1em;
|
||||
margin: 0.5em 1em;
|
||||
padding: 1em;
|
||||
margin: 0.5em 1em;
|
||||
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
.quick-menu-wrapper .action-btn img {
|
||||
width: 7.2em;
|
||||
@@ -2122,7 +2348,7 @@ h1 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
|
||||
display: flex;
|
||||
}
|
||||
.keyboard-row + .keyboard-row {
|
||||
@@ -2153,7 +2379,7 @@ h1 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 0;
|
||||
|
||||
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
line-height: 1.5em;
|
||||
@@ -2171,7 +2397,7 @@ h1 {
|
||||
.keyboard-key.active,
|
||||
.keyboard-mod.active,
|
||||
.keyboard-func.active {
|
||||
background-color: rgba(27, 80, 55, 1);
|
||||
background-color: #1b5037;
|
||||
}
|
||||
.keyboard-key + .keyboard-key,
|
||||
.keyboard-key + .keyboard-mod,
|
||||
@@ -2291,7 +2517,7 @@ h1 {
|
||||
text-align: center;
|
||||
line-height: 1.333333em;
|
||||
font-size: 1.5em;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
}
|
||||
.inp_number {
|
||||
border: 1px solid #59885d;
|
||||
@@ -2303,7 +2529,7 @@ h1 {
|
||||
text-align: center;
|
||||
line-height: 1.333333em;
|
||||
font-size: 1.5em;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
#avatar-settings {
|
||||
@@ -2322,7 +2548,7 @@ h1 {
|
||||
.advAvtrProfName {
|
||||
flex: 1;
|
||||
border: 2px solid #59885d;
|
||||
|
||||
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@@ -2443,8 +2669,8 @@ h1 {
|
||||
}
|
||||
|
||||
.numpadButton.btn-back {
|
||||
top: 0;
|
||||
background: #E43600;
|
||||
top: 0;
|
||||
background: #E43600;
|
||||
}
|
||||
.numpadButton.btn-back:hover {
|
||||
background: #f56b40;
|
||||
@@ -2636,7 +2862,6 @@ h1 {
|
||||
.settings-categorie .contact-icons {
|
||||
position: relative;
|
||||
display: flex;
|
||||
margin-bottom: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
.settings-categorie .contact-icons .contact-icon {
|
||||
@@ -2646,7 +2871,25 @@ h1 {
|
||||
.settings-categorie .contact-icons .contact-icon img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.settings-categorie .contact-icons-center {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
.settings-categorie .contact-icons-center .contact-icon {
|
||||
position: relative;
|
||||
width: 33.3333%;
|
||||
}
|
||||
.settings-categorie .contact-icons-center .contact-icon img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.settings-categorie .text-wrapper {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -2742,7 +2985,7 @@ td div {
|
||||
height: 70px;
|
||||
font-size: 30px;
|
||||
color: #333333;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.option-caption.nsfw-toggle-caption {
|
||||
@@ -2781,7 +3024,7 @@ td div {
|
||||
width: 60%;
|
||||
top: 100%;
|
||||
height: 10%;
|
||||
|
||||
|
||||
z-index: 10000;
|
||||
}
|
||||
.message-box.loading-box.in {
|
||||
@@ -2800,7 +3043,7 @@ td div {
|
||||
position: absolute;
|
||||
margin: 10px;
|
||||
background: url("gfx/nav-friends.svg") no-repeat;
|
||||
background-color: #222222;
|
||||
background-color: #373021;
|
||||
background-size: 60px 34px;
|
||||
background-position: 0 10px;
|
||||
padding: 10px;
|
||||
@@ -2882,7 +3125,7 @@ img[data-loading-url] {
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
.color-indicator.half {
|
||||
@@ -2911,18 +3154,35 @@ img[data-loading-url] {
|
||||
margin-left: -180px;
|
||||
}
|
||||
.log-entry {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.log-time {
|
||||
width: 100px;
|
||||
flex-shrink: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.log-message {
|
||||
|
||||
flex-grow: 1;
|
||||
width: 95%;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.log-divider {
|
||||
border: 0;
|
||||
height: 1px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.log-level-ERROR {
|
||||
color: #BB0000;
|
||||
}
|
||||
|
||||
.log-level-WARNING {
|
||||
color: #BBBB00;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user