Skip to content
This repository has been archived by the owner on Mar 23, 2023. It is now read-only.

refactor: explicitly align dropdown content and remove min width #2745

Merged
merged 2 commits into from Aug 28, 2020
Merged

refactor: explicitly align dropdown content and remove min width #2745

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
32d2d07
refactor: explicitly align dropdown content and remove min width
dated Aug 28, 2020
0c1e97b
style: resolve style guide violations
dated Aug 28, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 1 addition & 5 deletions src/app/components/Dropdown/Dropdown.styles.ts
View file
Open in desktop
@@ -1,7 +1,3 @@
import tw, { css } from "twin.macro";

export const defaultStyles = css`
min-width: 12rem;
`;
import tw from "twin.macro";

export const defaultClasses = tw`mt-8 py-3 absolute z-10 bg-theme-background rounded-lg shadow-xl border-theme-neutral-contrast border-1`;
5 changes: 2 additions & 3 deletions src/app/components/Dropdown/Dropdown.tsx
View file
Open in desktop
Expand Up @@ -4,7 +4,7 @@ import React, { useEffect, useRef, useState } from "react";
import { styled } from "twin.macro";
import { Size } from "types";

import { defaultClasses, defaultStyles } from "./Dropdown.styles";
import { defaultClasses } from "./Dropdown.styles";

export type DropdownOption = {
label: string;
Expand All @@ -24,7 +24,6 @@ type Props = {
};

export const Wrapper = styled.div`
${defaultStyles}
${defaultClasses}
`;

Expand All @@ -35,7 +34,7 @@ const renderOptions = (options: DropdownOption[], onSelect: any) => (
<ul data-testid="dropdown__options">
{options.map((option: DropdownOption, key: number) => (
<li
className="block px-8 py-4 text-sm font-semibold cursor-pointer text-theme-neutral-800 hover:bg-theme-neutral-200 hover:text-theme-primary"
className="block px-8 py-4 text-sm font-semibold text-left cursor-pointer text-theme-neutral-800 hover:bg-theme-neutral-200 hover:text-theme-primary"
key={key}
data-testid={`dropdown__option--${key}`}
onClick={(e: any) => {
Expand Down
8 changes: 4 additions & 4 deletions ...nents/SearchBar/SearchBarPluginFilters/__snapshots__/SearchBarPluginFilters.test.tsx.snap
View file
Open in desktop
Expand Up @@ -53,7 +53,7 @@ exports[`SearchBarPluginFilters should render categories 1`] = `
</div>
</span>
<div
class="sc-AxiKw dLsSkj right-0 undefined"
class="sc-AxiKw hjNPVU right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down Expand Up @@ -622,7 +622,7 @@ exports[`SearchBarPluginFilters should render ratings 1`] = `
</div>
</span>
<div
class="sc-AxiKw dLsSkj right-0 undefined"
class="sc-AxiKw hjNPVU right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down Expand Up @@ -1245,7 +1245,7 @@ exports[`SearchBarPluginFilters should render with null initialValues 1`] = `
</div>
</span>
<div
class="sc-AxiKw dLsSkj right-0 undefined"
class="sc-AxiKw hjNPVU right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down Expand Up @@ -1744,7 +1744,7 @@ exports[`SearchBarPluginFilters should render with selected values 1`] = `
</div>
</span>
<div
class="sc-AxiKw dLsSkj right-0 undefined"
class="sc-AxiKw hjNPVU right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down
4 changes: 2 additions & 2 deletions src/domains/dashboard/pages/Dashboard/__snapshots__/Dashboard.test.tsx.snap
View file
Open in desktop
Expand Up @@ -2517,7 +2517,7 @@ exports[`Dashboard should hide portfolio view 1`] = `
</div>
</span>
<div
class="sc-AxhUy iwnmXm right-0 undefined"
class="sc-AxhUy HIeKl right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down Expand Up @@ -4332,7 +4332,7 @@ exports[`Dashboard should hide transaction view 1`] = `
</div>
</span>
<div
class="sc-AxhUy iwnmXm right-0 undefined"
class="sc-AxhUy HIeKl right-0 undefined"
>
<div
data-testid="dropdown__content"
Expand Down