jspsych-tangram 0.0.11 → 0.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/construct/index.browser.js +14 -5
- package/dist/construct/index.browser.js.map +1 -1
- package/dist/construct/index.browser.min.js +8 -8
- package/dist/construct/index.browser.min.js.map +1 -1
- package/dist/construct/index.cjs +14 -5
- package/dist/construct/index.cjs.map +1 -1
- package/dist/construct/index.js +14 -5
- package/dist/construct/index.js.map +1 -1
- package/dist/index.cjs +14 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +14 -5
- package/dist/index.js.map +1 -1
- package/dist/prep/index.browser.js +14 -5
- package/dist/prep/index.browser.js.map +1 -1
- package/dist/prep/index.browser.min.js +8 -8
- package/dist/prep/index.browser.min.js.map +1 -1
- package/dist/prep/index.cjs +14 -5
- package/dist/prep/index.cjs.map +1 -1
- package/dist/prep/index.js +14 -5
- package/dist/prep/index.js.map +1 -1
- package/package.json +1 -1
- package/src/core/components/board/GameBoard.tsx +102 -89
- package/tangram-construct.min.js +8 -8
- package/tangram-prep.min.js +8 -8
package/dist/prep/index.js
CHANGED
|
@@ -3273,19 +3273,28 @@ function GameBoard(props) {
|
|
|
3273
3273
|
const headerStyle = {
|
|
3274
3274
|
display: "flex",
|
|
3275
3275
|
flexDirection: "row",
|
|
3276
|
-
justifyContent: "
|
|
3276
|
+
justifyContent: "center",
|
|
3277
3277
|
alignItems: "center",
|
|
3278
3278
|
padding: "20px",
|
|
3279
3279
|
background: "#f5f5f5",
|
|
3280
3280
|
flex: "0 0 auto"
|
|
3281
3281
|
};
|
|
3282
|
+
const headerContentStyle = {
|
|
3283
|
+
position: "relative",
|
|
3284
|
+
width: `${svgDimensions.width}px`,
|
|
3285
|
+
maxWidth: "100%",
|
|
3286
|
+
display: "flex",
|
|
3287
|
+
justifyContent: "center",
|
|
3288
|
+
alignItems: "center"
|
|
3289
|
+
};
|
|
3282
3290
|
const instructionsStyle = {
|
|
3283
|
-
flexGrow: 1,
|
|
3284
3291
|
fontSize: "20px",
|
|
3285
3292
|
lineHeight: 1.5,
|
|
3286
|
-
|
|
3293
|
+
textAlign: "center"
|
|
3287
3294
|
};
|
|
3288
3295
|
const timerStyle = {
|
|
3296
|
+
position: "absolute",
|
|
3297
|
+
right: 0,
|
|
3289
3298
|
fontSize: "24px",
|
|
3290
3299
|
fontWeight: "bold",
|
|
3291
3300
|
fontFamily: "monospace",
|
|
@@ -3300,14 +3309,14 @@ function GameBoard(props) {
|
|
|
3300
3309
|
justifyContent: "center",
|
|
3301
3310
|
overflow: "hidden"
|
|
3302
3311
|
};
|
|
3303
|
-
return /* @__PURE__ */ React.createElement("div", { className: "tangram-trial-container", style: containerStyle }, (instructions || timeLimitMs > 0) && /* @__PURE__ */ React.createElement("div", { className: "tangram-header", style: headerStyle }, instructions && /* @__PURE__ */ React.createElement(
|
|
3312
|
+
return /* @__PURE__ */ React.createElement("div", { className: "tangram-trial-container", style: containerStyle }, (instructions || timeLimitMs > 0) && /* @__PURE__ */ React.createElement("div", { className: "tangram-header", style: headerStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-header-content", style: headerContentStyle }, instructions && /* @__PURE__ */ React.createElement(
|
|
3304
3313
|
"div",
|
|
3305
3314
|
{
|
|
3306
3315
|
className: "tangram-instructions",
|
|
3307
3316
|
style: instructionsStyle,
|
|
3308
3317
|
dangerouslySetInnerHTML: { __html: instructions }
|
|
3309
3318
|
}
|
|
3310
|
-
), timeLimitMs > 0 && /* @__PURE__ */ React.createElement("div", { className: "tangram-timer", style: timerStyle }, formatTime(timeRemaining))), /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard-wrapper", style: gameboardWrapperStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard", style: getGameboardStyle() }, /* @__PURE__ */ React.createElement(
|
|
3319
|
+
), timeLimitMs > 0 && /* @__PURE__ */ React.createElement("div", { className: "tangram-timer", style: timerStyle }, formatTime(timeRemaining)))), /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard-wrapper", style: gameboardWrapperStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard", style: getGameboardStyle() }, /* @__PURE__ */ React.createElement(
|
|
3311
3320
|
BoardView,
|
|
3312
3321
|
{
|
|
3313
3322
|
controller,
|