removing erroneous import

src/app/components/ModalPermalink.jsx

@@ -34,6 +34,18 @@ export default class ModalPermalink extends TranslatedComponent {
     );
   }
 
+  /**
+   * Copy the shortened URL to the clipboard
+   * @param  {Event} e Click event
+   * @return {void}
+   */
+  copyShortLink() {
+    let copyText = document.getElementById("shortenedUrl");
+    // Copy the text inside the shortendUrl input to the clipboard
+    copyText.select();
+    document.execCommand("copy");
+  }
+
   /**
    * Render the modal
    * @return {React.Component} Modal Content
@@ -42,15 +54,17 @@ export default class ModalPermalink extends TranslatedComponent {
     let translate = this.context.language.translate;
 
     return <div className='modal' onClick={ (e) => e.stopPropagation() }>
-      <h2>{translate('permalink')}</h2>
+      <h3>{translate('permalink')}</h3>
       <br/>
       <h3>{translate('URL')}</h3>
       <input value={this.props.url} size={40} readOnly onFocus={ (e) => e.target.select() }/>
       <br/><br/>
       <h3 >{translate('shortened')}</h3>
-      <input value={this.state.shortenedUrl} readOnly size={25} onFocus={ (e) => e.target.select() }/>
+      <input id={'shortenedUrl'} value={this.state.shortenedUrl} readOnly size={25} onFocus={ (e) => e.target.select() }/><button className={'cb dismiss cap'} onClick={this.copyShortLink}>{translate('copy to clipboard')}</button>
       <br/><br/>
-      <p>s.orbis.zone is the new URL shortener domain, old eddp.co urls are considered end of life and could go down at any moment. Sorry for any inconvenience.</p>
+      <hr />
+      <p>s.orbis.zone is the URL shortener domain. These links should persist indefinitely going forward. If for some reason there is a problem with the link shortening process, please report it in the EDCD Discord Server.</p>
+      <hr />
       <button className={'r dismiss cap'} onClick={this.context.hideModal}>{translate('close')}</button>
     </div>;
   }

src/app/components/ModalShoppingList.jsx

@@ -359,15 +359,15 @@ export default class ModalShoppingList extends TranslatedComponent {
       <div>
       <p>{translate('PHRASE_DIFFERENT_ROLLS')}</p>
         <label>{translate('G1')}</label>
-        <input id={1} type={'number'} min={0} defaultValue={this.state.matsPerGrade[1]} onChange={this.changeHandler} />
+        <input className={'groll'} id={1} type={'number'} min={0} defaultValue={this.state.matsPerGrade[1]} onChange={this.changeHandler} />
         &nbsp;|&nbsp;<label>{translate('G2')}</label>
-        <input id={2} type={'number'} min={0} defaultValue={this.state.matsPerGrade[2]} onChange={this.changeHandler} />
+        <input className={'groll'} id={2} type={'number'} min={0} defaultValue={this.state.matsPerGrade[2]} onChange={this.changeHandler} />
         &nbsp;|&nbsp;<label>{translate('G3')}</label>
-        <input id={3} type={'number'} min={0} value={this.state.matsPerGrade[3]} onChange={this.changeHandler} />
+        <input className={'groll'} id={3} type={'number'} min={0} value={this.state.matsPerGrade[3]} onChange={this.changeHandler} />
         &nbsp;|&nbsp;<label>{translate('G4')}</label>
-        <input id={4} type={'number'} min={0} value={this.state.matsPerGrade[4]} onChange={this.changeHandler} />
+        <input className={'groll'} id={4} type={'number'} min={0} value={this.state.matsPerGrade[4]} onChange={this.changeHandler} />
         &nbsp;|&nbsp;<label>{translate('G5')}</label>
-        <input id={5} type={'number'} min={0} value={this.state.matsPerGrade[5]} onChange={this.changeHandler} />
+        <input className={'groll'} id={5} type={'number'} min={0} value={this.state.matsPerGrade[5]} onChange={this.changeHandler} />
       </div>
 
       <div>

src/less/modal.less

@@ -79,7 +79,7 @@
     color: @primary;
   }
 
-  input {
+  .groll {
     width: 6%;
     margin: 5px;
     text-align: center;