diff --git a/README.md b/README.md
index 19e7ce8d..e2ead233 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,8 @@
# mnml
mnml is a turn-based 1v1 strategy game in an abstract setting.
-players craft a team of 3 constructs combining a deep pool of skills, effects and specialisations to mindgame & outplay their opponents in a rapid series of duels.
-featuring complex interactions arising from simple rules, simultaneous turns to increase the pace, and a unique speed mechanic mnml is a tactical game in a genre of its own.
-it is completely free to play and requires no installation.
+Craft a team of 3 constructs combining a deep pool of skills, effects and specialisations to mindgame & outplay opponents in a rapid series of duels.
+Featuring complex interactions arising from simple rules, simultaneous turns to increase the pace, and a unique speed mechanic mnml is a tactical game in a genre of its own.
+It is completely free to play and requires no installation.
minimal studios is ntr & mashy: 2 mates with a friendship forged in the fires of warcraft 3 dota.
we have both bailed out of the big city life and have dedicated ourselves to growing farm fresh, organic, ethical gaming produce in the rolling hills of brisbane and leaves of melbourne.
diff --git a/WORKLOG.md b/WORKLOG.md
index 8f93a003..fd015ca9 100644
--- a/WORKLOG.md
+++ b/WORKLOG.md
@@ -6,6 +6,8 @@
* mobile styles
* mobile info page
+* fix info page for tablet layout
+
* Add TOS and accept to register page
* can't reset password without knowing password =\
diff --git a/client/animations.test.js b/client/animations.test.js
index 3271b840..b447e649 100644
--- a/client/animations.test.js
+++ b/client/animations.test.js
@@ -9,6 +9,6 @@ require('./assets/styles/vbox.less');
require('./assets/styles/game.less');
require('./assets/styles/player.less');
require('./assets/styles/styles.mobile.css');
-require('./assets/styles/instance.mobile.css');
+require('./assets/styles/instance.mobile.less');
require('./src/animations.test.jsx');
diff --git a/client/assets/styles/controls.less b/client/assets/styles/controls.less
index f267351a..80612c3e 100644
--- a/client/assets/styles/controls.less
+++ b/client/assets/styles/controls.less
@@ -44,7 +44,10 @@ aside {
button {
width: 100%;
font-size: 150%;
- margin-bottom: 0.5em;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
}
button.ready:enabled {
diff --git a/client/assets/styles/instance.mobile.less b/client/assets/styles/instance.mobile.less
index 07c76286..21283a59 100644
--- a/client/assets/styles/instance.mobile.less
+++ b/client/assets/styles/instance.mobile.less
@@ -1,5 +1,20 @@
@import 'colours.less';
+// tablet / ipad
+@media (max-width: 1100px) {
+ .instance {
+ grid-template-columns: 1fr2;
+ grid-template-rows: min-content 1fr;
+ grid-template-areas:
+ "vbox"
+ "constructs";
+
+ .info {
+ display: none;
+ }
+ }
+}
+
@media (max-width: 800px) {
.instance {
font-size: 8pt;
@@ -32,6 +47,10 @@
&:not(.visible) {
display: none;
}
+
+ .vbox-vbox {
+ margin-bottom: 1em;
+ }
}
.vbox-arrow {
diff --git a/client/assets/styles/styles.less b/client/assets/styles/styles.less
index 6f47fe2d..db252346 100644
--- a/client/assets/styles/styles.less
+++ b/client/assets/styles/styles.less
@@ -124,6 +124,7 @@ button, input {
font-size: 100%;
flex: 1;
border-radius: 0.5em;
+ line-height: 2em;
/*the transitions */
transition-property: border-color, color, background;
diff --git a/client/assets/styles/vbox.less b/client/assets/styles/vbox.less
index 52a75939..fe62f0a2 100644
--- a/client/assets/styles/vbox.less
+++ b/client/assets/styles/vbox.less
@@ -33,6 +33,7 @@
margin: 0;
background-color: @gray-box;
height: 3em;
+ line-height: 1em;
border-width: 0;
:active, :hover, :focus {
diff --git a/client/src/components/anims/slay.jsx b/client/src/components/anims/slay.jsx
index ef862a2f..0fe0f1c2 100644
--- a/client/src/components/anims/slay.jsx
+++ b/client/src/components/anims/slay.jsx
@@ -21,20 +21,14 @@ function projectile(x, y, radius, colour) {
cx={x}
cy={y}
r={radius}
- fill="url(#grad1)"
- stroke-width="2"
- stroke={colour}
+ fill={colour}
/>
);
}
function sword(colour) {
return (
-
+
);
}
@@ -54,18 +48,11 @@ class Slay extends Component {
version="1.1"
id="slay"
xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 300 400">
-
-
-
-
-
-
-
+ viewBox="0 0 300 300">
+
-
{sword(this.colour)}
{this.charges}
@@ -94,13 +81,14 @@ class Slay extends Component {
translateY: -1 * (window.screen.height) * 0.35,
translateX: 0,
});
- anime.set('#explosion feDisplacementMap', {
- scale: 100,
+
+ anime.set('#slayFilter feDisplacementMap', {
+ scale: 0,
});
anime.set('#sword', {
fill: this.colour,
- stroke: this.colour,
+ opacity: 1,
});
this.animations.push(anime({
@@ -119,10 +107,11 @@ class Slay extends Component {
duration: (duration * 1 / 2),
easing: 'easeInQuad',
}));
+
this.animations.push(anime({
- targets: '#explosion feDisplacementMap',
- scale: 10000,
- loop: false,
+ targets: ['#slayFilter feTurbulence', '#slayFilter feDisplacementMap'],
+ baseFrequency: 100,
+ scale: 100,
delay: (TIMES.TARGET_DELAY_MS + duration * 1 / 2),
duration: (duration * 1 / 2),
easing: 'easeInQuad',
@@ -130,8 +119,7 @@ class Slay extends Component {
this.animations.push(anime({
targets: '#sword',
- fill: '#1FF01F',
- stroke: '#1FF01F',
+ opacity: 0,
delay: (TIMES.TARGET_DELAY_MS + duration + TIMES.POST_SKILL_DURATION_MS * 0.7),
}));
diff --git a/ops/package.json b/ops/package.json
index f0210790..323e1d24 100755
--- a/ops/package.json
+++ b/ops/package.json
@@ -8,13 +8,15 @@
"migrate": "knex migrate:latest",
"migrate:make": "knex migrate:make --",
"test": "echo \"Error: no test specified\" && exit 1",
- "nginx:dev": "sudo cp mnml.gg.DEV.SAMPLE.nginx.conf /etc/nginx/sites-available/mnml.gg.DEV.nginx.conf && sudo ln -nfs /etc/nginx/sites-available/mnml.gg.DEV.nginx.conf /etc/nginx/sites-enabled"
+ "nginx:dev": "sudo cp mnml.gg.DEV.SAMPLE.nginx.conf /etc/nginx/sites-available/mnml.gg.DEV.nginx.conf && sudo ln -nfs /etc/nginx/sites-available/mnml.gg.DEV.nginx.conf /etc/nginx/sites-enabled",
+ "qr": "qrcode-svg --color whitesmoke --background black -f -o mnml.qr.svg \"https://mnml.gg\""
},
"author": "",
"license": "UNLICENSED",
"dependencies": {
"knex": "^0.15.2",
"pg": "^7.4.3",
+ "qrcode-svg": "^1.0.0",
"request": "^2.88.0",
"sdftosvg": "0.0.4",
"uuid": "^3.3.3"