MoonsideGames
/
AnimationTool
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix x button on pins

master
evan 2019-10-08 15:49:06 -07:00
parent 9a174671bf
commit e09fc596f3
3 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/pin_handler.ts
View File

@ -32,7 +32,7 @@ export class PinHandler {
this.UpdatePinBoxStatus(); this.UpdatePinBoxStatus();
}); });
// put origin into pincontainer array // put origin into pincontainer array
this.allPinContainers = [originPin]; this.allPinContainers = [ originPin ];
} }
public UpdatePinBoxStatus = () => { public UpdatePinBoxStatus = () => {
@ -131,7 +131,7 @@ export class PinHandler {
this.UpdateAnimationPinNames(); this.UpdateAnimationPinNames();
}); });
// button to remove pin // button to remove pin
const removePinButton = document.createElement('button'); const removePinButton = document.createElement('div');
newDiv.appendChild(removePinButton); newDiv.appendChild(removePinButton);
removePinButton.textContent = 'X'; removePinButton.textContent = 'X';
removePinButton.className = 'removeButton'; removePinButton.className = 'removeButton';

10
app/stylesheets/main.scss
View File

@ -60,6 +60,7 @@ div {
padding: 8px; padding: 8px;
text-align: center; text-align: center;
background-color: $secondary-bg-color; background-color: $secondary-bg-color;
border-radius: 5px;
} }
.center { .center {
@ -283,9 +284,12 @@ $pin-button-size: 75px;
display: block; display: block;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
transform: translate($pin-button-size / 2, -$pin-button-size / 2); transform: translate($pin-button-size / 2, -$pin-button-size / 2 + 5px);
width: 15px; width: 15px;
border: 1px solid;
border-radius: 50%; border-radius: 50%;
background-color: rgb(158, 15, 34); background-color: #9e0f22;
color: rgb(227, 227, 236); color: #e3e3ec;
height: 15px;
line-height: 15px;
} }

1
dist/index.html vendored
View File

@ -47,6 +47,7 @@
<p><b>Arrow Keys</b> - Advance frames</p> <p><b>Arrow Keys</b> - Advance frames</p>
<p><b>Spacebar</b> - Play/Pause Animation</p> <p><b>Spacebar</b> - Play/Pause Animation</p>
<p><b>S</b> - Export</p> <p><b>S</b> - Export</p>
<p>Add pins with the <b>+</b> button</p>
</div> </div>
<div id="outputMessage"></div> <div id="outputMessage"></div>
</div> </div>