wwwroot/css/app.css

@@ -0,0 +1,74 @@
+
+ul{
+  padding:0;
+}
+
+.gz-list, .list-unstyled{
+  list-style: none;
+}
+
+.gz-content{
+  margin-top:64px;
+}
+
+.gz-larger{
+  font-size: larger;
+}
+
+.gz-smaller{
+  font-size: smaller;
+}
+
+@media screen and (max-width: 576px){ /* bump up font on smaller screen */
+  html{font-size: 20px}
+
+  .gz-content{
+    margin-top:80px;
+  }
+}
+
+/*App specific styles*/
+/* .peck-list{
+  max-width: 550px;
+  background-color: linen;
+} */
+
+.new-item{
+  width:100%;
+}
+
+.pl-toggle{
+  font-size:36px;
+}
+
+.pl-done > span{
+  text-decoration: line-through;
+  font-weight: lighter;
+  font-size:12px; 
+}
+
+.pl-long-item{
+  font-size:smaller;
+}
+
+.pl-short-item{
+  font-size:larger;
+}
+
+
+/*
+MAKE SCREEN SIZE AVAILABLE TO JS
+Large is considered above 768px wide
+and is the Bootstrap 4 breakpoint for medium screens and up
+*/
+
+body::after {
+  content: 'app-small-mode';
+  display: none;
+}
+@media screen and (min-width: 768px) {
+  body::after {
+      content: 'app-large-mode';
+      display: none;
+  }
+}