mirror of
https://github.com/86Box/86box.github.io.git
synced 2026-02-21 09:05:35 -07:00
Improve media embed templates
This commit is contained in:
RichardG867
@@ -1,8 +1,24 @@
|
||||
<figure class="image">
|
||||
<a href="{{ include.url }}"><img class="image" src="{{ include.thumbnail | default: include.url }}" /></a>
|
||||
{% if include.description %}
|
||||
<figcaption><div class="imagecaption" markdown="block">
|
||||
{{ include.description }}
|
||||
</div></figcaption>
|
||||
{% endif %}
|
||||
{%- assign thumbnail = include.thumbnail | default: include.url -%}
|
||||
{%- assign alt = include.alt | default: include.description | normalize_whitespace -%}
|
||||
{%- if include.url -%}
|
||||
<a href="{{ include.url }}"
|
||||
{% if alt %}
|
||||
title="{{ alt }}"
|
||||
{% endif %}
|
||||
>
|
||||
{%- endif -%}
|
||||
<img class="image" src="{{ thumbnail }}"
|
||||
{%- if alt %}
|
||||
alt="{{ alt }}"
|
||||
{%- endif -%}
|
||||
/>
|
||||
{%- if include.url -%}
|
||||
</a>
|
||||
{%- endif -%}
|
||||
{%- if include.description -%}
|
||||
<figcaption class="image-caption">
|
||||
{{- include.description | markdownify -}}
|
||||
</figcaption>
|
||||
{%- endif -%}
|
||||
</figure>
|
||||
|
||||
@@ -1,11 +1,17 @@
|
||||
{{ include.separator | default: "<hr />" }}
|
||||
<figure class="image">
|
||||
<img src="{{ include.url }}" class="heading"
|
||||
{%- if include.heading %}
|
||||
<a name="{{ include.heading | slugify }}">
|
||||
{%- endif %}
|
||||
<img src="{{ include.url }}" class="heading"
|
||||
{% if include.heading %}
|
||||
alt="{{ include.heading }}"
|
||||
alt="{{ include.heading }}"
|
||||
{% endif %}
|
||||
{% if include.tooltip or include.heading %}
|
||||
title="{{ include.tooltip | default: include.heading }}"
|
||||
title="{{ include.tooltip | default: include.heading }}"
|
||||
{% endif %}
|
||||
/>
|
||||
/>
|
||||
{%- if include.heading %}
|
||||
</a>
|
||||
{%- endif %}
|
||||
</figure>
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
<div class="image">
|
||||
<iframe class="youtube" src="https://www.youtube-nocookie.com/embed/{{ include.video }}"><a href="https://www.youtube.com/watch?v={{ include.video }}">[Watch YouTube video]</a></iframe>
|
||||
{% if include.description %}
|
||||
<div class="imagecaption" markdown="block">
|
||||
{{ include.description }}
|
||||
<figure class="youtube">
|
||||
<div class="youtube">
|
||||
<iframe class="youtube" src="https://www.youtube-nocookie.com/embed/{{ include.video }}"><a href="https://www.youtube.com/watch?v={{ include.video }}">[Watch YouTube video]</a></iframe>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{%- if include.description -%}
|
||||
<figcaption class="image-caption">
|
||||
{{- include.description | markdownify -}}
|
||||
</figcaption>
|
||||
{%- endif -%}
|
||||
</figure>
|
||||
|
||||
@@ -204,7 +204,7 @@ An AC'97 codec implementation was developed by [**richardg867**](https://github.
|
||||
|
||||
Due to the way the PCI bus works, PCI-based machines have a limited number of slots to work with, with the exact slot count varying from one machine to the other. In previous versions of 86Box, running out of PCI slots (often an issue with Voodoo 2 SLI setups) resulted in a silent failure; no error message would be shown, and any cards that didn't "fit" simply wouldn't work.
|
||||
|
||||
[**richardg867**](https://github.com/richardg867) worked around this limitation by implementing emulation of the **DEC 21150** PCI-PCI bridge. This bridge takes up a single PCI slot and provides 9 more slots; it is automatically deployed whenever the emulated machine runs out of available PCI slots, and works without any additional drivers or setup on the operating system side, although some devices may not work correctly under a bridge, such as the game port built into the Ensoniq AudioPCI sound card on Windows.<a name="linux" />
|
||||
[**richardg867**](https://github.com/richardg867) worked around this limitation by implementing emulation of the **DEC 21150** PCI-PCI bridge. This bridge takes up a single PCI slot and provides 9 more slots; it is automatically deployed whenever the emulated machine runs out of available PCI slots, and works without any additional drivers or setup on the operating system side, although some devices may not work correctly under a bridge, such as the game port built into the Ensoniq AudioPCI sound card on Windows.
|
||||
|
||||
|
||||
{% include imageheading.html url="/assets/images/v3.0/linux.png" heading="One more thing: Linux is coming" %}
|
||||
|
||||
@@ -14,7 +14,7 @@ This is the April 2022 update to 86Box, bringing **macOS support**, bugfixes and
|
||||
|
||||
## Now with macOS
|
||||
|
||||
Continuing on the cross-platform development effort started during [v3.0]({% post_url 2021-12-01-86box-v3-0 %}#linux) and first released for Linux on [v3.2]({% post_url 2022-02-16-86box-v3-2 %}#now-with-linux), we now provide **Intel macOS** builds of 86Box. These should work on macOS High Sierra 10.13 and newer, natively on Intel Macs and through Rosetta 2 on Apple Silicon Macs. [dob205](https://github.com/dob205) was our main macOS tester, while [**jgilje**](https://github.com/jgilje), [**Cacodemon345**](https://github.com/Cacodemon345) and other contributors did the OS integration work.
|
||||
Continuing on the cross-platform development effort started during [v3.0]({% post_url 2021-12-01-86box-v3-0 %}#one-more-thing-linux-is-coming) and first released for Linux on [v3.2]({% post_url 2022-02-16-86box-v3-2 %}#now-with-linux), we now provide **Intel macOS** builds of 86Box. These should work on macOS High Sierra 10.13 and newer, natively on Intel Macs and through Rosetta 2 on Apple Silicon Macs. [dob205](https://github.com/dob205) was our main macOS tester, while [**jgilje**](https://github.com/jgilje), [**Cacodemon345**](https://github.com/Cacodemon345) and other contributors did the OS integration work.
|
||||
|
||||
As with Linux, there is currently no 86Box manager for macOS, but you can manage emulated machines by **making copies** of `86Box.app` on different places (just dragging it to `/Applications` is currently not recommended); the `roms/` directory (containing the ROM set) must be placed next to the .app ([example](/assets/images/v3.4/roms.png)\), and the emulated machine's files will be saved next to the .app as well.
|
||||
|
||||
|
||||
@@ -52,9 +52,6 @@ img.image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
div.imagecaption {
|
||||
display: inline;
|
||||
}
|
||||
hr {
|
||||
border-color: #808080;
|
||||
width: 100%;
|
||||
|
||||
@@ -85,7 +85,7 @@ img.heading, img.image {
|
||||
margin-top: 10pt;
|
||||
margin-bottom: 5pt;
|
||||
}
|
||||
div.imagecaption {
|
||||
.image-caption {
|
||||
text-align: center;
|
||||
margin-bottom: 10pt;
|
||||
}
|
||||
|
||||
@@ -153,14 +153,12 @@ div#socialold {
|
||||
p, ul, ol {
|
||||
margin: 0.65em 0;
|
||||
}
|
||||
.image {
|
||||
text-align: center;
|
||||
}
|
||||
div.image, figure.image {
|
||||
div.image, figure {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
text-align: center;
|
||||
}
|
||||
img.heading {
|
||||
max-width: 100%;
|
||||
@@ -172,10 +170,7 @@ img.image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
div.imagecaption {
|
||||
display: inline;
|
||||
}
|
||||
div.imagecaption > p {
|
||||
.image-caption > p {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
@@ -237,14 +232,26 @@ code {
|
||||
padding-left: 3pt;
|
||||
padding-right: 3pt;
|
||||
}
|
||||
figure.youtube {
|
||||
|
||||
}
|
||||
div.youtube {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
max-width: 640px;
|
||||
margin: 0 auto;
|
||||
aspect-ratio: 16/9;
|
||||
}
|
||||
iframe {
|
||||
display: block;
|
||||
border: none;
|
||||
}
|
||||
iframe.youtube {
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
width: 640px;
|
||||
height: 360px;
|
||||
padding-bottom: 8pt;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user