Merge pull request #10 from floodfx/css

Css
floodfx · Jan 27, 2022 · b39b879 · b39b879
2 parents 0a3f773 + 995e396
commit b39b879
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/src/examples/pagination/component.ts b/src/examples/pagination/component.ts
@@ -103,7 +103,7 @@ export class PaginateLiveViewComponent extends BaseLiveViewComponent<PaginateCon
   paginationLink(text: string, pageNum: number, perPageNum: number, className: string) {
     const page = String(pageNum);
     const perPage = String(perPageNum);
-    return live_patch(text, {
+    return live_patch(html`<button>${text}</button>`, {
       to: {
         path: "/paginate",
         params: { page, perPage }
@@ -123,19 +123,19 @@ export class PaginateLiveViewComponent extends BaseLiveViewComponent<PaginateCon
         ${donation.quantity} lbs
         </td>
         <td>
-          <span class="${this.expiresClass(donation)}">
-          ${donation.days_until_expires}
+          <span>
+          ${this.expiresDecoration(donation)}
           </span>
         </td>
       </tr>
     `)
   }
 
-  expiresClass(donation: Donation) {
+  expiresDecoration(donation: Donation) {
     if (almostExpired(donation)) {
-      return "eat-now"
+      return html`<mark>${donation.days_until_expires}</mark>`
     } else {
-      return "fresh"
+      return donation.days_until_expires
     }
   }
 

diff --git a/src/server/web/views/index.html.ejs b/src/server/web/views/index.html.ejs
@@ -11,6 +11,7 @@
   </title>
   <script defer type="text/javascript" src="liveview.js"></script>
   <link rel="stylesheet" href="https://unpkg.com/[email protected]/nprogress.css" />
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exampledev/[email protected]/new.min.css">
 </head>
 
 <body>