From 231ee9b3c141a90bc6971d357563baf555c5ffe2 Mon Sep 17 00:00:00 2001 From: Daniel Sil Date: Thu, 25 Jul 2024 16:57:12 +0200 Subject: [PATCH] docs: update tokens to new names --- docs/src/components/BlockQuote/index.tsx | 2 +- docs/src/components/ComponentStatus/ComponentStatus.tsx | 2 +- docs/src/components/ComponentStructure/index.tsx | 6 +++--- docs/src/components/Container/index.tsx | 4 ++-- docs/src/components/Guidelines/GuidelineImages.tsx | 4 ++-- docs/src/components/Guidelines/GuidelinesSideBySide.tsx | 2 +- docs/src/components/Guidelines/index.tsx | 4 ++-- docs/src/components/ImagesDownloadList.tsx | 4 ++-- docs/src/components/Palette/helpers.tsx | 2 +- docs/src/components/Search/SearchButton.tsx | 2 +- 10 files changed, 16 insertions(+), 16 deletions(-) diff --git a/docs/src/components/BlockQuote/index.tsx b/docs/src/components/BlockQuote/index.tsx index 397d946a70..ebb16c77cc 100644 --- a/docs/src/components/BlockQuote/index.tsx +++ b/docs/src/components/BlockQuote/index.tsx @@ -8,7 +8,7 @@ const StyledWrapper = styled.div` border-left: 3px solid ${theme.orbit.paletteInkDark}; padding: ${theme.orbit.spaceMedium}; background: ${theme.orbit.paletteCloudLight}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; ${StyledAnchor} + & { margin-top: ${theme.orbit.spaceXXSmall} !important; } diff --git a/docs/src/components/ComponentStatus/ComponentStatus.tsx b/docs/src/components/ComponentStatus/ComponentStatus.tsx index 25383b4df7..129b82fb43 100644 --- a/docs/src/components/ComponentStatus/ComponentStatus.tsx +++ b/docs/src/components/ComponentStatus/ComponentStatus.tsx @@ -15,7 +15,7 @@ export const StyledContainer = styled.div` ${({ theme }) => css` position: relative; border: 1px solid ${theme.orbit.paletteCloudNormal}; - border-radius: ${theme.orbit.borderRadiusLarge}; + border-radius: ${theme.orbit.borderRadius150}; overflow: hidden; `}; `; diff --git a/docs/src/components/ComponentStructure/index.tsx b/docs/src/components/ComponentStructure/index.tsx index b5d2f23107..5d61797294 100644 --- a/docs/src/components/ComponentStructure/index.tsx +++ b/docs/src/components/ComponentStructure/index.tsx @@ -32,8 +32,8 @@ const StyledTab = styled.button<{ active: boolean }>` ${({ theme, active }) => css` padding: 14px ${theme.orbit.spaceMedium}; margin-bottom: -1px; - border-top-left-radius: ${theme.orbit.borderRadiusLarge}; - border-top-right-radius: ${theme.orbit.borderRadiusLarge}; + border-top-left-radius: ${theme.orbit.borderRadius150}; + border-top-right-radius: ${theme.orbit.borderRadius150}; border: 1px solid transparent; border-bottom: none; ${active && @@ -48,7 +48,7 @@ StyledTab.defaultProps = { theme: docsTheme }; const StyledPanel = styled.div` ${({ theme }) => css` border: 1px solid ${theme.orbit.paletteCloudNormal}; - border-radius: ${theme.orbit.borderRadiusLarge}; + border-radius: ${theme.orbit.borderRadius150}; `}; `; StyledPanel.defaultProps = { theme: docsTheme }; diff --git a/docs/src/components/Container/index.tsx b/docs/src/components/Container/index.tsx index 5ac6139d3f..ff32aa5be9 100644 --- a/docs/src/components/Container/index.tsx +++ b/docs/src/components/Container/index.tsx @@ -8,14 +8,14 @@ const StyledContainer = styled.div` justify-content: space-between; gap: ${theme.orbit.spaceSmall}; padding: ${theme.orbit.spaceXLarge}; - border-radius: ${theme.orbit.borderRadiusLarge}; + border-radius: ${theme.orbit.borderRadius150}; background: ${theme.orbit.paletteCloudLight}; & > img { max-width: 100%; justify-self: center; background: ${theme.orbit.paletteWhite}; - border-radius: ${theme.orbit.borderRadiusLarge}; + border-radius: ${theme.orbit.borderRadius150}; padding: ${theme.orbit.spaceXLarge}; } `}; diff --git a/docs/src/components/Guidelines/GuidelineImages.tsx b/docs/src/components/Guidelines/GuidelineImages.tsx index f5d8016a4f..d76abf5a13 100644 --- a/docs/src/components/Guidelines/GuidelineImages.tsx +++ b/docs/src/components/Guidelines/GuidelineImages.tsx @@ -12,7 +12,7 @@ const GuidelineContainer = styled.div<{ type: "do" | "dont"; coloredBorder: bool width: 100%; ${resolveBorders}; background: ${theme.orbit.paletteCloudLight}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; `} `; @@ -24,7 +24,7 @@ const ImageContainer = styled.div` ${({ theme }) => css` width: 100%; background: ${theme.orbit.paletteWhite}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; padding: ${theme.orbit.spaceXLarge}; `} `; diff --git a/docs/src/components/Guidelines/GuidelinesSideBySide.tsx b/docs/src/components/Guidelines/GuidelinesSideBySide.tsx index fe9fe4d6de..cbbbea7ee0 100644 --- a/docs/src/components/Guidelines/GuidelinesSideBySide.tsx +++ b/docs/src/components/Guidelines/GuidelinesSideBySide.tsx @@ -24,7 +24,7 @@ const StyledContainer = styled.div<{ type: "do" | "dont"; coloredBorder: boolean ${({ theme }) => css` padding: ${theme.orbit.spaceMedium} ${theme.orbit.spaceLarge}; background: ${theme.orbit.paletteCloudLight}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; width: 100%; ${resolveBorders}; diff --git a/docs/src/components/Guidelines/index.tsx b/docs/src/components/Guidelines/index.tsx index 8f14238a83..229649607f 100644 --- a/docs/src/components/Guidelines/index.tsx +++ b/docs/src/components/Guidelines/index.tsx @@ -34,7 +34,7 @@ interface ImageContainerProps extends GuidelineType { const StyledComponent = styled.div` ${({ theme }) => css` background: ${theme.orbit.paletteCloudLight}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; padding: ${theme.orbit.spaceMedium}; ${resolveBorders}; p + & { @@ -52,7 +52,7 @@ const StyledComponent = styled.div` const StyledImageContainer = styled.div` ${({ theme, type }) => css` background: ${theme.orbit.paletteWhite}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; border-top: 3px solid ${type === "do" ? theme.orbit.paletteGreenNormal : theme.orbit.paletteRedNormal}; display: flex; diff --git a/docs/src/components/ImagesDownloadList.tsx b/docs/src/components/ImagesDownloadList.tsx index ebf755a546..2640819a0d 100644 --- a/docs/src/components/ImagesDownloadList.tsx +++ b/docs/src/components/ImagesDownloadList.tsx @@ -16,7 +16,7 @@ const StyledAnchor = styled.a` padding: ${theme.orbit.paddingButtonSmallWithLeftIcon}; padding-top: ${theme.orbit.spaceXXSmall}; height: ${theme.orbit.heightButtonSmall}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; transition: all ${theme.orbit.durationFast} ease-in; &:hover, @@ -42,7 +42,7 @@ const ImageWrap = styled.div` ${({ theme, width }) => css` padding: ${theme.orbit.spaceSmall}; border: 1px solid ${theme.orbit.borderColorCard}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; margin-top: ${theme.orbit.spaceMedium}; width: ${width}; margin-right: 2%; diff --git a/docs/src/components/Palette/helpers.tsx b/docs/src/components/Palette/helpers.tsx index d29ebce97f..fe66a5b85b 100644 --- a/docs/src/components/Palette/helpers.tsx +++ b/docs/src/components/Palette/helpers.tsx @@ -36,7 +36,7 @@ export const isLight = (hex: string) => { export const resolveBorders = ({ order, isFull, isMiddle, isLeft, isFullBottom, isRight, isExpanded }: BorderProps) => ({ theme }) => { - const radius = theme.orbit.borderRadiusLarge; + const radius = theme.orbit.borderRadius150; if (order === "only") { if (isExpanded) { diff --git a/docs/src/components/Search/SearchButton.tsx b/docs/src/components/Search/SearchButton.tsx index 6336d1b126..542363828d 100644 --- a/docs/src/components/Search/SearchButton.tsx +++ b/docs/src/components/Search/SearchButton.tsx @@ -35,7 +35,7 @@ export const StyledIcon = styled.span<{ type: Type }>` background: ${type === "primary" ? theme.orbit.paletteProductLightActive : theme.orbit.paletteCloudNormal}; - border-radius: ${theme.orbit.borderRadiusNormal}; + border-radius: ${theme.orbit.borderRadius100}; `} `;