diff --git a/components/common/Select/index.module.scss b/components/common/Select/index.module.scss index 93b8eaa1..6417cffd 100644 --- a/components/common/Select/index.module.scss +++ b/components/common/Select/index.module.scss @@ -63,6 +63,10 @@ &.table { min-width: $unit * 30; + + @include breakpoint(phone) { + width: 100%; + } } &.hidden { diff --git a/components/common/Slider/index.module.scss b/components/common/Slider/index.module.scss index a34fb341..6ab8f85a 100644 --- a/components/common/Slider/index.module.scss +++ b/components/common/Slider/index.module.scss @@ -14,6 +14,10 @@ border-radius: 9999px; height: 3px; } + + &.table { + flex-grow: 1; + } } .range { diff --git a/components/common/SliderTableField/index.tsx b/components/common/SliderTableField/index.tsx index 00108118..02527f05 100644 --- a/components/common/SliderTableField/index.tsx +++ b/components/common/SliderTableField/index.tsx @@ -54,6 +54,7 @@ const SliderTableField = (props: Props) => { max={props.max} step={props.step} value={[props.value ? props.value : 0]} + className="table" onValueChange={handleValueChange} onValueCommit={handleValueCommit} /> diff --git a/components/common/TableField/index.module.scss b/components/common/TableField/index.module.scss index de900793..e48b5328 100644 --- a/components/common/TableField/index.module.scss +++ b/components/common/TableField/index.module.scss @@ -36,6 +36,14 @@ } } + &.switch { + @include breakpoint(phone) { + align-items: center; + flex-direction: row; + justify-content: space-between; + } + } + .left { align-items: center; display: flex;