minor finishing touches

docs/discrete.Rmd

@@ -106,7 +106,7 @@ code_icon <- HTML('<svg class="w-8 h-8" xmlns="http://www.w3.org/2000/svg" class
 div(class="w-full", 
   HTML("<!-- sorting buttons & crosstalk inputs -->"),
   div(
-    class="w-full mx-auto py-24 bg-cover", 
+    class="w-full mx-auto py-8 bg-cover", 
     style="background-image: url('https://products.ls.graphics/mesh-gradients/images/33.-Beauty-Bush.jpg')",
     # Glassmorphic Card
     div(class="max-w-4xl mx-auto px-4 py-10 bg-white backdrop-filter backdrop-blur-lg bg-opacity-40 border-white border-y-2 lg:border-x-2 sm:shadow-lg lg:rounded-3xl ",
@@ -134,7 +134,7 @@ div(class="w-full",
             h2(class="text-2xl font-semibold tracking-tight text-grey-600 pb-4", "Filter Palettes"),
             div(
               filter_select("package_filter", "Package:", palettes_shared, ~package),
-              filter_checkbox("type_filter", "Type:", palettes_shared, ~type)
+              filter_checkbox("type_filter", "Type:", palettes_shared, ~type, inline = TRUE)
             )
           )
         )
@@ -145,14 +145,7 @@ div(class="w-full",
               class="text-2xl font-semibold tracking-tight text-grey-600 pb-4", 
               "Click a palette you like to display information"),
           ),
-          div(class="px-4 grid grid-flow-row grid-cols-1 gap-y-8 sm:grid-cols-3 sm:gap-y-0 sm:gap-x-4",
-            div(class="col-span-1 flex flex-col items-center gap-y-2",
-              div(class = "flex flex-col items-center",
-                palette_icon,
-                p(class="text-lg font-semibold text-gray-700", "Package + Palette")
-              ),
-              h2(class="text-xl", id="palette", "")
-            ),
+          div(class="px-4 grid grid-flow-row grid-cols-1 gap-y-8 sm:grid-cols-2 sm:gap-y-0 sm:gap-x-4",
             div(class="col-span-1 flex flex-col items-center gap-y-2",
               div(class = "flex flex-col items-center",
                 github_icon,
@@ -168,7 +161,7 @@ div(class="w-full",
               h2(class="text-xl", id="CRAN", "")
             )
           ),
-          div(class="px-4 mt-16",
+          div(class="px-4 mt-4",
             div(class="py-4 px-8 w-full lg:w-4/5 mx-auto bg-white backdrop-filter backdrop-blur-lg bg-opacity-40 border-white border-y-2 border-x-2 sm:shadow-lg lg:rounded-3xl flex flex-row gap-x-12 items-center",
                 code_icon,
                 div(id = "example1", class="flex-grow text-xl",
@@ -184,7 +177,7 @@ div(class="w-full",
     )
   ),
   HTML("<!-- Palettes -->"),
-  div(class="max-w-6xl mx-auto mt-24",
+  div(class="max-w-6xl mx-auto mt-8",
     shuffle_widget(
     shuffleId = "grid",
     shared_data = palettes_shared,

docs/index.Rmd

@@ -60,10 +60,12 @@ tags$nav(class="bg-gray-800 px-8 py-4",
 
 This is a new iteration of the [r-color-palettes](https://github.com/EmilHvitfeldt/r-color-palettes) repository.
 
-This website is in early stages of development. Think alpha build. More functionality and information will be added, along with styling of the site.
+This website is in early stages of development. Think alpha build. More functionality and information will be added.
 
 Any feedback, suggestions, or styling help are welcome as [issues](https://github.com/EmilHvitfeldt/r-color-palettes/issues).
 
+Styling of website was added by [Kyle F Butts](https://twitter.com/kylefbutts)
+
 Available palette pickers:
 
 - [Discrete Color Palettes](discrete.html)

docs/index.html

@@ -200,8 +200,9 @@
 <div id="r-color-palettes" class="section level1 max-w-6xl py-24 mx-auto prose">
 <h1>R Color Palettes</h1>
 <p>This is a new iteration of the <a href="https://github.com/EmilHvitfeldt/r-color-palettes">r-color-palettes</a> repository.</p>
-<p>This website is in early stages of development. Think alpha build. More functionality and information will be added, along with styling of the site.</p>
+<p>This website is in early stages of development. Think alpha build. More functionality and information will be added.</p>
 <p>Any feedback, suggestions, or styling help are welcome as <a href="https://github.com/EmilHvitfeldt/r-color-palettes/issues">issues</a>.</p>
+<p>Styling of website was added by <a href="https://twitter.com/kylefbutts">Kyle F Butts</a></p>
 <p>Available palette pickers:</p>
 <ul>
 <li><a href="discrete.html">Discrete Color Palettes</a></li>