diff --git a/app/Helpers/Bbcode.php b/app/Helpers/Bbcode.php
index fcd9ef9a9..9ddbaa797 100755
--- a/app/Helpers/Bbcode.php
+++ b/app/Helpers/Bbcode.php
@@ -183,8 +183,8 @@ class Bbcode
'code' => [
'openBbcode' => '/^\[code\]/i',
'closeBbcode' => '[/code]',
- 'openHtml' => '
',
- 'closeHtml' => '
',
+ 'openHtml' => '',
'block' => true,
],
'pre' => [
diff --git a/resources/js/app.js b/resources/js/app.js
index 4b1239e8e..d3076f37b 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -41,6 +41,7 @@ import { Livewire, Alpine } from '../../vendor/livewire/livewire/dist/livewire.e
// Custom AlpineJS Components
import './components/alpine/chatbox';
import './components/alpine/checkboxGrid';
+import './components/alpine/clipboardButton';
import './components/alpine/dialog';
import './components/alpine/dislikeButton';
import './components/alpine/likeButton';
diff --git a/resources/js/components/alpine/clipboardButton.js b/resources/js/components/alpine/clipboardButton.js
new file mode 100644
index 000000000..c0def17b9
--- /dev/null
+++ b/resources/js/components/alpine/clipboardButton.js
@@ -0,0 +1,12 @@
+document.addEventListener('alpine:init', () => {
+ Alpine.data('clipboardButton', () => ({
+ button: {
+ ['x-on:click']() {
+ let text = this.$root
+ .querySelector('pre > code')
+ .innerHTML.replace(/
/g, '\r\n');
+ navigator.clipboard.writeText(text);
+ },
+ },
+ }));
+});
diff --git a/resources/sass/base/_reset.scss b/resources/sass/base/_reset.scss
index 0d34b2ccf..909b4b6cd 100644
--- a/resources/sass/base/_reset.scss
+++ b/resources/sass/base/_reset.scss
@@ -25,7 +25,13 @@ a {
code,
pre {
- font-family: 'Roboto Mono', Menlo, Monaco, Consolas, 'Courier New',
+ font-family:
+ ui-monospace,
+ SFMono-Regular,
+ SF Mono,
+ Menlo,
+ Consolas,
+ Liberation Mono,
monospace;
font-size: 12px;
line-height: 1.46666667;
diff --git a/resources/sass/components/_bbcode-rendered.scss b/resources/sass/components/_bbcode-rendered.scss
index 48c4552d6..f672f8b9d 100644
--- a/resources/sass/components/_bbcode-rendered.scss
+++ b/resources/sass/components/_bbcode-rendered.scss
@@ -229,12 +229,12 @@
ol,
dl,
table,
- pre,
.bbcode-rendered__center,
.bbcode-rendered__left,
.bbcode-rendered__right,
.bbcode-rendered__alert,
- .bbcode-rendered__note {
+ .bbcode-rendered__note,
+ .bbcode-rendered__clipboard {
margin-top: 12px;
margin-bottom: 12px;
}
@@ -383,17 +383,15 @@
}
pre {
- background-color: var(--bbcode-rendered-neutral-muted);
- color: var(--bbcode-rendered-fg-default);
border: revert;
- border-radius: 6px;
font-size: 12px;
word-wrap: normal;
- overflow: visible;
+ overflow: auto;
line-height: inherit;
word-break: break-word;
overflow-wrap: anywhere;
white-space: pre-wrap;
+ margin: 0;
padding: 12px;
}
@@ -402,7 +400,7 @@
margin: 0;
word-break: normal;
overflow-wrap: anywhere;
- white-space: normal;
+ white-space: break-spaces;
font-size: 13px;
background-color: var(--bbcode-rendered-neutral-muted);
border-radius: 6px;
@@ -421,7 +419,9 @@
}
pre > code {
- white-space: pre-wrap;
+ word-break: normal;
+ white-space: pre;
+ background-color: transparent;
}
pre code {
@@ -429,11 +429,36 @@
padding: 0;
overflow: visible;
line-height: inherit;
+ word-wrap: normal;
overflow-wrap: anywhere;
background-color: transparent;
border: 0;
}
+ .bbcode-rendered__clipboard {
+ display: flex;
+ justify-content: space-between;
+ background-color: var(--bbcode-rendered-neutral-muted);
+ color: var(--bbcode-rendered-fg-default);
+ border-radius: 6px;
+ position: relative;
+ overflow: auto;
+ }
+
+ .bbcode-rendered__clipboard-button {
+ display: block;
+ background: transparent;
+ border: none;
+ margin: 6px;
+ color: var(--bbcode-rendered-fg-muted);
+ cursor: pointer;
+ }
+
+ .bbcode-rendered__clipboard-button:hover,
+ .bbcode-rendered__clipboard-button:focus {
+ color: var(--bbcode-rendered-fg-default);
+ }
+
/* Markdown Extra footnotes */
sup {
diff --git a/resources/sass/components/_mediainfo.scss b/resources/sass/components/_mediainfo.scss
index 50218e19c..6e0cd4473 100644
--- a/resources/sass/components/_mediainfo.scss
+++ b/resources/sass/components/_mediainfo.scss
@@ -79,3 +79,15 @@
.mediainfo__encode-settings {
flex-basis: 100%;
}
+
+.mediainfo__encode-settings pre,
+.torrent-mediainfo-dump pre {
+ padding: 12px;
+ background-color: var(--bbcode-rendered-neutral-muted);
+ color: var(--bbcode-rendered-fg-default);
+ border-radius: 6px;
+ font-size: 12px;
+ white-space: pre-wrap;
+ word-break: break-word;
+ overflow-wrap: anywhere;
+}
diff --git a/resources/views/torrent/partials/mediainfo.blade.php b/resources/views/torrent/partials/mediainfo.blade.php
index 76f6bd767..14a189a1d 100644
--- a/resources/views/torrent/partials/mediainfo.blade.php
+++ b/resources/views/torrent/partials/mediainfo.blade.php
@@ -22,7 +22,7 @@