mirrors/shapez.io
1
Fork 0
mirror of https://github.com/tobspr-games/shapez.io.git synced 2026-01-20 11:31:15 -08:00
Code Issues Projects Releases Wiki Activity

Minor artwork update

Browse source
This commit is contained in:
tobspr 2020-05-11 14:21:59 +02:00
parent 6cce1b7c08
commit 653ddf9a3a
30 changed files with 62 additions and 212 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/css/ingame_hud/building_placer.scss
View file

@ -10,7 +10,7 @@
justify-content: center;
align-items: flex-start;
@include S(border-radius, 4px);
background: rgba(#333, 0.5);
background: rgba(#333, 0.9);
@include S(width, 200px);
.buildingLabel {

2
src/css/ingame_hud/buildings_toolbar.scss
View file

@ -59,7 +59,7 @@
}
&.selected {
background: rgb(140, 229, 140) !important;
background: rgb(173, 221, 253) !important;
transform: scale(1.05);
.keybinding {
color: #111;

9
src/css/ingame_hud/dialogs.scss
View file

@ -25,12 +25,12 @@
> .dialogInner {
background: #fff;
@include S(min-width, 500px);
max-width: calc(100vw - #{D(50px)});
max-height: calc(100vh - #{D(50px)});
max-width: calc(100vw - #{D(40px)});
max-height: calc(100vh - #{D(40px)});
@include S(border-radius, 4px);
display: flex;
flex-direction: column;
@include S(padding, 15px);
@include S(padding, 12px);
pointer-events: all;
> .title {
@ -38,6 +38,7 @@
margin: 0;
text-transform: uppercase;
display: grid;
align-items: center;
grid-template-columns: 1fr auto;
@include S(margin-bottom, 10px);
@ -45,7 +46,7 @@
opacity: 0.7;
@include S(width, 20px);
@include S(height, 20px);
background: uiResource("icons/close.png") center center / 60% no-repeat;
background: uiResource("icons/close.png") center center / 80% no-repeat;
cursor: pointer;
pointer-events: all;
transition: opacity 0.2s ease-in-out;

42
src/css/ingame_hud/shop.scss
View file

@ -10,8 +10,8 @@
@include S(border-radius, 3px);
@include S(margin-bottom, 4px);
@include S(padding, 5px, 10px);
@include S(grid-row-gap, 5px);
@include S(height, 95px);
@include S(grid-row-gap, 1px);
@include S(height, 85px);
grid-template-rows: #{D(20px)} auto;
&:last-child {
@ -19,38 +19,40 @@
}
.title {
grid-column: 2 / 3;
grid-column: 1 / 3;
grid-row: 1 / 2;
@include Heading;
@include PlainText;
display: flex;
align-items: center;
flex-direction: row-reverse;
justify-content: flex-end;
.tier {
@include S(margin-left, 5px);
@include S(margin-right, 9px);
background: $colorGreenBright;
@include S(border-radius, 4px);
@include S(border-radius, 2px);
text-transform: uppercase;
@include PlainText;
color: #fff;
text-align: center;
font-weight: bold;
@include S(margin-top, 1px);
@include S(width, 45px);
@include S(padding, 0px, 5px);
&[data-tier="0"] {
background-color: rgb(73, 186, 190);
}
&[data-tier="1"] {
background-color: rgb(73, 94, 190);
background-color: rgb(88, 110, 207);
}
&[data-tier="2"] {
background-color: rgb(186, 73, 190);
background-color: rgb(189, 100, 192);
}
&[data-tier="3"] {
background-color: rgb(96, 190, 73);
background-color: rgb(117, 192, 98);
}
&[data-tier="4"] {
background-color: rgb(190, 91, 73);
background-color: rgb(243, 77, 48);
}
&[data-tier="5"] {
background-color: rgb(219, 184, 29);
@ -64,13 +66,15 @@
.icon {
@include S(width, 40px);
@include S(height, 40px);
background: center center / contain no-repeat;
background: center center / 80% no-repeat;
align-self: center;
justify-self: center;
grid-column: 1 / 2;
grid-row: 1 / 4;
@include S(margin-right, 20px);
opacity: 0.2;
grid-row: 2 / 4;
@include S(margin-right, 30px);
@include S(margin-left, 10px);
opacity: 0.32;
display: none;
}
.description {
@ -87,7 +91,7 @@
grid-row: 3 / 4;
display: grid;
grid-auto-flow: column;
@include S(grid-gap, 15px);
@include S(grid-gap, 9px);
justify-content: start;
.requirement {
@ -110,7 +114,7 @@
@include S(line-height, 13px);
@include S(border-radius, 2px);
@include S(padding, 0, 2px, 3px);
@include S(padding, 1px, 2px, 2px);
position: relative;
text-align: center;
@include S(min-width, 50px);
@ -140,7 +144,7 @@
button.buy {
grid-column: 3 / 4;
grid-row: 3 / 4;
align-self: end;
align-self: center;
justify-self: end;
// @include S(padding, 4px, 5px);
// @include PlainText;

14
src/css/states/main_menu.scss
View file

@ -41,7 +41,7 @@
.playButton {
@include SuperHeading;
@include S(width, 130px);
@include S(padding, 15px, 20px, 10px);
@include S(padding, 15px, 20px);
letter-spacing: 0.3em !important;
color: #fff;
background-color: #55585a;
@ -64,12 +64,10 @@
justify-content: center;
background: #fafafa;
@include S(padding, 5px);
@include S(padding-left, 10px);
@include S(border-radius, 4px);
@include S(margin-left, 10px);
@include SuperSmallText();
border: #{D(1px)} solid #44484a;
border-bottom: #{D(3px)} solid #44484a;
box-shadow: #{D(1px)} #{D(2px)} #{D(3px)} 0 rgba(0, 10, 20, 0.1);
font-weight: bold;
text-transform: uppercase;
@ -88,15 +86,15 @@
.thirdpartyLogo {
display: inline-block;
width: 100%;
height: 100%;
background: center center / 85% no-repeat;
width: 80%;
height: 80%;
background: center center / 80% no-repeat;
&.githubLogo {
background-image: uiResource("main_menu/github.png");
}
&.discordLogo {
background-image: uiResource("main_menu/discord.png");
background-size: 100%;
background-size: 95%;
}
}
}