finished modal, also used an atom plugin to better format the html

go/go/templates/link_box.html

-{% load go_extras %}
-{% load qr_tags %}
+{% load go_extras %} {% load qr_tags %}
 
 <style>
-  a.share:link {color:#000000;}
-  a.share:visited {color:#000000;}
-  a.share:hover {color:#000000;}
-  a.share {text-decoration:none;}
+    a.share:link {
+        color: #000000;
+    }
+
+    a.share:visited {
+        color: #000000;
+    }
+
+    a.share:hover {
+        color: #000000;
+    }
+
+    a.share {
+        text-decoration: none;
+    }
+
+    a.button:link {
+        color: #FFF;
+    }
 
-  a.button:link {color:#FFF;}
-  a.button:visited {color:#FFF;}
-  a.button:hover {color:#FFF;}
+    a.button:visited {
+        color: #FFF;
+    }
+
+    a.button:hover {
+        color: #FFF;
+    }
 
     legend {
         font-size: inherit;
     }
+
     pre {
         font-family: inherit;
     }
@@ -29,11 +48,8 @@
         <strong>Target URL:</strong>
         <br />
         <a href="{{url.target}}">{{url.target}}</a>
-        <br />
-
-      {% if url.owner == request.user.registereduser and request.user.registereduser.approved == True %}
-      <strong>Clicks:</strong>
-        {{url.clicks}}
+        <br /> {% if url.owner == request.user.registereduser and request.user.registereduser.approved == True %}
+        <strong>Clicks:</strong> {{url.clicks}}
         <br />
 
         <strong>QR Code Uses:</strong> {{url.qrclicks}}
@@ -48,10 +64,7 @@
         <!-- <a class="button btn btn-danger btn-sm fa" href="{{domain}}delete/{{url.short}}">
         <i class="fa fa-trash-o fa-lg"></i> Delete</a> -->
 
-      <a tabindex="0" class="button btn btn-info btn-sm fa"
-        role="button" data-toggle="popover" title="Not Implemented Quite Yet :("
-        data-content=
-        "We are working on adding this feature in a future
+        <a tabindex="0" class="button btn btn-info btn-sm fa" role="button" data-toggle="popover" title="Not Implemented Quite Yet :(" data-content="We are working on adding this feature in a future
         release of Go. If you'd like to check that progress or potentially
         contribute code, head to git.gmu.edu/srct/go">
             <i class="fa fa-cog"></i> Edit</a>
@@ -60,15 +73,15 @@
             <div class="modal-dialog">
 
                 <!-- Modal content-->
-              <div class="modal-content" style="background-color:#f5f5f5;border-radius: 7px" >
+                <div class="modal-content" style="background-color:#f5f5f5; border-radius: 7px">
                     <div class="modal-header" style="text-align:center;">
                         <!-- <button type="button" class="close" data-dismiss="modal">&times;</button> -->
-                      <span class="fa-stack fa-fw">
+                        <!-- <span class="fa-stack fa-fw">
                         <i class="fa fa-circle fa-stack-2x"></i>
                         <i class="fa fa-times fa-stack-1x fa-inverse"></i>
-                      </span>
-                        <h4 class="modal-title fa text-center" style="font-weight:bold; font-size: 21px !important;"><i class="fa">Are you sure you would like to <color style="color:red">delete</color> this link? </i></h4>
-                      <h5 class="fa" style="color:red;font-weight:600;margin-top: 0px;margin-bottom: 0px;">Deleting a link is permenant and can not be undone!</h5>
+                      </span> -->
+                        <h4 class="modal-title fa text-center" style="font-weight:bold; font-size: 21px !important;">Are you sure you would like to <color style="color:red">delete</color> this link?</h4>
+                        <h5 style="color:red;font-weight:500;margin-top: 0px;margin-bottom: 0px;">Deleting a link is permenant and can not be undone!</h5>
                     </div>
                     <div class="modal-body" style="padding-bottom: 80px">
                         <a type="button" class="btn btn-success btn-lg" style="border-width: 0px;float:left; width:49%; background-color: #A9B0AD; border-radius: 4px;" data-dismiss="modal">Cancel</a>
@@ -84,12 +97,7 @@
     </div>
 
     <div class="col-md-4">
-  {% with domain|add:url.short as the_url %}
-    {% with the_url|add:"?qr" as qr_url%}
-      {% qr_from_text qr_url 's' %}
-    {% endwith %}
-
-    {% with the_url|add:"?social" as social_url %}
+        {% with domain|add:url.short as the_url %} {% with the_url|add:"?qr" as qr_url%} {% qr_from_text qr_url 's' %} {% endwith %} {% with the_url|add:"?social" as social_url %}
         <a class="share" href="http://twitter.com/share?url={{ social_url }}" target="_blank" title="Share via Twitter">
             <i class="fa fa-twitter-square fa-3x"></i>
         </a>
@@ -105,23 +113,20 @@
         <a class="share" href="http://www.linkedin.com/shareArticle?mini=true&amp;url={{ social_url }}&amp;ro=false&amp;summary=&amp;source=" target="_blank" title="Share via LinkedIn">
             <i class="fa fa-linkedin-square fa-3x"></i>
         </a>
-    {% endwith %}
-
-    {% with the_url|add:"?qr" as qr_url %}
+        {% endwith %} {% with the_url|add:"?qr" as qr_url %}
         <pre><strong>QR Downloads:</strong>
         <a href="http://chart.googleapis.com/chart?cht=qr&chs=268x268&chl={{ qr_url }}" target="_blank">Small (268x268)</a>
         <a href="http://chart.googleapis.com/chart?cht=qr&chs=383x383&chl={{ qr_url }}" target="_blank">Medium (383x383)</a>
         <a href="http://chart.googleapis.com/chart?cht=qr&chs=547x547&chl={{ qr_url }}" target="_blank">Large (547x547)</a>
-        </pre>
-    {% endwith %}
-
-  {% endwith %}
+        </pre> {% endwith %} {% endwith %}
     </div>
 </div>
 
 <script>
-  $(function () {
-    var option = {'trigger': 'hover'};
-    $('[data-toggle="popover"]').popover( option )
+    $(function() {
+        var option = {
+            'trigger': 'hover'
+        };
+        $('[data-toggle="popover"]').popover(option)
     })
 </script>