Rebranding and minor polishing, part 2

This commit is contained in:
tobspr 2022-06-02 14:06:33 +02:00
parent c848f21725
commit 559c0fa854
19 changed files with 69 additions and 55 deletions

View File

@ -60,7 +60,7 @@ function createWindow() {
useContentSize: false,
minWidth: 800,
minHeight: 600,
title: "shapez.io Standalone",
title: "shapez",
transparent: false,
icon: path.join(__dirname, "favicon" + faviconExtension),
// fullscreen: true,

View File

@ -13,7 +13,7 @@ A great place to get help with mod development is the official [shapez.io modloa
## Setting up your development environment
The simplest way of developing mods is by just creating a `mymod.js` file and putting it in the `mods/` folder of the standalone (You can find the `mods/` folder by clicking "Open Mods Folder" in the shapez.io Standalone, be sure to select the 1.5.0-modloader branch on Steam).
The simplest way of developing mods is by just creating a `mymod.js` file and putting it in the `mods/` folder of the standalone (You can find the `mods/` folder by clicking "Open Mods Folder" in the shapez Standalone, be sure to select the 1.5.0-modloader branch on Steam).
You can then add `--dev` to the launch options on Steam. This adds an application menu where you can click "Restart" to reload your mod, and will also show the developer console where you can see any potential errors.

View File

@ -0,0 +1 @@
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 755.01 213.12"><defs><style>.cls-1{fill:#fff;}</style></defs><path class="cls-1" d="M135.39,64.45v34.8h33.8v26.1h-34.1v53c0,11.7,6.5,17.4,15.9,17.4a35.5,35.5,0,0,0,14.7-3.7l8.5,25.9a66.34,66.34,0,0,1-25.1,5.2c-26.6,1-44-14.2-44-44.8v-53H82.19V99.25h22.9V67.65Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M301.89,160.45c0,35.3-24.1,63.9-63.9,63.9s-63.8-28.6-63.8-63.9c0-35.1,24.4-63.9,63.4-63.9S301.89,125.35,301.89,160.45Zm-97.3,0c0,18.7,11.2,36.1,33.3,36.1s33.3-17.4,33.3-36.1c0-18.4-12.9-36.3-33.3-36.3C216,124.15,204.59,142.05,204.59,160.45Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M343.59,64.45v51.2C350.79,103,371,96,383.89,96c35.8,0,62.4,21.9,62.4,64.2,0,40.3-27.1,64.2-63.2,64.2-14.9,0-30.1-5-39.6-19.7l-2,16.9h-28.4v-154Zm2,95.8c0,22.1,16.4,36.1,35.6,36.1,19.4,0,34.8-14.7,34.8-36.1,0-22.1-15.4-35.8-34.8-35.8C362,124.45,345.59,138.85,345.59,160.25Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M536.39,131.65c-8.7-8.2-18.7-10.9-30.4-10.9-14.4,0-22.4,4.5-22.4,12.2,0,8,7.2,12.4,22.9,13.4,23.1,1.5,52.5,6.7,52.5,39.3,0,21.6-17.7,40.3-52.7,40.3-19.4,0-38.8-3.2-56.7-21.9l14.9-21.6c8.7,9.7,28.6,16.9,42.3,17.2,11.4.2,22.1-5.7,22.1-14.7,0-8.5-7-11.9-24.4-12.9-23.1-1.7-50.7-10.2-50.7-38.1,0-28.4,29.4-38.3,51.7-38.3,19.2,0,33.6,3.7,47.8,16.2Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M569.39,256.25V99h28.4l2,16.9c9.5-13.7,25.9-19.7,39.8-19.7,37.8,0,62.9,28.1,62.9,64.2,0,35.8-22.6,64.2-61.9,64.2-12.9,0-32.1-4-40.8-17.4v49h-30.4Zm102.8-95.8c0-19.2-12.9-34.8-34.8-34.8s-34.8,15.7-34.8,34.8,14.2,34.8,34.8,34.8S672.19,179.65,672.19,160.45Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M740.59,99.05l2.2,14.2c9.5-15.2,22.1-17.4,34.6-17.4,12.7,0,24.9,5,31.6,11.7L795.29,134c-6.2-5.2-11.9-8-21.9-8-15.9,0-30.6,8.5-30.6,31.1v64.7h-30.3V99.15Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M646.41,277.57a20.43,20.43,0,0,1-7.52-1.35,18,18,0,0,1-6-3.8,17.28,17.28,0,0,1-3.92-5.76,19.32,19.32,0,0,1,0-14.49,17.06,17.06,0,0,1,4-5.76,18.16,18.16,0,0,1,6-3.8,20.43,20.43,0,0,1,7.52-1.35,21.39,21.39,0,0,1,7.48,1.27,14.84,14.84,0,0,1,5.78,3.88l-2.34,2.4a13.42,13.42,0,0,0-5-3.22,17.23,17.23,0,0,0-5.81-1,16.54,16.54,0,0,0-6.1,1.09,14.44,14.44,0,0,0-8.06,7.81,15.71,15.71,0,0,0,0,11.75,14.39,14.39,0,0,0,8.06,7.83,16.39,16.39,0,0,0,6.05,1.1,18.1,18.1,0,0,0,5.79-.92,13.51,13.51,0,0,0,5-3.11l2.14,2.85a17.07,17.07,0,0,1-6,3.39A22.07,22.07,0,0,1,646.41,277.57Zm9.49-5V259.42h3.62V273Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M670.59,277.27l16.32-35.7h3.72L707,277.27h-4l-15-33.51h1.53l-15,33.51Zm6.42-9.54,1.13-3.06h20.75l1.12,3.06Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M719,277.27v-35.7h3.11l16.32,27.84h-1.64L753,241.57h3.11v35.7h-3.62v-30h.87l-14.89,25.5h-1.79l-15-25.5h1v30Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M777.58,274h21.48v3.27H773.81v-35.7h24.48v3.26H777.58Zm-.4-16.47h18.87v3.21H777.18Z" transform="translate(-82.19 -64.45)"/><path class="cls-1" d="M823.89,277.57a22.43,22.43,0,0,1-7.62-1.3,14.68,14.68,0,0,1-5.64-3.34l1.48-2.91a14.93,14.93,0,0,0,5.08,3.09,18.24,18.24,0,0,0,6.7,1.25,15,15,0,0,0,5.48-.84,6.72,6.72,0,0,0,3.12-2.27,5.43,5.43,0,0,0,1-3.16,4.71,4.71,0,0,0-1.2-3.37,8.35,8.35,0,0,0-3.13-2,37.06,37.06,0,0,0-4.29-1.3c-1.56-.37-3.13-.77-4.69-1.19a20.18,20.18,0,0,1-4.31-1.71,9,9,0,0,1-3.16-2.83,8.06,8.06,0,0,1-1.2-4.62,9,9,0,0,1,1.4-4.87,9.8,9.8,0,0,1,4.31-3.57,17.76,17.76,0,0,1,7.45-1.35,21.72,21.72,0,0,1,6,.84,17.12,17.12,0,0,1,5.1,2.32l-1.27,3a16.77,16.77,0,0,0-4.87-2.24,18.49,18.49,0,0,0-5-.72,13.93,13.93,0,0,0-5.31.87,6.71,6.71,0,0,0-3.08,2.32,5.66,5.66,0,0,0-1,3.29,4.73,4.73,0,0,0,1.2,3.37,7.91,7.91,0,0,0,3.16,2,38.14,38.14,0,0,0,4.31,1.28c1.57.37,3.12.78,4.67,1.22a22.75,22.75,0,0,1,4.28,1.71,8.88,8.88,0,0,1,3.16,2.78,7.83,7.83,0,0,1,1.2,4.54,8.76,8.76,0,0,1-1.42,4.82,10,10,0,0,1-4.37,3.57A18,18,0,0,1,823.89,277.57Z" transform="translate(-82.19 -64.45)"/></svg>

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB

View File

@ -195,6 +195,7 @@ button {
border: 0;
background: $colorBlueBright;
color: #fff;
@include S(border-radius, $globalBorderRadius);
// border: #{D(1px)} solid rgba(0, 10, 20, 0.2);
@include S(border-bottom-width, 2px);
@ -673,7 +674,7 @@ input.rangeInput {
text-transform: uppercase;
@include S(padding, 1.5px, 3px, 2px);
@include PlainText;
@include S(border-radius, $globalBorderRadius);
@include S(border-radius, 0.5 * $globalBorderRadius);
&,
> span {
@include S(font-size, 9px);
@ -682,6 +683,7 @@ input.rangeInput {
text-shadow: none !important;
// font-family: Arial, sans-serif !important;
}
font-weight: bold;
color: $accentColorDark;
text-align: center;

View File

@ -14,9 +14,9 @@
grid-template-columns: 1fr auto;
grid-template-rows: auto 1fr;
@include DarkThemeOverride {
background-color: #55585a;
}
// @include DarkThemeOverride {
// // background-color: #55585a;
// }
transition: opacity 0.1s ease-out;
&.hovered {
@ -133,7 +133,7 @@
grid-row: 2 / 3;
@include S(border-radius, $globalBorderRadius);
background: rgba($ingameHudBg, 0.3);
background: rgba($ingameHudBg, 0.5);
opacity: 0.5;
display: inline-flex;
vertical-align: top;

View File

@ -7,6 +7,7 @@
display: grid;
grid-template-rows: auto auto;
justify-items: center;
@include S(grid-gap, 4px);
background: transparent;
transition: transform 120ms ease-in-out;
@ -32,8 +33,6 @@
&.secondary {
grid-row: 1 / 2;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
.building {
@include S(width, 30px);
@ -108,7 +107,7 @@
&.selected {
// transform: scale(1.05);
background-color: rgba(lighten($colorBlueBright, 9), 0.4);
@include S(border-radius, 2px);
@include S(border-radius, $globalBorderRadius);
.keybinding {
color: #111;

View File

@ -96,6 +96,8 @@
@include S(grid-gap, 5px);
grid-template-columns: 1fr 1fr;
.option {
@include S(border-radius, $globalBorderRadius);
pointer-events: all;
cursor: pointer;
@include S(padding, 10px);

View File

@ -10,7 +10,7 @@
@include S(width, 150px);
background: $ingameHudBg;
@include S(padding, 4px);
@include S(padding, 7px);
color: #eee;
display: flex;
flex-direction: column;
@ -60,5 +60,6 @@
@include S(height, 150px);
background: center center / cover no-repeat;
transition: opacity 0.1s ease-out;
@include S(border-radius, $globalBorderRadius);
}
}

View File

@ -51,6 +51,7 @@
display: flex;
align-items: center;
justify-content: center;
@include S(border-radius, $globalBorderRadius);
> canvas {
@include S(width, 50px);

View File

@ -8,10 +8,11 @@
@include PlainText;
@include S(width, 150px);
background: rgba(0, 10, 20, 0.5);
@include S(padding, 5px);
background: $ingameHudBg;
@include S(padding, 7px);
color: #eee;
@include S(border-radius, $globalBorderRadius);
.desc {
@include SuperSmallText;

View File

@ -63,9 +63,9 @@
opacity: 0;
display: none;
transform: translate(50%, 50%);
filter: blur(D(3px));
filter: blur(D(7px));
$opacity: 0.07;
$opacity: 0.4;
&.loaded {
display: block;
opacity: $opacity;
@ -241,6 +241,7 @@
position: relative;
@include S(padding, 20px);
@include S(border-radius, $globalBorderRadius);
box-shadow: 0 D(5px) D(15px) rgba(#000, 0.2);
> .badge {
color: #fff;
@ -398,6 +399,8 @@
@include S(padding, 20px);
@include S(border-radius, $globalBorderRadius);
// border: #{D(2px)} solid rgba(0, 10, 20, 0.1);
box-shadow: 0 D(5px) D(15px) rgba(#000, 0.2);
height: 100%;
width: 100%;
box-sizing: border-box;
@ -716,18 +719,31 @@
}
.author {
flex-grow: 1;
margin-left: auto;
text-align: right;
@include PlainText;
color: #888a8f;
color: #000;
a {
color: #333438;
&:hover {
opacity: 0.8;
}
display: flex;
align-items: center;
justify-content: center;
img {
@include S(margin-left, 5px);
@include S(margin-top, 3px);
@include S(width, 50px);
filter: invert(100%);
}
}
}
@include S(padding, 15px);
$linkBg: #fdfdff;
$linkBg: rgba(#fdfdff, 0.5);
$linkBgHover: darken($linkBg, 2);
$linkColor: #55586a;
@ -737,11 +753,9 @@
grid-template-columns: 1fr auto;
justify-content: center;
backdrop-filter: blur(5px);
background: $linkBg;
& {
/* @load-async */
background: $linkBg uiResource("icons/link.png") top D(3px) right D(3px) / D(9px) no-repeat;
}
@include S(padding, 5px);
@include S(padding-left, 10px);
@include S(border-radius, $globalBorderRadius);
@ -830,7 +844,7 @@
}
@include DarkThemeOverride {
background: $darkModeGameBackground center center / cover !important;
background: rgba($darkModeGameBackground, 0.5) center center / cover !important;
.mainContainer {
background: $darkModeControlsBackground;
@ -861,19 +875,11 @@
.footer {
> a,
.sidelinks > a {
background-color: $darkModeControlsBackground;
background-color: rgba($darkModeControlsBackground, 0.3);
color: #eee;
&:hover {
background-color: darken($darkModeControlsBackground, 5);
}
}
.author {
color: #bdbdbd;
> a {
color: white;
background-color: rgba(darken($darkModeControlsBackground, 5), 0.5);
}
}

View File

@ -1,4 +1,4 @@
$globalBorderRadius: 2px;
$globalBorderRadius: 6px;
// When to reduce control elements size for small devices
$layoutExpandMinWidth: 340px;

View File

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<title>shapez.io Standalone</title>
<title>shapez</title>
<!-- mobile stuff -->
<meta name="format-detection" content="telephone=no" />

View File

@ -21,6 +21,10 @@ export function getLogoSprite() {
return "logo_cn.png";
}
if (G_IS_STANDALONE) {
return "logo.png";
}
if (G_IS_BROWSER) {
return "logo_demo.png";
}

View File

@ -40,7 +40,7 @@ export class MainMenuState extends GameState {
const showExitAppButton = G_IS_STANDALONE;
const showUpdateLabel = !G_WEGAME_VERSION;
const showBrowserWarning = !G_IS_STANDALONE && !isSupportedBrowser();
const showPuzzleDLC = !G_WEGAME_VERSION && (G_IS_STANDALONE || G_IS_DEV);
const showPuzzleDLC = !G_WEGAME_VERSION && G_IS_STANDALONE;
const showWegameFooter = G_WEGAME_VERSION;
const hasMods = MODS.anyModsActive();
@ -146,9 +146,6 @@ export class MainMenuState extends GameState {
<button class="styledButton puzzleDlcGetButton">${
T.mainMenu.puzzleDlcViewNow
}</button>
<span class="hint">
${T.puzzleMenu.dlcHint}
</span>
</div>`
: ""
}
@ -230,10 +227,10 @@ export class MainMenuState extends GameState {
${showExternalLinks ? `<a class="helpTranslate">${T.mainMenu.helpTranslate}</a>` : ""}
</div>
<div class="author">${T.mainMenu.madeBy.replace(
<div class="author"><a class="producerLink" target="_blank">${T.mainMenu.madeBy.replace(
"<author-link>",
'<a class="producerLink" target="_blank">tobspr Games</a>'
)}</div>
`<img src="${cachebust("res/logo-tobspr-games.svg")}">`
)}</a></div>
</div>
${

View File

@ -18,12 +18,12 @@ export class MobileWarningState extends GameState {
There is also no estimate when this will change, but feel to make a contribution! It's
&nbsp;<a href="https://github.com/tobspr/shapez.io" target="_blank">open source</a>!</p>
<p>If you want to play on your computer, you can also get the standalone on Steam:</p>
<p>If you want to play on your computer, you can also get the game on Steam:</p>
<a href="${
THIRDPARTY_URLS.stanaloneCampaignLink + "/shapez_mobile"
}" class="standaloneLink" target="_blank">Get the shapez.io standalone!</a>
}" class="standaloneLink" target="_blank">Get on Steam!</a>
`;
}

View File

@ -47,7 +47,7 @@ export class ModsState extends TextualGameState {
<p>${T.mods.noModSupport}</p>
<a href="#" class="steamLink steam_2_npr" target="_blank">Get the shapez.io standalone!</a>
<a href="#" class="steamLink steam_2_npr" target="_blank">Get on Steam!</a>
</div>

View File

@ -112,7 +112,7 @@ mainMenu:
# This is shown when using firefox and other browsers which are not supported.
browserWarning: >-
Sorry, but the game is known to run slowly on your browser! Get the standalone version or download Google Chrome for the full experience.
Sorry, but the game is known to run slowly on your browser! Get the full version or download Google Chrome for the full experience.
savegameLevel: Level <x>
savegameLevelUnknown: Unknown Level
@ -204,7 +204,7 @@ dialogs:
later: Later
restart: Restart
reset: Reset
getStandalone: Get Standalone
getStandalone: Get on Steam
deleteGame: I know what I am doing
viewUpdate: View Update
showUpgrades: Show Upgrades
@ -259,11 +259,11 @@ dialogs:
featureRestriction:
title: Demo Version
desc: You tried to access a feature (<feature>) which is not available in the demo. Consider getting the standalone version for the full experience!
desc: You tried to access a feature (<feature>) which is not available in the demo. Consider getting the full version on Steam for the best experience!
oneSavegameLimit:
title: Limited savegames
desc: You can only have one savegame at a time in the demo version. Please remove the existing one or get the standalone version!
desc: You can only have one savegame at a time in the demo version. Please remove the existing one or get the full version on Steam!
updateSummary:
title: New update!
@ -320,7 +320,7 @@ dialogs:
title: Set Item
markerDemoLimit:
desc: You can only create two custom markers in the demo. Get the standalone for unlimited markers!
desc: You can only create two custom markers in the demo. Get the full version on Steam for unlimited markers!
exportScreenshotWarning:
title: Export screenshot
@ -616,7 +616,7 @@ ingame:
# Pops up in the demo every few minutes
watermark:
title: Demo version
desc: Click here to see the advantages of the standalone version!
desc: Click here to see the advantages of the full version!
get_on_steam: Get on Steam
standaloneAdvantages:
@ -1106,12 +1106,12 @@ mods:
version: Version
modWebsite: Website
openFolder: Open Mods Folder
folderOnlyStandalone: Opening the mod folder is only possible when running the standalone.
folderOnlyStandalone: Opening the mod folder is only possible when running the full version on Steam.
browseMods: Browse Mods
modsInfo: >-
To install and manage mods, copy them to the mods folder within the game directory. You can also use the 'Open Mods Folder' button on the top right.
noModSupport: You need the standalone version on Steam to install mods.
noModSupport: You need the full version on Steam to install mods.
togglingComingSoon:
title: Coming Soon
@ -1195,7 +1195,7 @@ settings:
fullscreen:
title: Fullscreen
description: >-
It is recommended to play the game in fullscreen to get the best experience. Only available in the standalone.
It is recommended to play the game in fullscreen to get the best experience. Only available in the full version.
soundsMuted:
title: Mute Sounds