-- Updated styles for buttons in manual-app.

-- Cleaned code.
This commit is contained in:
Eugene Serb 2022-08-08 11:23:55 +03:00
parent 6a1ad071fc
commit ef4be5364a
3 changed files with 18 additions and 17 deletions

View File

@ -26,8 +26,8 @@
min="0.0" max="1.0" step="0.01" required /> min="0.0" max="1.0" step="0.01" required />
</label> </label>
<div class="manual-form__buttons"> <div class="manual-form__buttons">
<button @click="start">Start</button> <button @click="start" class="manual-form__button">Start</button>
<button @click="stop">Stop</button> <button @click="stop" class="manual-form__button">Stop</button>
</div> </div>
</fieldset> </fieldset>
</div> </div>
@ -51,12 +51,11 @@
methods: { methods: {
createPatternUnit: function (): TPatternUnit[] { createPatternUnit: function (): TPatternUnit[] {
const patternUnit: TPatternUnit[] = [{ const patternUnit: TPatternUnit[] = [{
startDelay: this.startDelay, startDelay: this.startDelay,
duration: this.duration, duration: this.duration,
weakMagnitude: this.weakMagnitude, weakMagnitude: this.weakMagnitude,
strongMagnitude: this.strongMagnitude, strongMagnitude: this.strongMagnitude,
}, }];
];
return patternUnit as TPatternUnit[]; return patternUnit as TPatternUnit[];
}, },
start: function (): void { start: function (): void {
@ -90,6 +89,10 @@
gap: 32px; gap: 32px;
} }
.manual-form__button {
width: 100%;
}
@media only screen and (min-width: 540px) { @media only screen and (min-width: 540px) {
.manual-form { .manual-form {
display: flex; display: flex;
@ -101,6 +104,11 @@
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
.manual-form__buttons {
display: flex;
flex-direction: row;
}
} }
</style> </style>

View File

@ -30,7 +30,6 @@ class Vibrator implements IVibrator {
async vibrate(pattern: TPatternUnit[]) { async vibrate(pattern: TPatternUnit[]) {
this.isVibrating = true; this.isVibrating = true;
this.pattern = pattern; this.pattern = pattern;
while (this.isVibrating === true) { while (this.isVibrating === true) {
for (let i = 0; i < this.pattern.length; i++) { for (let i = 0; i < this.pattern.length; i++) {
if (this.isVibrating === true) { if (this.isVibrating === true) {

View File

@ -26,16 +26,10 @@ const store: Store<IRootState> = createStore({
}, },
}, },
actions: { actions: {
setMode: function ( setMode: function (context, index: number): void {
context,
index: number
): void {
context.commit('setMode', index as number); context.commit('setMode', index as number);
}, },
setIsActive: function ( setIsActive: function (context, isActive: boolean): void {
context,
isActive: boolean
): void {
context.commit('setIsActive', isActive as boolean); context.commit('setIsActive', isActive as boolean);
}, },
change: function (context, index: number): void { change: function (context, index: number): void {