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

Allow pinning shapes

Browse Source
This commit is contained in:
tobspr
2020-05-14 13:29:42 +02:00
parent e43a22b56d
commit 38970141d8
13 changed files with 303 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/css/ingame_hud/blur_overlay.scss
View File

@@ -1,8 +0,0 @@
body.ingameDialogOpen {
#ingame_Canvas,
#ingame_HUD_GameMenu,
#ingame_HUD_KeybindingOverlay,
#ingame_HUD_buildings_toolbar {
filter: blur(5px);
}
}

2
src/css/ingame_hud/keybindings_overlay.scss
View File

@@ -20,7 +20,7 @@
@include S(height, 10px);
width: 1px;
@include S(margin, 0, 3px);
background-color: #ccc;
background-color: #888;
transform: rotate(10deg);
// @include S(margin, 0, 3px);
}

54
src/css/ingame_hud/pinned_shapes.scss Normal file
View File

@@ -0,0 +1,54 @@
#ingame_HUD_PinnedShapes {
position: absolute;
@include S(left, 9px);
@include S(top, 120px);
@include PlainText;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
> .shape {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
@include S(margin-bottom, 5px);
&.unpinable {
> canvas {
cursor: pointer;
pointer-events: all;
}
}
> canvas {
@include S(width, 25px);
@include S(height, 25px);
}
> .amountLabel {
@include S(margin-left, 5px);
@include SuperSmallText;
font-weight: bold;
display: inline-flex;
align-items: center;
flex-direction: row;
}
&.marked .amountLabel {
&::after {
content: " ";
position: absolute;
display: inline-block;
@include S(width, 9px);
@include S(height, 9px);
opacity: 0.8;
@include S(top, -4px);
@include S(left, -4px);
background: uiResource("icons/current_goal_marker.png") center center / contain no-repeat;
}
}
}
}

44
src/css/ingame_hud/shop.scss
View File

@@ -100,6 +100,50 @@
flex-direction: column;
align-items: center;
button.pin {
@include S(width, 12px);
@include S(height, 12px);
background: uiResource("icons/pin.png") center center / 95% no-repeat;
position: absolute;
@include S(top, -2px);
@include S(right, -2px);
opacity: 0.6;
cursor: pointer;
pointer-events: all;
@include IncreasedClickArea(5px);
transition: opacity 0.12s ease-in-out;
&:hover {
opacity: 0.7;
}
&.alreadyPinned {
opacity: 0.1 !important;
pointer-events: none;
cursor: default;
}
&.pinned {
opacity: 0.1;
pointer-events: none;
cursor: default;
@include InlineAnimation(0.3s ease-in-out) {
0% {
opacity: 1;
transform: scale(0.8);
}
30% {
opacity: 1;
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
}
}
canvas {
@include S(width, 40px);
@include S(height, 40px);