instructions.js

const data = ['<div class="zoom"><div class="en">Navigate to: https://docs.google.com/spreadsheets</div></div>', '<div class="zoom"><div class="en">I\'m Text content from Column B!</div></div>', '<div class="zoom"><div class="en">I\'m a text</div><div class="en">with</div><div class="en">multiple</div><div class="en">lines</div></div>', '<div class="zoom"><div class="en">I\'ll FADE if I\'m different, </div><div class="en">but I\'ll </div><div class="en">ZOOM </div><div class="en">if I\'m the same</div></div>', '<div class="en">I\'ll FADE if I\'m different, </div><div class="en">but I\'ll </div><div class="zoom"><div class="en">ZOOM</div> </div><div class="en">if I\'m the same</div>', '<div class="zoom"><div class="en">Every piece of content in Column B needs a zoomable range. </div><div class="en">If you want the entire text in view on the screen, </div><div class="en">just set the asterisk at the start and end of the content</div></div>', '<div class="zoom"><div class="en"><span class="focus">Every piece of content</span> in Column B needs a <span class="focus">zoomable</span> range. </div><div class="en">If you want the entire text in view on the screen, </div><div class="en">just set the <span class="focus">asterisk</span> at the start and end of the content</div></div>', '<div class="zoom"><div class="en">He\'ll convert the spreadsheet into the proper SourceSuite format and upload your template to the web so it can be shared. </div></div>']

const data2 = ['Create a new Google Spreadsheet. ', 'Each row represents one slide in a SourceSuite. Column A represents the left column, which usually contains the commentary or the prompt. Column B is the right main column, which usually contains the primary content. As a learner moves forward or backward through a SourceSuite the content on the page will be updated based on the active row.', 'You can add line breaks to your right hand content by pressing Ctrl + Enter (for Windows) or Command ⌘ + Return (for Mac)  ', 'If the content in Column B is from a different text then the previous slide, the viewer will crossfade and show the new one. ', 'If the content in Column B is from the same text, the viewer will zoom in or out to accomodate the targeted content. ', "Only a single range of text can be zoomed in Column B at anytime. You should mark this range's start and end with an asterisk `*`.", 'You may add emphasis to as many phrases, words, or segments of text as you desire. To do this, simply mark the start and end of every emphasized range with an underscore `_`', "When you're done editing your SourceSuite, use the built-in share function on Google Sheets and share it with russel@sefaria.org"]