Skip to content

Drowdown in Application layout header has bigger height #1451

@aidamag

Description

@aidamag

Describe the bug
Container DxcApplicationLayout.Header.Dropdown has more height than in the specifications.

To Reproduce

import { DxcApplicationLayout, DxcDropdown } from "@dxc-technology/halstack-react";
import React from "react";

export default function App() {
  const optionsUser = [
    {
      value: 1,
      label: "Test",
    },
    {
      value: 2,
      label: "Test",
    },
  ];

  return (
    <DxcApplicationLayout
    header={
      <DxcApplicationLayout.Header
        content={
          <React.Fragment>
            <DxcApplicationLayout.Header.Dropdown
            label="Header Dropdown"
            options={optionsUser}/>
            <DxcDropdown
            label="Dropdown"
            options={optionsUser}/>
          </React.Fragment>
        }
      ></DxcApplicationLayout.Header>
    }
    >
      <DxcApplicationLayout.Main>Main Content</DxcApplicationLayout.Main>
    </DxcApplicationLayout>
  );
}

First dropdown using DxcApplicationLayout.Header.Dropdown has 44px of height. Meanwhile, a normal dropdown (the second one), it has 40px of height.

Expected behaviour
It should have height: 40px as it is specified in the specifications.

Screenshots
image

image

image

Add labels
dropdown, header, application layout.

Metadata

Metadata

Assignees

Labels

bugSomething isn't workingjiraThis task is referenced in a story of Jira

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions