diff --git a/.changeset/dull-shirts-wonder.md b/.changeset/dull-shirts-wonder.md new file mode 100644 index 0000000000..a5dfa71378 --- /dev/null +++ b/.changeset/dull-shirts-wonder.md @@ -0,0 +1,7 @@ +--- +"@nl-rvo/css-card": patch +"@nl-rvo/component-library-css": patch +"@nl-rvo/component-library-react": patch +--- + +Removed hover underline from full card title link diff --git a/.changeset/spotty-pumas-crash.md b/.changeset/spotty-pumas-crash.md new file mode 100644 index 0000000000..d07082cfa9 --- /dev/null +++ b/.changeset/spotty-pumas-crash.md @@ -0,0 +1,7 @@ +--- +"@nl-rvo/css-dialog": patch +"@nl-rvo/component-library-css": patch +"@nl-rvo/component-library-react": patch +--- + +Fixed Dialog border and margin diff --git a/components/card/src/index.scss b/components/card/src/index.scss index 1de90e5d50..83f25f4b02 100644 --- a/components/card/src/index.scss +++ b/components/card/src/index.scss @@ -148,10 +148,6 @@ display: block; text-decoration: none; - &:hover { - text-decoration: underline; - } - &::after { content: ""; cursor: pointer; diff --git a/components/dialog/src/index.scss b/components/dialog/src/index.scss index f646d60555..710d71e179 100644 --- a/components/dialog/src/index.scss +++ b/components/dialog/src/index.scss @@ -1,5 +1,6 @@ // Dialog .rvo-dialog { + border: none; box-sizing: border-box; display: flex; flex-direction: column; @@ -30,6 +31,7 @@ .rvo-dialog--drawer-left { height: 100vh; left: 0; + margin: initial; max-width: var(--rvo-dialog-drawer-max-width); min-width: var(--rvo-dialog-drawer-min-width); position: fixed; @@ -40,6 +42,7 @@ .rvo-dialog--drawer-right { height: 100vh; + margin: initial; max-width: var(--rvo-dialog-drawer-max-width); min-width: var(--rvo-dialog-drawer-min-width); position: fixed; diff --git a/components/max-width-layout/src/defaultArgs.ts b/components/max-width-layout/src/defaultArgs.ts index 057de9382d..90de897288 100644 --- a/components/max-width-layout/src/defaultArgs.ts +++ b/components/max-width-layout/src/defaultArgs.ts @@ -5,4 +5,5 @@ export const defaultArgs: IMaxWidthLayoutProps = { content: 'Deze gecentreerde layout container heeft een maximale breedte van {maxWidth}.', centered: true, inlinePadding: 'none', + useAsMinWidthToo: true, }; diff --git a/components/max-width-layout/src/index.scss b/components/max-width-layout/src/index.scss index 299fba0ba0..be030b78f9 100644 --- a/components/max-width-layout/src/index.scss +++ b/components/max-width-layout/src/index.scss @@ -14,16 +14,25 @@ .rvo-max-width-layout--sm { max-width: var(--rvo-layout-max-width-sm); - min-width: var(--rvo-layout-max-width-sm); } .rvo-max-width-layout--md { max-width: var(--rvo-layout-max-width-md); - min-width: var(--rvo-layout-max-width-md); } .rvo-max-width-layout--lg { max-width: var(--rvo-layout-max-width-lg); +} + +.rvo-min-width-layout--sm { + min-width: var(--rvo-layout-max-width-sm); +} + +.rvo-min-width-layout--md { + min-width: var(--rvo-layout-max-width-md); +} + +.rvo-min-width-layout--lg { min-width: var(--rvo-layout-max-width-lg); } diff --git a/components/max-width-layout/src/template.tsx b/components/max-width-layout/src/template.tsx index b728451466..e463d1de28 100644 --- a/components/max-width-layout/src/template.tsx +++ b/components/max-width-layout/src/template.tsx @@ -15,6 +15,7 @@ export interface IMaxWidthLayoutProps { content?: string; inlinePadding?: 'none' | 'sm' | 'md' | 'lg'; centered?: boolean; + useAsMinWidthToo?: boolean; /** @uxpinignoreprop */ className?: string | string[]; /** @uxpinpropname Content */ @@ -29,6 +30,9 @@ export const argTypes = { content: { control: 'text', }, + useAsMinWidthToo: { + control: 'boolean', + }, centered: { control: 'boolean', }, @@ -48,6 +52,7 @@ export const MaxWidthLayout: React.FC = ({ content = defaultArgs.content, inlinePadding = defaultArgs.inlinePadding, centered = defaultArgs.centered, + useAsMinWidthToo = defaultArgs.useAsMinWidthToo, children, className = [], ...props @@ -75,6 +80,7 @@ export const MaxWidthLayout: React.FC = ({ className={clsx( 'rvo-max-width-layout', `rvo-max-width-layout--${size}`, + useAsMinWidthToo && `rvo-min-width-layout--${size}`, `rvo-max-width-layout-inline-padding--${inlinePadding}`, !centered && 'rvo-max-width-layout--uncentered', className, diff --git a/packages/docusaurus/src/theme/DocRoot/Layout/Sidebar/styles.module.css b/packages/docusaurus/src/theme/DocRoot/Layout/Sidebar/styles.module.css index 87b1eb51bf..0e569b86bc 100644 --- a/packages/docusaurus/src/theme/DocRoot/Layout/Sidebar/styles.module.css +++ b/packages/docusaurus/src/theme/DocRoot/Layout/Sidebar/styles.module.css @@ -20,11 +20,4 @@ cursor: pointer; width: var(--doc-sidebar-hidden-width); } - - .sidebarViewport { - top: var(--ifm-navbar-height); - position: sticky; - height: 100%; - max-height: calc(100vh - 137px); - } } diff --git a/packages/docusaurus/src/theme/DocSidebarItem/Link/index.tsx b/packages/docusaurus/src/theme/DocSidebarItem/Link/index.tsx index 1ddd609ab7..1897c796f8 100644 --- a/packages/docusaurus/src/theme/DocSidebarItem/Link/index.tsx +++ b/packages/docusaurus/src/theme/DocSidebarItem/Link/index.tsx @@ -5,6 +5,7 @@ import useBaseUrl from '@docusaurus/useBaseUrl'; import { Link } from '@nl-rvo/components'; import type { Props } from '@theme/DocSidebarItem/Link'; import clsx from 'clsx'; +import styles from './styles.module.css'; export default function DocSidebarItemLink({ item, onItemClick, activePath, level, ...props }: Props): JSX.Element { const { href, label, className } = item; @@ -32,6 +33,7 @@ export default function DocSidebarItemLink({ item, onItemClick, activePath, leve {...props} showIcon={!isInternalLink ? 'after' : 'no'} icon={!isInternalLink ? 'externe-link' : undefined} + className={styles['sidebar-link']} > {label} diff --git a/packages/docusaurus/src/theme/DocSidebarItem/Link/styles.module.css b/packages/docusaurus/src/theme/DocSidebarItem/Link/styles.module.css new file mode 100644 index 0000000000..87e8abe08e --- /dev/null +++ b/packages/docusaurus/src/theme/DocSidebarItem/Link/styles.module.css @@ -0,0 +1,4 @@ +.sidebar-link:hover, +.sidebar-link:focus { + color: var(--rvo-color-grijs-700) !important; +}