Skip to content

Commit

Permalink
some fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
@talentlessguy
talentlessguy committed Dec 10, 2024
1 parent e37b10f commit abb0fea
Show file tree
Hide file tree
Showing 59 changed files with 106 additions and 108 deletions.
2 changes: 1 addition & 1 deletion src/components/@atoms/InnerDialog.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export const InnerDialog = styled.div(
gap: ${theme.space['4']};
max-height: 60vh;
max-width: 100vw;
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: calc(80vw - 2 * ${theme.space['6']});
max-width: ${theme.space['128']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/@atoms/MobileFullWidth.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ const MobileFullWidth = styled.div(
& {
width: ${theme.space.full};
max-width: ${theme.space.full};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
min-width: ${theme.space['40']};
width: fit-content;
max-width: max-content;
Expand Down
2 changes: 1 addition & 1 deletion src/components/@atoms/NameDetailItem/NameDetailItem.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ const NameItemWrapper = styled.div<{ $highlight: boolean; $disabled: boolean }>(
&:last-of-type {
border: none;
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['3']} ${theme.space['4.5']};
gap: ${theme.space['4']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/AdvancedEditor/AddRecord.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { convertFormSafeKey } from '../../../utils/editor'
const AddRecordContainer = styled.div(
({ theme }) => css`
width: ${theme.space.full};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
margin-top: -${theme.space['2']};
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/AdvancedEditor/AdvancedEditorTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ const TabButtonsContainer = styled.div(
gap: ${theme.space['1.25']} ${theme.space['3']};
padding: 0 ${theme.space['4']} 0 ${theme.space['2']};
width: ${theme.space.full};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: 0 ${theme.space['2']};
margin: -${theme.space['1.5']} 0 -${theme.space['2']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/BurnFuses/BurnFusesContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const FusesContainer = styled.div(
({ theme }) => css`
width: 100%;
padding: ${theme.space['1.25']} ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
min-width: ${theme.space['112']};
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/DialogComponentVariants/DialogFooterWithBorder.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const Wrapper = styled.div<{ $fullWidth?: boolean }>(
margin: -${theme.space['4']} -${theme.space['4']} 0 -${theme.space['4']};
padding: ${theme.space['4']} ${theme.space['4']} 0 ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: calc(100% + 2 * ${theme.space['6']});
margin: -${theme.space['6']} -${theme.space['6']} 0 -${theme.space['6']};
padding: ${theme.space['4']} ${theme.space['4']} 0 ${theme.space['4']};
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/DialogComponentVariants/DialogHeadinWithBorder.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const Wrapper = styled.div<{ $fullWidth?: boolean }>(
margin: -${theme.space['4']};
padding: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: calc(100% + 2 * ${theme.space['6']});
margin: 0 -${theme.space['6']} -${theme.space['6']} -${theme.space['6']};
padding: 0 ${theme.space['6']} ${theme.space['4']} ${theme.space['6']};
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/DialogComponentVariants/DialogInput.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const Wrapper = styled.div(
({ theme }) => css`
width: ${theme.space.full};
margin-bottom: -${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
margin-bottom: -${theme.space['6']};
}
`,
Expand Down
10 changes: 5 additions & 5 deletions src/components/@molecules/Hamburger/LanguageMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const Container = styled.div(
padding: ${theme.space['4']};
gap: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex-direction: column;
padding: 0;
gap: 0;
Expand All @@ -26,7 +26,7 @@ const Container = styled.div(

const HeadingWrapper = styled.div(
({ theme }) => css`
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
border-bottom: 1px solid ${theme.colors.border};
}
`,
Expand Down Expand Up @@ -55,7 +55,7 @@ const Heading = styled.div(
color: ${theme.colors.grey};
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
justify-content: flex-start;
padding: ${theme.space['4']} ${theme.space['6']};
margin: ${theme.space['2']};
Expand Down Expand Up @@ -88,7 +88,7 @@ const LanguagesContainer = styled.div(
align-items: stretch;
justify-content: flex-start;
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex-direction: column;
padding: ${theme.space['2']};
gap: 0;
Expand Down Expand Up @@ -125,7 +125,7 @@ const LanguageItem = styled.div(
color: ${theme.colors.green};
}
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
border: none;
}
`,
Expand Down
12 changes: 6 additions & 6 deletions src/components/@molecules/Hamburger/MainMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ const Container = styled.div(
padding: ${theme.space['4']};
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: 0;
gap: 0;
& > div {
Expand All @@ -65,7 +65,7 @@ const SettingsSection = styled.div(
margin-bottom: ${theme.space['2']};
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['2']};
margin: 0;
gap: 0;
Expand Down Expand Up @@ -98,7 +98,7 @@ const SettingsItem = styled.div(
}
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
border: none;
}
`,
Expand Down Expand Up @@ -134,7 +134,7 @@ const miscSectionStyle = css(
background-color: ${theme.colors.greySurface};
border-radius: ${theme.radii.large};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
background-color: transparent;
border-radius: none;
}
Expand Down Expand Up @@ -163,7 +163,7 @@ const RouteItem = styled.a(
background-color: ${theme.colors.greySurface};
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['2']} ${theme.space['4']};
}
`,
Expand Down Expand Up @@ -195,7 +195,7 @@ const NetworkSectionContainer = styled.div(
text-transform: capitalize;
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['4']} ${theme.space['6']};
}
`,
Expand Down
6 changes: 3 additions & 3 deletions src/components/@molecules/NameTableHeader/NameTableHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ const TableHeader = styled.div<{
border-bottom: 1px solid ${theme.colors.border};
padding: ${theme.space['3']} ${theme.space['4']};
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex-direction: row;
align-items: center;
padding: ${theme.space['3']} ${theme.space['4.5']};
Expand All @@ -48,7 +48,7 @@ const TableHeaderLeadingLeft = styled.div<{ $isFullWidth: boolean }>(
color: ${theme.colors.text};
${$isFullWidth && `flex: 1;`}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
gap: ${theme.space['4']};
flex-basis: auto;
flex-grow: 0;
Expand Down Expand Up @@ -82,7 +82,7 @@ const TableHeaderTrailing = styled.div<{
flex-direction: row;
align-items: center;
justify-content: center;
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex: ${$isDesktopFlexibleWidth ? '2' : `0 0 ${theme.space['32']}`};
width: ${theme.space['32']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/ProfileEditor/Avatar/AvatarCrop.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ const SliderContainer = styled.div(
height: ${theme.space['6']};
opacity: 0.15;
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['2']} ${theme.space['8']};
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/@molecules/SearchInput/SearchInput.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ const Container = styled.div<{ $size: 'medium' | 'extraLarge' }>(
width: 100%;
position: relative;
${$size === 'extraLarge' &&
`@media (min-width: 640px) {
` @media (min-width: ${theme.breakpoints.sm}px) {
padding-left: 48px;
padding-right: 48px;
}`}
Expand Down
2 changes: 1 addition & 1 deletion src/components/ConnectButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ const StyledButtonWrapper = styled.div<{ $isTabBar?: boolean; $large?: boolean }
height: ${theme.space['10']};
border-radius: ${theme.radii.full};
font-size: ${theme.fontSizes.body};
@media (min-width: 360px) {
@media (min-width: ${theme.breakpoints.xs}px) {
padding: 0 ${theme.space['8']};
}
}
Expand Down
10 changes: 5 additions & 5 deletions src/components/Header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const HeaderWrapper = styled.header(
({ theme }) => css`
height: ${theme.space['12']};
@media (max-width: 640px) {
@media (max-width: ${theme.breakpoints.sm}px) {
display: none;
}
`,
Expand Down Expand Up @@ -54,7 +54,7 @@ const NavContainer = styled.div(
gap: ${theme.space['3']};
height: ${theme.space['12']};
@media (min-width: 1024px) {
@media (min-width: ${theme.breakpoints.lg}px) {
flex-gap: ${theme.space['6']};
gap: ${theme.space['6']};
}
Expand All @@ -79,7 +79,7 @@ const RouteContainer = styled.div<{ $state: TransitionState }>(
transform: translateX(125%);
opacity: 0;
@media (min-width: 1024px) {
@media (min-width: ${theme.breakpoints.lg}px) {
flex-gap: ${theme.space['6']};
gap: ${theme.space['6']};
position: relative;
Expand All @@ -105,7 +105,7 @@ const SearchWrapper = styled.div<{ $state: TransitionState }>(
max-width: ${theme.space['80']};
& > div > div {
max-width: ${theme.space.full};
@media (min-width: 1024px) {
@media (min-width: ${theme.breakpoints.lg}px) {
max-width: ${theme.space['80']};
}
}
Expand All @@ -116,7 +116,7 @@ const SearchWrapper = styled.div<{ $state: TransitionState }>(
css`
margin-right: 0;
`}
@media (min-width: 1024px) {
@media (min-width: ${theme.breakpoints.lg}px) {
margin-right: 0;
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/LeadingHeading.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const LeadingHeading = styled.div(
flex-direction: row;
align-items: center;
justify-content: space-between;
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: calc(100% - calc(${theme.radii['2xLarge']} * 2));
margin-left: ${theme.radii['2xLarge']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/ProfileSnippet.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ const Container = styled.div<{ $banner?: string }>(
gap: ${theme.space['4']};
flex-gap: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['6']};
padding-top: ${theme.space['12']};
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/TabBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ const TabWrapper = styled.div(
${theme.colors.backgroundSecondary} 60%
);
padding: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
display: none;
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/pages/AnnouncementBanner.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ const Container = styled.div(
}
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex-direction: row;
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/pages/dotbox/[name]/DotBoxRegistration.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const DotBoxCard = styled(Card)(
padding: ${theme.space['4']};
align-items: flex-start;
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['6']} ${theme.space['18']};
gap: ${theme.space['6']};
}
Expand Down
6 changes: 3 additions & 3 deletions src/components/pages/import/[name]/shared.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export const DnsImportCard = styled(Card)(
gap: ${theme.space['4']};
padding: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['6']} ${theme.space['18']};
gap: ${theme.space['6']};
}
Expand Down Expand Up @@ -47,7 +47,7 @@ export const DnsImportActionsContainer = styled.div(
justify-content: stretch;
width: 100%;
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
flex-direction: row;
justify-content: center;
}
Expand All @@ -57,7 +57,7 @@ export const DnsImportActionsContainer = styled.div(
export const DnsImportActionButton = styled(Button)(
({ theme }) => css`
width: 100%;
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: ${theme.space['40']};
}
`,
Expand Down
2 changes: 1 addition & 1 deletion src/components/pages/import/[name]/steps/CompleteImport.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ const StyledCard = styled(Card)(
max-width: ${theme.space.full};
}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['6']} ${theme.space['18']};
gap: ${theme.space['6']};
}
Expand Down
8 changes: 4 additions & 4 deletions src/components/pages/profile/ProfileDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ const RecordsStack = styled.div(
gap: ${theme.space['4']};
padding: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['6']};
}
`,
Expand All @@ -127,7 +127,7 @@ const ActionsContainer = styled.div(
display: flex;
flex-direction: column;
gap: ${theme.space['4']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
padding: ${theme.space['4']} ${theme.space['6']};
}
`,
Expand All @@ -141,7 +141,7 @@ const Actions = styled.div(
flex-flow: row wrap;
gap: ${theme.space['2']};
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
& > .leading {
flex-grow: 1;
order: -1;
Expand All @@ -165,7 +165,7 @@ const ActionWrapper = styled.div<{
css`
width: 100%;
`}
@media (min-width: 640px) {
@media (min-width: ${theme.breakpoints.sm}px) {
width: initial;
${leading &&
css`
Expand Down
Loading

0 comments on commit abb0fea

Please sign in to comment.