margin-bottom: 2rem;
}
+.aspect-box-container {
+ position: relative;
+ padding-top: 100%;
+}
+.aspect-box-content {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+
.button-bar {
+ margin: -0.5ex;
> * {
- margin-left: 0.5ex;
- margin-right: 0.5ex;
- }
- > :first-child {
- margin-left: 0;
- }
- > :last-child {
- margin-right: 0;
+ margin: 0.5ex;
}
}
max-width: none !important;
}
+.pic-end {
+ float: right;
+ margin-left: 1rem;
+ margin-bottom: 1rem;
+}
+
+.pic-start {
+ float: left;
+ margin-right: 1rem;
+ margin-bottom: 1rem;
+}
+
+.png-player {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ .screen {
+ background: black;
+ display: flex;
+ width: 100%;
+ height: auto;
+
+ canvas {
+ flex-grow: 1;
+ -ms-interpolation-mode: nearest-neighbor;
+ image-rendering: crisp-edges;
+ image-rendering: pixelated;
+ }
+ }
+
+ .controls {
+ margin-top: 0.5rem;
+ margin-bottom: 0.5rem;
+ }
+}
+
.quote-alert {
position: relative;
&::after {
}
}
+.raw-html {
+ img[type="image/apng"] {
+ cursor: pointer;
+ }
+}
+
+.slider-container {
+ overflow: hidden;
+ height: 100%;
+ width: 100%;
+
+ > .slider-slides {
+ transition: transform 600ms;
+ }
+ &.horizontal {
+ > .slider-slides {
+ height: 100%;
+ white-space: nowrap;
+ > .slider-slide {
+ display: inline-block;
+ width: 100%;
+ }
+ }
+ }
+ &.vertical {
+ > .slider-slides {
+ width: 100%;
+ }
+ }
+}
+
.snes-button-a,
.snes-button-b,
.snes-button-x,
.snes-button-y {
display: inline-block;
- width: 1.5em;
+ width: 2em;
height: 0;
- padding: .75em 0;
+ padding: 1em 0;
box-shadow: .125ex .125ex .125ex rgba(0, 0, 0, .5);
- border-radius: .75em;
+ border-radius: 1em;
font-size: 90%;
font-weight: bold;
text-align: center;
position: relative;
display: inline-flex;
align-items: center;
+ vertical-align: middle;
width: 2em;
height: 2em;
max-width: 100%;
max-height: 100%;
}
+ .item-map-icon {
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+ }
.strike {
position: absolute;
top: 0;