Themes

docs/components/CallToAction.tsx

@@ -1,62 +1,33 @@
+import { Link, LinkProps } from "@radix-ui/themes";
 import { VariantProps, styled } from "src/styles/stitches.config";
 
-import Link from "next/link";
 import React from "react";
 
-type StyledCallToActionVariants = VariantProps<typeof StyledCallToAction>;
-
-interface CallToActionProps {
+interface CallToActionProps extends LinkProps {
   href: string;
   text: string;
 }
 
-const CallToAction: React.FC<
-  CallToActionProps & StyledCallToActionVariants
-> = ({ href, size, text }) => {
+const CallToAction: React.FC<CallToActionProps> = ({
+  href,
+  size = "3",
+  text,
+}) => {
   return (
     <StyledCallToAction
-      className="nx-bg-primary-400/10"
+      className="rt-BaseButton rt-Button rt-r-size-2 rt-variant-solid"
       href={href}
       size={size}
+      underline="none"
     >
       {text} <span>→</span>
     </StyledCallToAction>
   );
 };
 
 const StyledCallToAction = styled(Link, {
-  display: "inline-flex",
-  fontSize: "1.47rem",
-  fontWeight: "400",
-  lineHeight: "1.6",
-  borderRadius: "6px",
-  color: "#fff",
-  background:
-    "linear-gradient(130deg, hsl(var(--nextra-primary-hue), 100%, 45%) 0%, hsl(calc(var(--nextra-primary-hue) + 50deg), 100%, 38.2%) 100%)",
-  padding: "0.75rem 1.5rem",
-  gap: "0.5rem",
-  boxShadow:
-    "-15px 0 30px -15px hsl(var(--nextra-primary-hue) 100% 45%), 0 0 30px -15px hsl(235 100% 38.2%), 15px 0 30px -15px hsl(calc(var(--nextra-primary-hue) + 50deg), 100%, 45%)",
-  textShadow: "-1px -1px 2px hsl(var(--nextra-primary-hue), 100%, 10%, 10%)",
-  transition: "all 200ms ease-in-out",
-
-  "&:hover, &:focus": {
-    boxShadow:
-      "-15px 0 30px -15px hsla(var(--nextra-primary-hue), 100%, 45%, 100%), 0 0 30px -15px hsla(235, 100%, 38.2%, 38.2%), 15px 0 30px -15px hsla(calc(var(--nextra-primary-hue) + 10deg), 100%, 85%, 25%)",
-  },
-
-  variants: {
-    size: {
-      small: {
-        fontSize: "1rem",
-        padding: "0.25rem .75rem",
-      },
-    },
-  },
-
   span: {
     display: "inline-flex",
-    color: "hsla(var(--nextra-primary-hue), 100%, 75%, 61.8%)",
   },
 });
 

docs/components/DynamicImports/Slider.tsx

@@ -5,7 +5,7 @@ import { useRouter } from "next/router";
 
 // todo: set this as a constant somewhere?
 const defaultIiifContent =
-  "https://api.dc.library.northwestern.edu/api/v2/works/ad25d4af-8a12-4d8f-a557-79aea012e081?as=iiif";
+  "https://api.dc.library.northwestern.edu/api/v2/works/3807023b-76b7-4062-9e40-d63ebc8945a9/similar?as=iiif&collectionLabel=More+Like+This&collectionSummary=Similar+to+Johnny+Rivers%2C+Monterey+Pop+Festival";
 
 const CloverSlider = ({
   iiifContent = defaultIiifContent,