using css instead of hard spaces to move the placeholder text to the right

diff --git a/karmaworld/assets/css/course_list_table.css b/karmaworld/assets/css/course_list_table.css
index 04bbe614cc8e52ab5a6307c6eb6d37469661541c..4090ecb268cd07f5054c85b2fbac6324fd1d207d 100644 (file)
--- a/karmaworld/assets/css/course_list_table.css
+++ b/karmaworld/assets/css/course_list_table.css
@@ -13,6 +13,7 @@ Search Bar
   border-style: solid;
   border-color: black;
   border-width: 1px;
+  padding-left: 32px; /* move the placeholder text to the right*/
   background-image: url(../img/lightbox_search_icon.png);
   background-position: 8px 50%;
   background-repeat: no-repeat;

diff --git a/karmaworld/templates/courses/course_list.html b/karmaworld/templates/courses/course_list.html
index ee81efcc3cd24c85bd5f5d864e618b57405b9a90..3c56cc90314721583ddb49cc950c4b0c63eda46f 100644 (file)
--- a/karmaworld/templates/courses/course_list.html
+++ b/karmaworld/templates/courses/course_list.html
@@ -78,7 +78,7 @@ $(document).ready(function() {
     // Use out Ajax endpoing to populate the list
     //'sAjaxSource': "{% url 'api_course_list' %}" 
   });
-  $('.dataTables_filter input').attr("placeholder", "   search courses");
+  $('.dataTables_filter input').attr("placeholder", "search courses");
   // TODO: can't prepend html to .dataTables_filter input html for fontawesome search icon
 });
 </script>