Archives/tobspr_shapez.io
1
0
Fork 0
mirror of https://github.com/tobspr/shapez.io.git synced 2026-03-02 03:39:21 +00:00
Code Issues Projects Releases Wiki Activity

Update demo hint and lock demo to lvl 14

Browse Source
This commit is contained in:
tobspr
2020-09-29 16:46:29 +02:00
parent 9b7225bf44
commit 5a3807883e
29 changed files with 745 additions and 331 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/css/ingame_hud/blueprint_placer.scss
View File

@@ -1,39 +1,40 @@
#ingame_HUD_BlueprintPlacer {
position: absolute;
@include S(top, 50px);
left: 50%;
transform: translateX(-50%);
color: #333;
z-index: 9999;
background: $ingameHudBg;
@include S(padding, 5px);
display: flex;
flex-direction: column;
color: #fff;
@include S(width, 120px);
align-items: center;
justify-content: center;
.label {
@include PlainText;
text-transform: uppercase;
}
.costContainer {
display: flex;
align-items: center;
@include Heading;
> canvas {
@include S(margin-left, 5px);
@include S(width, 30px);
@include S(height, 30px);
}
}
&:not(.canAfford) {
background: rgba(98, 27, 41, 0.8);
// .costContainer {
color: rgb(255, 97, 128);
// }
}
}
#ingame_HUD_BlueprintPlacer {
position: absolute;
@include S(top, 70px);
left: 50%;
transform: translateX(-50%);
color: #333;
z-index: 9999;
background: $ingameHudBg;
@include S(padding, 5px);
display: flex;
flex-direction: column;
color: #fff;
@include S(width, 120px);
align-items: center;
justify-content: center;
@include S(border-radius, $globalBorderRadius);
.label {
@include PlainText;
text-transform: uppercase;
}
.costContainer {
display: flex;
align-items: center;
@include Heading;
> canvas {
@include S(margin-left, 5px);
@include S(width, 30px);
@include S(height, 30px);
}
}
&:not(.canAfford) {
background: rgba(98, 27, 41, 0.8);
// .costContainer {
color: rgb(255, 97, 128);
// }
}
}

171
src/css/ingame_hud/standalone_advantages.scss Normal file
View File

@@ -0,0 +1,171 @@
#ingame_HUD_StandaloneAdvantages {
.content {
@include S(width, 440px);
@include S(min-height, 300px);
}
p {
@include PlainText;
}
.points {
display: grid;
grid-template-columns: 1fr 1fr;
@include S(grid-column-gap, 10px);
@include S(grid-row-gap, 20px);
@include S(margin, 10px, 0, 20px);
grid-template-rows: #{D(40px)};
align-items: center;
}
.lowerBar {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
> button {
transition: opacity 0.12s ease-in-out;
&:hover {
opacity: 0.85;
}
}
.otherCloseButton {
@include SuperSmallText;
@include S(margin-right, 30px);
color: #aaa;
@include S(margin, 0);
@include IncreasedClickArea(0px);
@include S(margin-top, 15px);
@include InlineAnimation(5s ease-in-out) {
0% {
opacity: 0.05;
}
50% {
opacity: 0.05;
}
100% {
opacity: 1;
}
}
}
.steamLinkButton {
@include IncreasedClickArea(5px);
@include S(margin, 0);
@include S(width, 180px);
@include S(height, 40px);
& {
/* @load-async */
background: #171a23 uiResource("get_on_steam.png") center center / contain no-repeat;
}
@include S(border-radius, $globalBorderRadius);
}
}
.point {
display: grid;
grid-template-columns: #{D(55px)} auto;
grid-template-rows: 1fr 1fr;
> strong {
grid-column: 2 / 3;
grid-row: 1 / 2;
@include PlainText;
text-transform: uppercase;
font-weight: bold;
}
> p {
grid-column: 2 / 3;
grid-row: 2 / 3;
@include SuperSmallText;
opacity: 0.8;
}
background: transparent #{D(10px)} center / #{D(30px)} no-repeat;
&.levels {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_new_levels.png");
}
> strong {
color: #f13555;
}
}
&.upgrades {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_upgrades.png");
}
> strong {
color: #8a00ff;
}
}
&.buildings {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_buildings.png");
}
> strong {
color: #3fce8b;
}
}
&.wires {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_wires.png");
}
> strong {
color: #ef2fdb;
}
}
&.markers {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_markers.png");
}
> strong {
color: #4294ff;
}
}
&.savegames {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_savegames.png");
}
> strong {
color: #ff9500;
}
}
&.darkmode {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_dark_mode.png");
}
> strong {
color: #292c32;
}
}
&.support {
& {
/* @load-async */
background-image: uiResource("res/ui/icons/advantage_support.png");
}
> strong {
color: #e72d2d;
}
}
}
}

