diff --git a/content.js b/content.js index 42c0cf08..a84f2911 100644 --- a/content.js +++ b/content.js @@ -31,11 +31,12 @@ $(document).ready( function() { chrome.runtime.sendMessage({command: "alreadyContains",unique: $(this).find('td[data-th="Unique"]').text()}, function(response) { if(response.alreadyContains){ //DO SOMETHING IF ALREADY CONTAINS + console.log("ALREADY CONTAINS IN THIS ROW"); } }); } }); - + $(".distButton").click(function(){ var row = $(this).closest('tr'); getCourseInfo(row); diff --git a/popup.css b/popup.css new file mode 100644 index 00000000..22d102bc --- /dev/null +++ b/popup.css @@ -0,0 +1,76 @@ + .card { + box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); + transition: 0.3s; + margin:5px; + } + + .card:hover { + box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2); + } + + .container { + padding: 2px 16px; + } + h2 { + padding: 10px 0px 0 10px; + } + li { + width: 350px; + + } + body{ + min-width: 350px; + min-height: 400px; + } + .matbut { + border: none; + outline: none; + cursor: pointer; + color: white; + margin: 10px 10px 10px 0px; + padding: 10px 10px; + border-radius: 10px; + font-size: medium; + font-style: bold; + box-shadow: 2px 2px 4px rgba(0, 0, 0, .4); + background: #FF9800; + } + + /* Ripple magic */ + .matbut{ + position: relative; + overflow: hidden; + } + + .matbut:after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + width: 5px; + height: 5px; + background: rgba(255, 255, 255, .5); + opacity: 0; + border-radius: 100%; + transform: scale(1, 1) translate(-50%); + transform-origin: 50% 50%; + } + + @keyframes ripple { + 0% { + transform: scale(0, 0); + opacity: 1; + } + 20% { + transform: scale(25, 25); + opacity: 1; + } + 100% { + opacity: 0; + transform: scale(40, 40); + } + } + + .matbut:focus:not(:active)::after { + animation: ripple 1s ease-out; + } \ No newline at end of file diff --git a/popup.html b/popup.html index 9e1fdb90..90945616 100644 --- a/popup.html +++ b/popup.html @@ -1,37 +1,19 @@
- - + + - - -"+text+">"); + $("#courseList").prepend("
"+text+">"); } }); var courses = data.savedCourses; @@ -26,17 +26,20 @@ chrome.storage.sync.get('savedCourses', function(data) { else if(status.includes("closed") || status.includes("cancelled")){ color = "#F44336"; } - var listhtml = "