TreeIsLife (talk | contribs) No edit summary |
TreeIsLife (talk | contribs) No edit summary |
||
Line 123: | Line 123: | ||
line-height: 1; |
line-height: 1; |
||
text-align: center; |
text-align: center; |
||
⚫ | |||
+ | } |
||
+ | |||
+ | #skinchange-dark, #skinchange-light { |
||
cursor: pointer; |
cursor: pointer; |
||
} |
} |
||
Line 128: | Line 132: | ||
#skinchange-dark { |
#skinchange-dark { |
||
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/c/cf/SkinToggle-Moon.png/revision/latest) center no-repeat; |
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/c/cf/SkinToggle-Moon.png/revision/latest) center no-repeat; |
||
+ | |||
⚫ | |||
} |
} |
||
#skinchange-light { |
#skinchange-light { |
||
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/1/15/SkinToggle-Sun.png/revision/latest) center no-repeat; |
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/1/15/SkinToggle-Sun.png/revision/latest) center no-repeat; |
||
− | cursor: pointer; |
||
} |
} |
||
Revision as of 14:04, 1 March 2021
#skinchange-button {
text-align: center;
margin: 0.5em;
overflow: hidden;
cursor: pointer;
line-height: 1;
display: flex;
justify-content: center;
box-shadow: 0 0 1em black;
height: 40px;
}
.skin-hydradark #skinchange-button:hover .skinchange-button-dark {
margin-left: calc(-2em - 100%);
}
.skin-hydra #skinchange-button:hover .skinchange-button-light {
margin-right: calc(-2em - 100%);
}
.skinchange-button-dark,
.skinchange-button-light {
transform: skew(-20deg);
flex-grow: 1;
padding: 0.25em 0;
overflow: hidden;
transition: 0.5s;
opacity: 1;
color: transparent;
}
.skinchange-button-dark::before {
/*background:url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/c/cf/SkinToggle-Moon.png/revision/latest?cb=20210227112620);*/
}
.skinchange-button-dark {
background-color: #333;
margin: 0 0 0 -5%;
}
.skinchange-button-light {
background-color: #CCC;
margin: 0 -5% 0 0;
}
.skin-hydradark .skinchange-button-light {
background-color: #CCC;
}
.skinchange-button-dark::before,
.skinchange-button-light::before {
font-size: 2em;
transform: skew(20deg);
display: inline-block;
width: 32px;
}
#skinchange-alert {
text-align: center;
z-index: 100000;
position: fixed;
left: 25vw;
top: 25vh;
/*height: 50vh;*/
width: 50vw;
display: flex;
/*justify-content: space-around;*/
flex-direction: column;
/*box-sizing: border-box;*/
background-color: rgb(249,249,249);
box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
margin: 5px 5px 5px 5px;
padding: 5px 5px 5px 5px;
border-radius: 6px;
/*overflow: auto;*/
background-clip: padding-box;
color: #000;
}
@media (max-width:720px){
#skinchange-alert {
left:5vw;
width:90vw;
float:center;
}
}
@media (max-width:401px){
#skinchange-alert {
left:0;
width:95%;
}
}
.skinchange-header {
}
.skinchange-choice-outer {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.skinchange-choice {
height: 128px;
width: 64px;
padding: 0.5em;
line-height: 1;
text-align: center;
font-size: 10vmin;
/*cursor: pointer;*/
}
#skinchange-x {
/*position: absolute;*/
top: 0;
right: 0;
float: right;
height: 1em;
width: 1em;
line-height: 1;
text-align: center;
cursor: pointer;
}
#skinchange-dark, #skinchange-light {
cursor: pointer;
}
#skinchange-dark {
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/c/cf/SkinToggle-Moon.png/revision/latest) center no-repeat;
}
#skinchange-light {
background: url(https://static.wikia.nocookie.net/raft_gamepedia_en/images/1/15/SkinToggle-Sun.png/revision/latest) center no-repeat;
}
.headerbar {
background: -webkit-radial-gradient(center,ellipse cover,rgba(181,153,99,1) 0%,rgba(144,114,69,1) 100%);
/*cursor:move;*/
color: #FFF;
font-size: 1.5em;
}