add import from gist, github, swarm, ipfs

src/app/ui/landing-page/landing-page.js

@@ -189,6 +189,10 @@ export class LandingPage extends BaseApi {
       this.appManager.ensureActivated('remixd')
     }
     let importFromExternal = () => { load('URL') }
+    let importFromGist = () => {
+      let app = globalRegistry.get('app').api
+      app.loadFromGist({gist: ''})
+    }
 
     let container = yo`<div>
       <div class="${css.hpLogoContainer}"><img src="${logo}" style="height:45px;" alt="Remix logo" /></div>
@@ -227,8 +231,12 @@ export class LandingPage extends BaseApi {
               </label>
             </p>
             <p class="mb-1 ${css.text}" onclick=${() => { connectToLocalhost() }}>Connect to Localhost</p>
-            <p class="mb-1 ${css.text} onclick=${() => { importFromExternal() }}">Import From external source</p>
-          </div><!-- end of div.file -->
+            <p class="mb-1 ${css.text} onclick=${() => { importFromExternal() }}">Import From:</p>
+              <button class="btn btn-lg btn-secondary" onclick=${() => { importFromGist() }}>Gist</button>
+              <button class="btn btn-lg btn-secondary" onclick=${() => { load('Github URL') }}>Github</button>
+              <button class="btn btn-lg btn-secondary" onclick=${() => { load('bzz-raw URL') }}>Swarm</button>
+              <button class="btn btn-lg btn-secondary" onclick=${() => { load('ipfs URL') }}>Ipfs</button>
+            </div><!-- end of div.file -->
         </div><!-- end of #col1 -->
         <div id="col2" class="col-sm-6">
           <div class="plugins mb-5">

src/app/ui/modal-dialog-custom.js

@@ -66,7 +66,7 @@ module.exports = {
 function prompt (title, text, hidden, inputValue, ok, cancel, focus) {
   if (!inputValue) inputValue = ''
   var type = hidden ? 'password' : 'text'
-  var input = yo`<input type=${type} name='prompt_text' id='prompt_text' class="${css['prompt_text']}" value='${inputValue}' >`
+  var input = yo`<input type=${type} name='prompt_text' id='prompt_text' class="${css['prompt_text']} form-control" value='${inputValue}' >`
   modal(title, yo`<div>${text}<div>${input}</div></div>`,
     {
       fn: () => { if (typeof ok === 'function') ok(document.getElementById('prompt_text').value) }

src/lib/gist-handler.js

@@ -12,7 +12,7 @@ function GistHandler (_window) {
     var gistId
     if (params['gist'] === '') {
       loadingFromGist = true
-      modalDialogCustom.prompt(null, 'Enter the URL or ID of the Gist you would like to load.', null, (target) => {
+      modalDialogCustom.prompt(null, 'Enter the ID of the Gist you would like to load.', null, (target) => {
         if (target !== '') {
           gistId = getGistId(target)
           if (gistId) {