mirror of
https://github.com/tobspr/shapez.io.git
synced 2026-09-23 20:35:47 +00:00
Cleanup readme and translations, update shapez 2 logos
This commit is contained in:
tobspr
@@ -171,45 +171,17 @@
|
||||
@include S(grid-gap, 20px);
|
||||
|
||||
.mainNews {
|
||||
background: linear-gradient(220deg, rgb(74, 93, 201), rgb(93, 255, 150));
|
||||
&::before {
|
||||
background: uiResource("shapez2.png") center center / 100% no-repeat;
|
||||
content: "";
|
||||
@include S(width, 100px);
|
||||
@include S(height, 100px);
|
||||
position: absolute;
|
||||
top: 55%;
|
||||
right: 8%;
|
||||
pointer-events: none;
|
||||
transform: translateY(-50%);
|
||||
transition: transform 0.5s ease-in-out;
|
||||
}
|
||||
|
||||
// .close {
|
||||
// position: absolute;
|
||||
// pointer-events: all;
|
||||
// background: uiResource("icons/main_menu_exit.png") center center / 50% no-repeat;
|
||||
// display: inline-flex;
|
||||
// @include S(width, 15px);
|
||||
// @include S(height, 15px);
|
||||
// @include S(top, 2px);
|
||||
// opacity: 0.3;
|
||||
// @include S(right, 2px);
|
||||
// z-index: 200;
|
||||
// transition: opacity 0.12s ease-in-out;
|
||||
// &:hover {
|
||||
// opacity: 0.7;
|
||||
// }
|
||||
// }
|
||||
|
||||
&:hover::before {
|
||||
transform: translate(0, -51%);
|
||||
}
|
||||
|
||||
box-shadow: 0 D(9px) D(15px) rgba(#000, 0.2);
|
||||
background:
|
||||
linear-gradient(
|
||||
90deg,
|
||||
rgba(20, 10, 45, 0.85) 0%,
|
||||
rgba(20, 10, 45, 0.55) 45%,
|
||||
rgba(20, 10, 45, 0.15) 100%
|
||||
),
|
||||
uiResource("shapez2_banner_bg.noinline.png") center / cover no-repeat;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@include S(height, 60px);
|
||||
|
||||
pointer-events: all;
|
||||
@@ -218,20 +190,87 @@
|
||||
position: relative;
|
||||
grid-row: 2 / 3;
|
||||
@include S(border-radius, $globalBorderRadius);
|
||||
justify-content: center;
|
||||
@include S(padding, 10px);
|
||||
@include S(padding-right, 100px);
|
||||
@include S(padding, 10px, 140px, 10px, 14px);
|
||||
box-sizing: border-box;
|
||||
transition: opacity 0.12s ease-in-out;
|
||||
transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
opacity: 0.85;
|
||||
|
||||
@include InlineAnimation(2.8s ease-in-out infinite) {
|
||||
0%, 100% {
|
||||
box-shadow:
|
||||
0 D(9px) D(15px) rgba(#000, 0.3),
|
||||
inset 0 D(1px) 0 rgba(#fff, 0.15),
|
||||
0 0 D(0) rgba(125, 143, 255, 0);
|
||||
}
|
||||
50% {
|
||||
box-shadow:
|
||||
0 D(9px) D(15px) rgba(#000, 0.3),
|
||||
inset 0 D(1px) 0 rgba(#fff, 0.15),
|
||||
0 0 D(22px) rgba(125, 143, 255, 0.55);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover > img {
|
||||
animation: none !important;
|
||||
transform: translateY(-52%) scale(1.05);
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
@include S(width, 170px);
|
||||
@include S(height, 140px);
|
||||
top: 50%;
|
||||
@include S(right, -12px);
|
||||
transform: translateY(-50%);
|
||||
background: radial-gradient(
|
||||
ellipse at center,
|
||||
rgba(220, 230, 255, 0.55) 0%,
|
||||
rgba(180, 200, 255, 0.18) 35%,
|
||||
transparent 70%
|
||||
);
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
> img {
|
||||
@include S(width, 135px);
|
||||
@include S(height, 110px);
|
||||
object-fit: contain;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@include S(right, 6px);
|
||||
pointer-events: none;
|
||||
transform: translateY(-50%);
|
||||
transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
|
||||
filter:
|
||||
drop-shadow(0 0 D(3px) rgba(255, 255, 255, 0.7))
|
||||
drop-shadow(0 D(2px) D(3px) rgba(#000, 0.6));
|
||||
z-index: 2;
|
||||
|
||||
@include InlineAnimation(3.6s ease-in-out infinite) {
|
||||
0%, 100% {
|
||||
transform: translateY(-50%) rotate(0deg);
|
||||
}
|
||||
50% {
|
||||
transform: translate(0, calc(-50% - #{D(3px)})) rotate(-2deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
@include SuperSmallText;
|
||||
@include S(width, 100px);
|
||||
color: rgba(#000, 1);
|
||||
@include PlainText;
|
||||
@include S(font-size, 13px);
|
||||
line-height: 1.15;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
color: #fff;
|
||||
letter-spacing: 0.04em;
|
||||
text-shadow: 0 D(1px) D(3px) rgba(#000, 0.6);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 55%;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,11 @@
|
||||
export const CHANGELOG = [
|
||||
{
|
||||
version: "1.5.7",
|
||||
date: "28.04.2026",
|
||||
entries: [
|
||||
"🎉 shapez 2 is now out! <a href='https://tobspr.io/shapez-2?utm_medium=s1_steam' target='_blank'>Click here</a> to check it out. 🎉",
|
||||
],
|
||||
},
|
||||
{
|
||||
version: "1.5.6",
|
||||
date: "09.12.2022",
|
||||
|
||||
@@ -776,6 +776,18 @@ export function getLogoSprite() {
|
||||
return "logo.png";
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the appropriate shapez 2 banner sprite path
|
||||
* @param {string} language
|
||||
*/
|
||||
export function getShapez2BannerSprite(language) {
|
||||
if (G_WEGAME_VERSION || G_CHINA_VERSION || language === "zh-CN") {
|
||||
return "shapez2_zh-CN.png";
|
||||
}
|
||||
|
||||
return "shapez2.png";
|
||||
}
|
||||
|
||||
/**
|
||||
* Rejects a promise after X ms
|
||||
* @param {Promise} promise
|
||||
|
||||
@@ -10,6 +10,7 @@ import {
|
||||
formatSecondsToTimeAgo,
|
||||
generateFileDownload,
|
||||
getLogoSprite,
|
||||
getShapez2BannerSprite,
|
||||
makeButton,
|
||||
makeDiv,
|
||||
makeDivElement,
|
||||
@@ -179,8 +180,10 @@ export class MainMenuState extends GameState {
|
||||
${
|
||||
showShapez2
|
||||
? `<div class="mainNews shapez2">
|
||||
<div class="text">We are currently prototyping Shapez 2!</div>
|
||||
|
||||
<div class="text">${T.mainMenu.shapez2Banner}</div>
|
||||
<img src="${cachebust(
|
||||
"res/ui/" + getShapez2BannerSprite(this.app.settings.getLanguage())
|
||||
)}" alt="shapez 2">
|
||||
</div>`
|
||||
: ""
|
||||
}
|
||||
@@ -334,8 +337,6 @@ export class MainMenuState extends GameState {
|
||||
<div class="footerGrow">
|
||||
${showExternalLinks ? `<a class="changelog">${T.changelog.title}</a>` : ""}
|
||||
|
||||
${showExternalLinks ? `<a class="helpTranslate">${T.mainMenu.helpTranslate}</a>` : ""}
|
||||
|
||||
</div>
|
||||
<div class="author"><a class="producerLink" href="https://tobspr.io" target="_blank" title="tobspr Games" rel="follow">
|
||||
<img src="${cachebust("res/logo-tobspr-games.svg")}" alt="tobspr Games"
|
||||
@@ -469,7 +470,6 @@ export class MainMenuState extends GameState {
|
||||
".twitterLink": this.onTwitterLinkClicked,
|
||||
".patreonLink": this.onPatreonLinkClicked,
|
||||
".changelog": this.onChangelogClicked,
|
||||
".helpTranslate": this.onTranslationHelpLinkClicked,
|
||||
".exitAppButton": this.onExitAppButtonClicked,
|
||||
".steamLink": this.onSteamLinkClicked,
|
||||
".steamLinkSocial": this.onSteamLinkClickedSocial,
|
||||
@@ -907,12 +907,6 @@ export class MainMenuState extends GameState {
|
||||
this.moveToState("SettingsState");
|
||||
}
|
||||
|
||||
onTranslationHelpLinkClicked() {
|
||||
this.app.platformWrapper.openExternalLink(
|
||||
"https://github.com/tobspr-games/shapez.io/blob/master/translations"
|
||||
);
|
||||
}
|
||||
|
||||
onPlayButtonClicked() {
|
||||
if (
|
||||
this.app.savegameMgr.getSavegamesMetaData().length > 0 &&
|
||||
|
||||
Reference in New Issue
Block a user