Anonymous user
MediaWiki:Mobile.css: Difference between revisions
m
.msgbox now uses gap.
imported>Ttv pedro270707 mNo edit summary |
imported>Ttv pedro270707 m (.msgbox now uses gap.) |
||
| (28 intermediate revisions by the same user not shown) | |||
| Line 59: | Line 59: | ||
width: 100% !important; | width: 100% !important; | ||
height: 100% !important; | height: 100% !important; | ||
} | |||
/* Inventories (currently only Template:Crafting) */ | |||
.crafting-table-ui { | |||
padding: 6px; | |||
border-image-slice: 3 3 3 3; | |||
border-image-width: 6px 6px 6px 6px; | |||
border-image-outset: 0 0 0 0; | |||
border-image-repeat: stretch stretch; | |||
border-image-source: url(https://static.miraheze.org/btawiki/0/00/BTA_Border.png); | |||
border-style: solid; | |||
image-rendering: pixelated; | |||
image-rendering: crisp-edges; | |||
background-color: #c6c6c6; | |||
display: inline-flex; | |||
align-items: center; | |||
position: relative; | |||
} | |||
/* Infoboxes */ | |||
.infobox { | |||
padding: 8px; | |||
min-width: 200px; | |||
max-width: 300px; | |||
text-align: center; | |||
} | |||
.infobox p { | |||
margin: 0 !important; | |||
} | |||
.infobox.out { | |||
border-image-slice: 3 3 3 3; | |||
border-image-width: 6px 6px 6px 6px; | |||
border-image-outset: 0 0 0 0; | |||
border-image-repeat: stretch stretch; | |||
border-image-source: url("https://static.miraheze.org/btawiki/0/00/BTA_Border.png"); | |||
border-style: solid; | |||
image-rendering: pixelated; | |||
image-rendering: crisp-edges; | |||
background-color: #c6c6c6; | |||
} | |||
.infobox.in { | |||
border-left: 2px solid black; | |||
border-right: 2px solid black; | |||
background-color: #555555; | |||
} | |||
.infobox-table { | |||
margin-top: 6px; | |||
width: 100%; | |||
text-align: left; | |||
} | |||
.infobox-table td, .infobox-table th { | |||
padding-left: 6px; | |||
padding-right: 6px; | |||
} | |||
/* Inventory slot ({{Inventory slot}} template) */ | |||
.inventory-slot { | |||
position: relative; | |||
border-top: 2px solid #373737; | |||
border-left: 2px solid #373737; | |||
border-right: 2px solid #ffffff; | |||
border-bottom: 2px solid #ffffff; | |||
background-color: #8b8b8b; | |||
display: inline-flex; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
.inventory-slot::before, .inventory-slot::after { | |||
content: ''; | |||
position: absolute; | |||
width: 2px; | |||
height: 2px; | |||
background-color: #8b8b8b; | |||
} | |||
.inventory-slot::before { | |||
bottom: -2px; | |||
left: -2px; | |||
} | |||
.inventory-slot::after { | |||
top: -2px; | |||
right: -2px; | |||
} | } | ||
| Line 68: | Line 157: | ||
color: #ffff00; | color: #ffff00; | ||
text-shadow: 0.125em 0.125em 0 #7f7f00; | text-shadow: 0.125em 0.125em 0 #7f7f00; | ||
position: | position: absolute; | ||
display: inline-block; | display: inline-block; | ||
transform-origin: center center; | transform-origin: center center; | ||
left: | left: 100%; | ||
top: | top: 100%; | ||
animation: splash 0.5s linear infinite !important; | animation: splash 0.5s linear infinite !important; | ||
white-space: nowrap; | |||
} | } | ||
| Line 81: | Line 171: | ||
padding: 5px; | padding: 5px; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
display: inline- | display: inline-flex; | ||
align-items: center; | |||
gap: 10px; | |||
} | } | ||
| Line 402: | Line 494: | ||
display: inline-block; | display: inline-block; | ||
width: 0.75em; | width: 0.75em; | ||
} | |||
/* Keyframes */ | |||
@keyframes splash { | |||
0% { | |||
transform: translate(-50%, -50%) scale(1.1) rotateZ(-20deg); | |||
} | |||
10% { | |||
transform: translate(-50%, -50%) scale(1.0690983005625) rotateZ(-20deg); | |||
} | |||
20% { | |||
transform: translate(-50%, -50%) scale(1.0412214747708) rotateZ(-20deg); | |||
} | |||
30% { | |||
transform: translate(-50%, -50%) scale(1.0190983005625) rotateZ(-20deg); | |||
} | |||
40% { | |||
transform: translate(-50%, -50%) scale(1.0048943483705) rotateZ(-20deg); | |||
} | |||
50% { | |||
transform: translate(-50%, -50%) scale(1) rotateZ(-20deg); | |||
} | |||
60% { | |||
transform: translate(-50%, -50%) scale(1.0048943483705) rotateZ(-20deg); | |||
} | |||
70% { | |||
transform: translate(-50%, -50%) scale(1.0190983005625) rotateZ(-20deg); | |||
} | |||
80% { | |||
transform: translate(-50%, -50%) scale(1.0412214747708) rotateZ(-20deg); | |||
} | |||
90% { | |||
transform: translate(-50%, -50%) scale(1.0690983005625) rotateZ(-20deg); | |||
} | |||
100% { | |||
transform: translate(-50%, -50%) scale(1.1) rotateZ(-20deg); | |||
} | |||
} | } | ||