add card rounded border and fix layout container overflow

postgresml · chillenberger · Feb 20, 2024 · Feb 6, 2024 · Feb 7, 2024 · Feb 8, 2024
commit b9452829f703073969de306b2a56034f2b2edb42
diff --git a/pgml-dashboard/src/components/pages/docs/landing_page/alt_card_template.html b/pgml-dashboard/src/components/pages/docs/landing_page/alt_card_template.html
@@ -1,4 +1,4 @@
-<a class="card h-100 w-100" href="<%- href %>">
+<a class="card h-100 w-100 rounded-2" href="<%- href %>">
   <div class="d-flex flex-row gap-2 align-items-start">
     <span class='material-symbols-outlined'><%- icon %></span>
     <p class="body-big-text flex-grow-1 mb-0 alt_title"><%- title %></p>

diff --git a/pgml-dashboard/src/components/pages/docs/landing_page/landing_page.scss b/pgml-dashboard/src/components/pages/docs/landing_page/landing_page.scss
@@ -9,7 +9,7 @@ div[data-controller="pages-docs-landing-page"] {
     }
 
     .card {
-        border-radius: 8px;
+        border-radius: 20px;
         background: #{$gray-800};
         box-shadow: 16px 20px 24px 0px rgba(6, 20, 37, 0.04);
         backdrop-filter: blur(8px);

diff --git a/pgml-dashboard/src/components/pages/docs/landing_page/template.html b/pgml-dashboard/src/components/pages/docs/landing_page/template.html
@@ -31,7 +31,7 @@
     </div>
   </div>
 
-  <div class="docs-content-max-width-container p-4 d-flex flex-column gap-5">
+  <div class="docs-content-max-width-container container d-flex flex-column gap-5">
     <div class="w-100 d-flex flex-column align-items-center">
       <h1 class="text-center">PostgresML</br><span class="text-gradient-green">Documentation</span></h1>
       <p class="w-75 text-center">PostgresML is a open-source database extension that turns Postgres into an end-to-end machine learning platform. Build, train, and deploy ML/AI models directly within your Postgres database without moving data between systems.</p>