1 files changed, 26 insertions, 7 deletions
diff --git a/static/css/layouts/notes.css b/static/css/layouts/notes.css
index d481f13..28f852c 100644
--- a/static/css/layouts/notes.css
+++ b/static/css/layouts/notes.css
@@ -25,12 +25,16 @@
 
 .note-card-holder{
   padding-top: 2rem;
+  display: grid;
+  grid-gap: 0.5rem;
+  grid-template-columns: repeat(auto-fill, minmax(30rem,1fr));
+  grid-auto-rows: 20px;
 }
 
-.note-collection {
+/* .note-collection {
   display: flex;
   flex-wrap: wrap;
-}
+} */
 
 .note-card {
   align-self: flex-start;
@@ -41,7 +45,22 @@
 }
 
 .note-title{
-  font-weight: 800;
+  padding-left: 1rem;
+  color: #248aaa;
+}
+
+.note-title span{
+  background: #e5e9f2;
+  padding-right: 5px;
+}
+
+.note-title:before{
+  content:'';
+  display:inline-block;
+  width:98%;
+  height:100%;
+  margin-bottom:-26px;
+  border-bottom: 1px solid #248aaa;
 }
 
 .note-card .card-body{
@@ -53,7 +72,7 @@
   border-radius: 3px;
 }
 
-.small-note{
+/* .small-note{
   max-width: 15rem;
 }
 
@@ -65,7 +84,7 @@
   max-width: 40rem;
 }
 
-.huge-note{}
+.huge-note{} */
 
 .note-badge{
   font-size: 10pt;
@@ -146,8 +165,8 @@
     transition: all ease-out 0.3s;
   }
 
-  .content-section.hide .note-card-holder .note-card {
-    max-width: 100%;
+  .content-section.hide .note-card-holder{
+    grid-template-columns: repeat(auto-fill, minmax(30rem,1fr));
     transition: all ease-out 0.3s;
   }
 }