fix(changelog): Fix markdown parsing

This commit is contained in:
alexsparkes 2024-03-23 00:04:21 +00:00
parent ccd6dc2d28
commit ff48319c42
4 changed files with 25 additions and 27 deletions

View File

@ -55,7 +55,7 @@ input {
@include themed { @include themed {
background: t($modal-sidebar); background: t($modal-sidebar);
border: 3px solid t($modal-sidebarActive); border: 1px solid t($modal-sidebarActive);
color: t($color); color: t($color);
} }

View File

@ -1,15 +1,8 @@
.updateChangelog { .updateChangelog {
max-width: 75%; max-width: 75%;
margin-top: 15px;
white-space: pre-wrap; white-space: pre-wrap;
li {
cursor: initial;
font-size: 1rem;
list-style-type: disc;
padding: 0;
margin-left: 20px;
}
a { a {
color: var(--modal-link); color: var(--modal-link);
@ -20,14 +13,8 @@
} }
.changelogtab { .changelogtab {
h1 { .mainTitle {
max-width: 85%; margin: 0 !important;
font-size: 2rem;
margin-bottom: -10px !important;
}
h5 {
line-height: 0 !important;
} }
img { img {

View File

@ -19,13 +19,24 @@ class Changelog extends PureComponent {
} }
parseMarkdown = (text) => { parseMarkdown = (text) => {
text = text.replace(/^\* /gm, '<li>').replace(/\n/g, '</li>'); if (typeof text !== 'string') {
text = text.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>'); throw new Error('Input must be a string');
text = text.replace(/^## (.*$)/gm, '<h3>$1</h3>'); }
text = text.replace(
/((http|https):\/\/[^\s]+)/g, // Replace list items
'<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>', text = text.replace(/^\* (.*$)/gm, '<li>$1</li>');
);
// Wrap list items in <ul></ul>
text = text.replace(/((<li>.*<\/li>\s*)+)/g, '<ul>$1</ul>');
// Replace other markdown syntax
text = text
.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
.replace(/^## (.*$)/gm, '<span class="title">$1</span>')
.replace(
/((http|https):\/\/[^\s]+)/g,
'<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>',
);
return text; return text;
}; };
@ -123,8 +134,8 @@ class Changelog extends PureComponent {
return ( return (
<div className="changelogtab" ref={this.changelog}> <div className="changelogtab" ref={this.changelog}>
<h1>{this.state.title}</h1> <span className="mainTitle">{this.state.title}</span>
<h5>Released on {this.state.date}</h5> <span className="subtitle">Released on {this.state.date}</span>
{this.state.image && ( {this.state.image && (
<img <img
draggable={false} draggable={false}

View File

@ -273,6 +273,6 @@
}, },
{ {
"name": "customEvents", "name": "customEvents",
"value": "[{\"id\":\"widgets.greeting.christmas\",\"name\":\"Merry Christmas\",\"month\":12,\"date\":25},{\"id\":\"widgets.greeting.newyear\",\"name\":\"Happy New Year\",\"month\":1,\"date\":1},{\"id\":\"widgets.greeting.halloween\",\"name\":\"Happy Halloween\",\"month\":10,\"date\":31},{\"id\":\"widgets.greeting.halloween\",\"name\":\"\",\"month\":10,\"date\":31}]" "value": "[{\"id\":\"widgets.greeting.christmas\",\"name\":\"Merry Christmas\",\"month\":12,\"date\":25},{\"id\":\"widgets.greeting.newyear\",\"name\":\"Happy New Year\",\"month\":1,\"date\":1},{\"id\":\"widgets.greeting.halloween\",\"name\":\"Happy Halloween\",\"month\":10,\"date\":31}]"
} }
] ]