diff --git a/src/pages/drag/index.astro b/src/pages/drag/index.astro index 638453a..bd74abc 100644 --- a/src/pages/drag/index.astro +++ b/src/pages/drag/index.astro @@ -293,15 +293,18 @@ import Layout from '../../layouts/Layout.astro'; fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`) .then(response => response.json()) .then(({ data }) => { + // console.log(data) const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; // Base font size for your text - const baseFontSize = 20; + const baseFontSize = 30; // Calculate responsive font size based on screen width const responsiveFontSize = (window.innerWidth / 950) * baseFontSize; // Adjust 800 to your desired reference width - const descrptText = this.add.text(screenCenterX, 70, data.description, { - font: `600 ${responsiveFontSize}px Quicksand`, + const descrptText = this.add.text(screenCenterX, 95, data.description, { + font: ` ${responsiveFontSize}px Quicksand`, fill: '#7c4c23', }).setOrigin(0.5); + this.add.text(displayW / 14 - 15, 50, data.LearningArea, {font: `20px`}).setTint(0x7c4c23); + this.add.text(displayW / 14 - 15, 70, data.LearningSubArea_copy, {font: `19px`}).setTint(0x7c4c23); // Left Image Name this.add.text(displayW / 14 - 15, 240, data.left_image1_name).setTint(0x7c4c23); this.add.text(displayW / 14 - 15, 409, data.left_image2_name).setTint(0x7c4c23); diff --git a/src/pages/drawing/index.astro b/src/pages/drawing/index.astro index 37f5d46..f04f406 100644 --- a/src/pages/drawing/index.astro +++ b/src/pages/drawing/index.astro @@ -24,6 +24,8 @@ import Layout from '../../layouts/Layout.astro'; noticeHeight = 0; downloadWidth = 67; downloadHeight = 200; + learningWidth = 200; + learningHeight = 400 } else { submitWidth = 380; submitHeight = 95; @@ -31,6 +33,8 @@ import Layout from '../../layouts/Layout.astro'; noticeHeight = 0; downloadWidth = 180; downloadHeight = 70; + learningWidth = 450; + learningHeight = 400 } var assetsList = {} var snapshotButton; @@ -105,10 +109,13 @@ import Layout from '../../layouts/Layout.astro'; fetch(`https://management.beanstalkedu.com/items/game_drawing/${encodeURIComponent(paramsID)}`) .then(response => response.json()) .then(({ data }) => { + console.log(data) const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; const baseFontSize = 15; const responsiveFontSize = (window.innerWidth / 280) * baseFontSize; const descrptText = this.add.text(screenCenterX, 70, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#7c4c23', }).setOrigin(0.5); + this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight, data.LearningArea, {font: `20px`}).setTint(0X7C4C23) + this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight + 20, data.LearningSubArea, {font: `20px`}).setTint(0X7C4C23) }) .catch(error => { console.error('Error fetching initial data:', error); diff --git a/src/pages/tick/v1.astro b/src/pages/tick/v1.astro index 4dcbb39..343ba2d 100644 --- a/src/pages/tick/v1.astro +++ b/src/pages/tick/v1.astro @@ -10,9 +10,13 @@ import Layout from "../../layouts/Layout.astro";

Tick

-

+
+

+

+
+

-
+
-

+
+

+

+
+

-
-
+
+
-
+
-
+

- +
@@ -89,6 +93,7 @@ import Layout from "../../layouts/Layout.astro"; .then(res => res.json()) .then(data => { gameData = data.data; + console.log(gameData) document.getElementById("gameDescription").innerHTML = gameData.description; if(gameData.label1){ document.getElementById("label1").innerHTML = gameData.label1; @@ -117,6 +122,8 @@ import Layout from "../../layouts/Layout.astro"; if(gameData.label9){ document.getElementById("label9").innerHTML = gameData.label9; } + document.getElementById('LearningArea').innerHTML = gameData.LearningArea; + document.getElementById('LearningSubArea_copy').innerHTML = gameData.LearningSubArea_copy; const assetsURL = 'https://management.beanstalkedu.com/assets/'; for (let i = 1; i <= 9; i++) { const imageId = `image${i}`; @@ -386,6 +393,11 @@ import Layout from "../../layouts/Layout.astro"; font-size: 20px; padding-top: 10px; } + #LearningArea, #LearningSubArea_copy{ + font-size: 20px; + color: #7C4C23; + font-weight: bold; + } .round-checkbox-label { display: inline-block; cursor: pointer;