copium
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 42s

This commit is contained in:
2025-06-10 23:20:32 +02:00
parent 788a94ebe8
commit 2c78017019

View File

@@ -1,17 +1,73 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="robots" content="noindex" /> <meta name="robots" content="noindex" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hithismani/responsive-decap@main/dist/responsive.css"> <!-- Unminfied --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hithismani/responsive-decap@main/dist/responsive.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hithismani/responsive-decap@main/dist/responsive.min.css"> <!-- Untested, but Minified --> <!-- Unminfied -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hithismani/responsive-decap@main/dist/responsive.min.css">
<!-- Untested, but Minified -->
<title>CMS for my privat page</title> <title>CMS for my privat page</title>
</head> </head>
<body> <body>
<!-- Include the script that builds the page and powers Decap CMS --> <!-- Include the script that builds the page and powers Decap CMS -->
<script src="https://unpkg.com/decap-cms@^3.0.0/dist/decap-cms.js"></script> <script src="https://unpkg.com/decap-cms@^3.0.0/dist/decap-cms.js"></script>
<script src="prefixed-image-widget.js"></script> <script>
// Register the proper prefixed image widget
CMS.registerWidget("prefixed-image", {
// Control component (what editors interact with)
control: createClass({
handleChange: function(e) {
const file = e.target.files[0];
if (!file) return;
// Add prefix to filename
const prefix = "feature-";
const fileName = file.name.startsWith(prefix) ? file.name : prefix + file.name;
const newFile = new File([file], fileName, { type: file.type });
// Upload the file with the new name
this.props.mediaPersist([newFile]).then(urls => {
if (urls && urls.length > 0) {
this.props.onChange(urls[0]);
}
});
},
render: function() {
const value = this.props.value;
return h('div', {},
h('input', {
type: 'file',
accept: 'image/*',
onChange: this.handleChange
}),
value && h('img', {
src: value,
alt: '',
style: { maxWidth: '200px', marginTop: '10px' }
})
);
}
}),
// Preview component (how it appears in the preview pane)
preview: createClass({
render: function() {
return this.props.value ?
h('img', {
src: this.props.value,
alt: '',
style: { maxWidth: '100%' }
}) : null;
}
})
});
</script>
<script> <script>
// Register the OSM shortcode as an editor component // Register the OSM shortcode as an editor component
window.CMS.registerEditorComponent({ window.CMS.registerEditorComponent({
@@ -82,4 +138,5 @@
}); });
</script> </script>
</body> </body>
</html> </html>