Feedback on Remake
Notes:
- Run on Fedora Linux with Node v12 and Yarn
- Yarn seems to break some of the dependencies so I'm on
npm
now.
- Yarn seems to break some of the dependencies so I'm on
What I did
- Ran
remake create...
/* | |
SHOW-IF PLUGIN | |
-------------- | |
Conditionally show elements based on the values of the attributes in their ancestors. | |
How to use: | |
=========== | |
1. Run this code when the page loads | |
2. Run this code whenever a new elements that has a show-if attribute is added to the page (or if you want: simply whenever the page changes) |
Notes:
npm
now.remake create...
<template> | |
<div> | |
<modal name="add-course-flow-modal" :classes="modalClasses" height="auto" :scrollable="true" @before-open="modalBeforeOpen" @opened="modalOpened" @closed="modalClosed"> | |
<training-bundle :action="action" :caregiver-ids="caregiverIds" :caregiver-goal="caregiverGoal" :compliance-types="complianceTypes" :waive-types="waiveTypes" :courses="selectableCourses" :selected-course-ids="selectedCourseIds" :current-step="currentStep" :total-steps="totalSteps" :active-tab="activeTab" :created-courses="createdCourses" :course-being-edited="courseBeingEdited" :edit-mode="editMode" :can-input-bundle-name="canInputBundleName" :has-due-date="hasDueDate" :force-update="forceUpdate" :waive-modal-data="waiveModalData" :paths="paths" :agency-id="agencyId" :agency-name="agencyName"></training-bundle> | |
</modal> | |
</div> | |
</template> | |
<script> | |
import $ from 'jquery'; |
body .email-modal .email-modal__content { | |
background-color: #191c1f; | |
} | |
body .email-modal .email-modal__top-image { | |
background-color: #fff; | |
} | |
body .bottom-bar, body .bottom-bar *, body .email-modal, body .email-modal * { | |
color: #fff; |
/* | |
ADD EMOJI SUPPORT TO YOUR WEBSITE FOR ALL VISITORS! | |
=================================================== | |
* Many of your visitors probably see � if they don't have emoji support on their device | |
* This script tries to detect if they have emoji support, and, if they don't, it adds it using Twitter's awesome Twemoji library! | |
Instructions | |
------------ | |
* Insert this code before your closing </body> tag |
So, you want to edit a web page, change the copy, and save the results -- all without triggering any page reloads.
Video tutorial: https://share.getcloudapp.com/bLuenjZK
Right click on the web page, select the "Inspect"
option, and switch to the "Console"
tab.
### Confusion | |
- 5 people have mentioned that they're confused by the formation in the top left not being on the grid. They have no idea how to judge the distance and find it frustrating and confusing. | |
- I think even just a white background behind it would help with the confusion | |
- "There should be somewhere that explains how to play it somewhere" | |
- The initial message isn't obvious enough and it actually obscures your player, distracting from playing. But, once it's gone, there's no way to figure out how to play. So, if you didn't read it, you're screwed. | |
- It would be nice if the instructions persisted | |
### Bugs | |
- On mobile, I think there's no way to disable the pixel info after clicking on a pixel |
<div style=" | |
position: absolute; | |
z-index: 1; | |
bottom: 13px; | |
left: 50%; | |
transform: translate(-50%); | |
font-weight: bold; | |
color: var(--dark-text); | |
font-size: 16px; | |
">Play with us every night at 7pm EST: <a href="#" style=" |
{ | |
"on": true | |
} |