MediaWiki
Group-Grouse.css: Difference between revisions
From Grouse House Wiki
No edit summary |
No edit summary |
||
(41 intermediate revisions by the same user not shown) | |||
Line 27: | Line 27: | ||
} | } | ||
#talkpagelink { | |||
width: 30px; | |||
position: absolute; | |||
right: 7.5em; | |||
top: 0.3em; | |||
} | |||
@media only screen and (max-width: 73.75rem) { | |||
table.mobiletoc { | |||
top: 10em; | |||
} | |||
#sidebarlogo { | |||
top: 2em; | |||
} | |||
} | |||
@media only screen and (max-width: 51.063rem) { | |||
table.mobiletoc { | |||
top: 14em; | |||
} | |||
#sidebarlogo { | |||
top: 1em; | |||
left: 4vw; | |||
} | |||
#sidebarlogo img { | |||
height: 100px; | |||
} | |||
} | |||
@media only screen and (max-width: 47rem) { | |||
table.mobiletoc { | table.mobiletoc { | ||
top: 18em; | |||
} | |||
top: | #sidebarlogo { | ||
top: 4em; | |||
left: 4vw; | |||
} | } | ||
@media only screen and (max-width: | #sidebarlogo img { | ||
height: 100px; | |||
} | |||
} | |||
@media only screen and (max-width: 42.5rem) { | |||
table.mobiletoc { | table.mobiletoc { | ||
width: | top: 18em; | ||
} | |||
#sidebarlogo { | |||
left: | top: 4em; | ||
left: 4vw; | |||
} | |||
#sidebarlogo img { | |||
max-height: | height: 100px; | ||
} | |||
} | |||
Decor preview modal | |||
#decorModalV1 { | |||
display: none; | |||
position: fixed; | |||
z-index: 999; | |||
left: 0; | |||
top: 0; | |||
width: 100%; | |||
height: 100vh; | |||
overflow: hidden; | |||
background-color: rgb(0,0,0); | |||
background-color: rgba(0,0,0,0.4); | |||
} | |||
#decorModalContent { | |||
border: 3px solid transparent; | |||
border-radius: 10px; | |||
height: min(100vh, calc(100vw * .75)); | |||
min-height: min(435px, 100vh); | |||
max-height: 620px; | |||
left: 50%; | |||
max-width: min(640px, 100vw); | |||
overflow: hidden; | |||
padding: 0; | |||
position: fixed; | |||
transform: translate(-50%, -50%); | |||
top: 50%; | |||
width: 100vw; | |||
min-width: 290px; | |||
z-index: 12000; | |||
} | |||
.modalheader { | |||
background-color: #3a5f70; | |||
padding: 10px; | |||
font-weight: bold; | |||
color: white; | |||
} | |||
.decorname { | |||
font-weight: bold; | |||
} | |||
.modalclose { | |||
color: white; | |||
float: right; | |||
font-size: 28px; | |||
font-weight: bold; | |||
} | |||
.modalclose:hover, | |||
.modalclose:focus { | |||
color: black; | |||
text-decoration: none; | |||
cursor: pointer; | |||
} | |||
.modalbody { | |||
height: 91.5%; | |||
} | |||
#decorpreviewimg { | |||
position: fixed; | |||
z-index: 99902; | |||
top: 47%; | |||
left: 50%; | |||
width: 640px; | |||
max-width: 640px; | |||
transform: translate(-50%, -50%); | |||
} | |||
#behinddecorpreviewimg { | |||
position: fixed; | |||
z-index: 99900; | |||
top: 47%; | |||
left: 50%; | |||
width: 640px; | |||
max-width: 640px; | |||
transform: translate(-50%, -50%); | |||
} | |||
#previewbasewolf { | |||
position: fixed; | |||
z-index: 99901; | |||
top: 47%; | |||
left: 50%; | |||
width: 640px; | |||
max-width: 640px; | |||
transform: translate(-50%, -50%); | |||
} | |||
#previewbackground { | |||
top: 47%; | |||
left: 50%; | |||
max-width: 640px; | |||
transform: translate(-50%,-50%); | |||
position: fixed; | |||
width: 640px; | |||
} | |||
.modalfooter { | |||
display: flex; | |||
flex-direction: row; | |||
background: #d4d4d4; | |||
padding: 10px; | |||
align-items: center; | |||
margin-top: -4em; | |||
} | |||
#previewinput { | |||
display: none; | |||
width: 50%; | |||
text-align: right; | |||
} | |||
#previewoptions { | |||
width: 100%; | |||
} | |||
#checkboxesbutton { | |||
background: #acacac; | |||
height: auto; | |||
line-height: 2em; | |||
padding: 5px; | |||
border-radius: 0px; | |||
width: 6em; | |||
text-align: center; | |||
margin-right: 0.8em; | |||
display: none; | |||
} | |||
#checkboxesbutton:hover { | |||
background: #8c8c8c; | |||
cursor: pointer; | |||
} | |||
#decorModalV1 #checkboxes { | |||
position: fixed; | |||
background: #bbb; | |||
padding: 10px; | |||
text-align: center; | |||
top: 70%; | |||
left: 25%; | |||
width: 15em; | |||
max-width: 640px; | |||
transform: translate(-50%,-50%); | |||
z-index: 99999; | |||
padding-top: 20px; | |||
display: none; | |||
} | |||
@media only screen and (max-width: 40rem) { | |||
#decorModalContent { | |||
height: 65vh; | |||
width: 95vw; | |||
} | |||
.modalbody { | |||
height: 63.5%; | |||
} | |||
#decorpreviewimg { | |||
top: 40vh; | |||
left: 50%; | |||
width: 90vw; | |||
} | |||
#behinddecorpreviewimg { | |||
top: 40vh; | |||
left: 50%; | |||
width: 90vw; | |||
} | |||
#previewbasewolf { | |||
top: 40vh; | |||
left: 50%; | |||
width: 90vw; | |||
} | |||
#previewbackground { | |||
top: 40vh; | |||
left: 50%; | |||
width: 90vw; | |||
} | |||
.modalfooter { | |||
margin-top: 9.5vh; | |||
} | |||
} | } |
Latest revision as of 20:43, 21 November 2024
.mw-headline + .mw-editsection { display: none; } h2 { font-size: 0em; } h2.c-header.active { font-size: 1.3em; } h2.c-header.hidden { font-size: 1.3em; } h3 { font-size: 0em; } h3.c-header.active { font-size: 1.1em; } h3.c-header.hidden { font-size: 1.1em; } #talkpagelink { width: 30px; position: absolute; right: 7.5em; top: 0.3em; } @media only screen and (max-width: 73.75rem) { table.mobiletoc { top: 10em; } #sidebarlogo { top: 2em; } } @media only screen and (max-width: 51.063rem) { table.mobiletoc { top: 14em; } #sidebarlogo { top: 1em; left: 4vw; } #sidebarlogo img { height: 100px; } } @media only screen and (max-width: 47rem) { table.mobiletoc { top: 18em; } #sidebarlogo { top: 4em; left: 4vw; } #sidebarlogo img { height: 100px; } } @media only screen and (max-width: 42.5rem) { table.mobiletoc { top: 18em; } #sidebarlogo { top: 4em; left: 4vw; } #sidebarlogo img { height: 100px; } } Decor preview modal #decorModalV1 { display: none; position: fixed; z-index: 999; left: 0; top: 0; width: 100%; height: 100vh; overflow: hidden; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); } #decorModalContent { border: 3px solid transparent; border-radius: 10px; height: min(100vh, calc(100vw * .75)); min-height: min(435px, 100vh); max-height: 620px; left: 50%; max-width: min(640px, 100vw); overflow: hidden; padding: 0; position: fixed; transform: translate(-50%, -50%); top: 50%; width: 100vw; min-width: 290px; z-index: 12000; } .modalheader { background-color: #3a5f70; padding: 10px; font-weight: bold; color: white; } .decorname { font-weight: bold; } .modalclose { color: white; float: right; font-size: 28px; font-weight: bold; } .modalclose:hover, .modalclose:focus { color: black; text-decoration: none; cursor: pointer; } .modalbody { height: 91.5%; } #decorpreviewimg { position: fixed; z-index: 99902; top: 47%; left: 50%; width: 640px; max-width: 640px; transform: translate(-50%, -50%); } #behinddecorpreviewimg { position: fixed; z-index: 99900; top: 47%; left: 50%; width: 640px; max-width: 640px; transform: translate(-50%, -50%); } #previewbasewolf { position: fixed; z-index: 99901; top: 47%; left: 50%; width: 640px; max-width: 640px; transform: translate(-50%, -50%); } #previewbackground { top: 47%; left: 50%; max-width: 640px; transform: translate(-50%,-50%); position: fixed; width: 640px; } .modalfooter { display: flex; flex-direction: row; background: #d4d4d4; padding: 10px; align-items: center; margin-top: -4em; } #previewinput { display: none; width: 50%; text-align: right; } #previewoptions { width: 100%; } #checkboxesbutton { background: #acacac; height: auto; line-height: 2em; padding: 5px; border-radius: 0px; width: 6em; text-align: center; margin-right: 0.8em; display: none; } #checkboxesbutton:hover { background: #8c8c8c; cursor: pointer; } #decorModalV1 #checkboxes { position: fixed; background: #bbb; padding: 10px; text-align: center; top: 70%; left: 25%; width: 15em; max-width: 640px; transform: translate(-50%,-50%); z-index: 99999; padding-top: 20px; display: none; } @media only screen and (max-width: 40rem) { #decorModalContent { height: 65vh; width: 95vw; } .modalbody { height: 63.5%; } #decorpreviewimg { top: 40vh; left: 50%; width: 90vw; } #behinddecorpreviewimg { top: 40vh; left: 50%; width: 90vw; } #previewbasewolf { top: 40vh; left: 50%; width: 90vw; } #previewbackground { top: 40vh; left: 50%; width: 90vw; } .modalfooter { margin-top: 9.5vh; } }