mirror of
https://github.com/godotengine/godot-website-cover-generator.git
synced 2026-01-06 10:11:15 +03:00
@@ -1,4 +1,4 @@
|
||||
<html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Article cover generator - Godot Engine</title>
|
||||
<link rel="stylesheet" href="styles/normalize.css" />
|
||||
@@ -34,6 +34,13 @@
|
||||
<div class="toolbar-item">
|
||||
<label for="super-text">Supertext</label>
|
||||
<input type="text" id="super-text" value="" />
|
||||
<label>Preset supertexts</label>
|
||||
<div class="toolbar-item-controls">
|
||||
<button id="preset-super-1">Progress report</button>
|
||||
<button id="preset-super-2">Dev snapshot</button>
|
||||
<button id="preset-super-3">Maintenance release</button>
|
||||
<button id="preset-super-4">Release candidate</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="toolbar-spacer"></div>
|
||||
|
||||
@@ -171,6 +171,20 @@ class PreviewGenerator {
|
||||
downloadImage_button.addEventListener("click", () => {
|
||||
this._saveRender();
|
||||
});
|
||||
|
||||
// Event listeners for preset supertext buttons
|
||||
document.getElementById("preset-super-1").addEventListener("click", () => {
|
||||
this._setSuperText("Progress report");
|
||||
});
|
||||
document.getElementById("preset-super-2").addEventListener("click", () => {
|
||||
this._setSuperText("Dev snapshot");
|
||||
});
|
||||
document.getElementById("preset-super-3").addEventListener("click", () => {
|
||||
this._setSuperText("Maintenance release");
|
||||
});
|
||||
document.getElementById("preset-super-4").addEventListener("click", () => {
|
||||
this._setSuperText("Release candidate");
|
||||
});
|
||||
}
|
||||
|
||||
_initEvents() {
|
||||
@@ -458,4 +472,11 @@ class PreviewGenerator {
|
||||
fakeAnchor.setAttribute("href", imageData);
|
||||
fakeAnchor.click();
|
||||
}
|
||||
|
||||
_setSuperText(text) {
|
||||
const superText_input = document.getElementById("super-text");
|
||||
superText_input.value = text;
|
||||
this._debounceUpdateAndRender();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -52,12 +52,12 @@ body {
|
||||
.toolbar-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.toolbar-item label {
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.toolbar-item input[type=file] {
|
||||
@@ -69,9 +69,11 @@ body {
|
||||
border: none;
|
||||
color: var(--button-text-color);
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
padding: 8px 16px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
transition: background 0.3s;
|
||||
}
|
||||
.toolbar-item button:hover {
|
||||
background: var(--button-hover-color);
|
||||
@@ -98,14 +100,14 @@ body {
|
||||
}
|
||||
|
||||
.toolbar-item-controls button {
|
||||
font-size: 12px;
|
||||
padding: 4px 10px;
|
||||
font-size: 10px;
|
||||
padding: 4px 8px;
|
||||
}
|
||||
|
||||
.toolbar-filename-label {
|
||||
color: var(--text-faint-color);
|
||||
cursor: help;
|
||||
font-size: 14px;
|
||||
font-size: 12px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@@ -129,6 +131,8 @@ body {
|
||||
/* CANVAS STYLING. */
|
||||
|
||||
.canvas-container {
|
||||
width: 960px;
|
||||
height: 540px;
|
||||
max-height: 540px;
|
||||
aspect-ratio: 16 / 9;
|
||||
}
|
||||
@@ -137,3 +141,27 @@ body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* MEDIA QUERIES FOR RESPONSIVENESS. */
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.content {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.toolbar-item {
|
||||
flex: 1 1 100%;
|
||||
}
|
||||
|
||||
.toolbar-item--oneline {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user