89
src/css/ingame_hud/watermark.scss
View File

@@ -1,22 +1,85 @@
#ingame_HUD_Watermark {
position: absolute;
& {
/* @load-async */
background: uiResource("get_on_steam.png") center center / contain no-repeat;
}
@include S(width, 110px);
@include S(height, 40px);
@include S(top, 10px);
@include S(border-radius, $globalBorderRadius);
@include S(top, 70px);
pointer-events: all;
cursor: pointer;
@include S(left, 160px);
left: 50%;
text-align: center;
background: rgba(207, 65, 65, 0.8);
color: #fff;
transform: translateX(-50%);
@include PlainText;
@include S(padding, 10px);
transition: all 0.12s ease-in;
transition-property: opacity, transform;
transform: skewX(-0.5deg);
&:hover {
transform: skewX(-1deg) scale(1.02);
opacity: 0.9;
transform: translateX(-50%) scale(1.02) !important;
}
> strong {
@include PlainText;
text-transform: uppercase;
}
> p {
@include SuperSmallText;
opacity: 0.7;
}
opacity: 0;
&.visible {
@include InlineAnimation(0.5s ease-in-out) {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
opacity: 1;
}
&:not(.visible) {
@include InlineAnimation(0.5s ease-in-out) {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
}
}
#ingame_HUD_WatermarkClicker {
@include S(top, 55px);
position: absolute;
left: 50%;
transform: translateX(-50%) !important;
@include SuperSmallText;
color: $colorBlueBright;
text-transform: uppercase;
pointer-events: all;
cursor: pointer;
display: flex;
align-items: center;
&:hover {
opacity: 0.9;
}
&::after {
@include S(margin-left, 4px);
content: "";
@include S(width, 10px);
@include S(height, 10px);
display: inline-flex;
background: center center / contain no-repeat;
& {
/* @load-async */
background-image: uiResource("res/ui/icons/demo_steam_link_indicator.png");
}
}
}

3
src/css/main.scss
View File

@@ -52,6 +52,7 @@
@import "ingame_hud/color_blind_helper";
@import "ingame_hud/shape_viewer";
@import "ingame_hud/sandbox_controller";
@import "ingame_hud/standalone_advantages";
// prettier-ignore
$elements:
@@ -77,6 +78,7 @@ ingame_HUD_buildings_toolbar,
ingame_HUD_wires_toolbar,
ingame_HUD_BlueprintPlacer,
ingame_HUD_Waypoints_Hint,
ingame_HUD_WatermarkClicker,
ingame_HUD_Watermark,
ingame_HUD_ColorBlindBelowTileHelper,
ingame_HUD_SandboxController,
@@ -88,6 +90,7 @@ ingame_HUD_BetaOverlay,
ingame_HUD_Shop,
ingame_HUD_Statistics,
ingame_HUD_ShapeViewer,
ingame_HUD_StandaloneAdvantages,
ingame_HUD_UnlockNotification,
ingame_HUD_SettingsMenu,
ingame_HUD_ModalDialogs;