yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-11-01 11:09:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

MINOR : fix side spacing in setting and other pages (#14957)

Browse Source 
* fix side spacing in setting and other pages

* minor fix
This commit is contained in:
Ashish Gupta 2024-01-30 21:05:09 +05:30 committed by GitHub
parent e2db70c389
commit 7849313f84
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
23 changed files with 140 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

212
openmetadata-ui/src/main/resources/ui/src/components/Applications/AppDetails/AppDetails.component.tsx
View File

@ -317,7 +317,7 @@ const AppDetails = () => {
),
key: ApplicationTabs.CONFIGURATION,
children: (
<div>
<div className="p-lg">
<FormBuilder
useSelectWidget
cancelText={t('label.back')}
@ -342,7 +342,7 @@ const AppDetails = () => {
),
key: ApplicationTabs.SCHEDULE,
children: (
<div className="p-y-md">
<div className="p-lg">
{appData && (
<AppSchedule
appData={appData}
@ -367,7 +367,7 @@ const AppDetails = () => {
),
key: ApplicationTabs.HISTORY,
children: (
<div className="p-y-md">
<div className="p-lg">
<AppRunsHistory appData={appData} />
</div>
),
@ -400,117 +400,115 @@ const AppDetails = () => {
return (
<PageLayoutV1
className="app-details-page-layout p-0"
className="app-details-page-layout"
pageTitle={t('label.application-plural')}>
<div className="page-container">
<Row>
<Col className="d-flex" flex="auto">
<Button
className="p-0"
icon={<LeftOutlined />}
size="small"
type="text"
onClick={onBrowseAppsClick}>
<Typography.Text className="font-medium">
{t('label.browse-app-plural')}
</Typography.Text>
</Button>
</Col>
<Col flex="360px">
<div className="d-flex gap-2 justify-end">
<Dropdown
align={{ targetOffset: [-12, 0] }}
className="m-l-xs"
menu={{
items: manageButtonContent,
}}
open={showActions}
overlayClassName="glossary-manage-dropdown-list-container"
overlayStyle={{ width: '350px' }}
placement="bottomRight"
trigger={['click']}
onOpenChange={setShowActions}>
<Tooltip placement="right">
<Button
className="glossary-manage-dropdown-button p-x-xs"
data-testid="manage-button"
icon={
<IconDropdown className="vertical-align-inherit manage-dropdown-icon" />
}
onClick={() => setShowActions(true)}
/>
</Tooltip>
</Dropdown>
</div>
</Col>
</Row>
<Row>
<Col span={24}>
<Space className="app-details-header w-full m-t-md" size={24}>
<AppLogo appName={appData?.fullyQualifiedName ?? ''} />
<Row className="page-container">
<Col className="d-flex" flex="auto">
<Button
className="p-0"
icon={<LeftOutlined />}
size="small"
type="text"
onClick={onBrowseAppsClick}>
<Typography.Text className="font-medium">
{t('label.browse-app-plural')}
</Typography.Text>
</Button>
</Col>
<Col flex="360px">
<div className="d-flex gap-2 justify-end">
<Dropdown
align={{ targetOffset: [-12, 0] }}
className="m-l-xs"
menu={{
items: manageButtonContent,
}}
open={showActions}
overlayClassName="glossary-manage-dropdown-list-container"
overlayStyle={{ width: '350px' }}
placement="bottomRight"
trigger={['click']}
onOpenChange={setShowActions}>
<Tooltip placement="right">
<Button
className="glossary-manage-dropdown-button p-x-xs"
data-testid="manage-button"
icon={
<IconDropdown className="vertical-align-inherit manage-dropdown-icon" />
}
onClick={() => setShowActions(true)}
/>
</Tooltip>
</Dropdown>
</div>
</Col>
</Row>
<Row>
<Col className="page-container" span={24}>
<Space className="app-details-header w-full m-t-md" size={24}>
<AppLogo appName={appData?.fullyQualifiedName ?? ''} />
<div className="w-full">
<Typography.Title level={4}>
{getEntityName(appData)}
</Typography.Title>
<div className="w-full">
<Typography.Title level={4}>
{getEntityName(appData)}
</Typography.Title>
<div className="d-flex items-center flex-wrap gap-6">
<Space size={8}>
<ClockCircleOutlined />
<Typography.Text className="text-xs text-grey-muted">
{`${t('label.installed')} ${getRelativeTime(
appData?.updatedAt
)}`}
</Typography.Text>
</Space>
<div className="d-flex items-center flex-wrap gap-6">
<Space size={8}>
<ClockCircleOutlined />
<Typography.Text className="text-xs text-grey-muted">
{`${t('label.installed')} ${getRelativeTime(
appData?.updatedAt
)}`}
</Typography.Text>
</Space>
<Space size={8}>
<UserOutlined />
<Typography.Text className="text-xs text-grey-muted">
{t('label.developed-by-developer', {
developer: appData?.developer,
})}
</Typography.Text>
</Space>
<Space size={8}>
<UserOutlined />
<Typography.Text className="text-xs text-grey-muted">
{t('label.developed-by-developer', {
developer: appData?.developer,
})}
</Typography.Text>
</Space>
{appData?.developerUrl && (
<div className="flex-center gap-2">
<IconExternalLink width={12} />
<Typography.Link
className="text-xs"
href={appData?.developerUrl}
target="_blank">
<Space>{t('label.visit-developer-website')}</Space>
</Typography.Link>
</div>
)}
</div>
{appData?.developerUrl && (
<div className="flex-center gap-2">
<IconExternalLink width={12} />
<Typography.Link
className="text-xs"
href={appData?.developerUrl}
target="_blank">
<Space>{t('label.visit-developer-website')}</Space>
</Typography.Link>
</div>
)}
</div>
</Space>
</Col>
<Col span={24}>
<Tabs
destroyInactiveTabPane
className="app-details-page-tabs"
data-testid="tabs"
items={tabs}
/>
</Col>
</Row>
</div>
</Space>
</Col>
<Col className="p-0" span={24}>
<Tabs
destroyInactiveTabPane
className="app-details-page-tabs entity-details-page-tabs"
data-testid="tabs"
items={tabs}
/>
</Col>
</Row>
<ConfirmationModal
bodyText={t('message.are-you-sure-action-property', {
action: actionText,
propertyName: getEntityName(appData),
})}
cancelText={t('label.cancel')}
confirmText={t('label.ok')}
header={t('message.are-you-sure')}
visible={showDeleteModel}
onCancel={() => setShowDeleteModel(false)}
onConfirm={onConfirmAction}
/>
</div>
<ConfirmationModal
bodyText={t('message.are-you-sure-action-property', {
action: actionText,
propertyName: getEntityName(appData),
})}
cancelText={t('label.cancel')}
confirmText={t('label.ok')}
header={t('message.are-you-sure')}
visible={showDeleteModel}
onCancel={() => setShowDeleteModel(false)}
onConfirm={onConfirmAction}
/>
</PageLayoutV1>
);
};

3
openmetadata-ui/src/main/resources/ui/src/components/Applications/AppDetails/app-details.less
View File

@ -35,9 +35,6 @@
}
.app-details-page-layout {
.page-layout-v1-center {
padding: 0;
}
// **** Lazy Logs ****
.lazy-log-container {

2
openmetadata-ui/src/main/resources/ui/src/components/BotListV1/BotListV1.component.tsx
View File

@ -243,7 +243,7 @@ const BotListV1 = ({
</Col>
</Row>
) : (
<Row className="page-container" gutter={[16, 16]}>
<Row className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

14
openmetadata-ui/src/main/resources/ui/src/components/Team/TeamDetails/TeamDetailsV1.tsx
View File

@ -654,7 +654,7 @@ const TeamDetailsV1 = ({
) : (
<Row
className="team-list-container"
gutter={[8, 16]}
gutter={[0, 16]}
justify="space-between">
<Col span={8}>
<Searchbar
@ -789,7 +789,7 @@ const TeamDetailsV1 = ({
),
})
) : (
<Row className="roles-and-policy p-md" gutter={[0, 10]}>
<Row className="roles-and-policy p-y-md" gutter={[0, 10]}>
{entityPermissions.EditAll && !isTeamDeleted && (
<Col className="d-flex justify-end" span={24}>
<Button
@ -860,7 +860,7 @@ const TeamDetailsV1 = ({
),
})
) : (
<Row className="roles-and-policy p-md" gutter={[0, 10]}>
<Row className="roles-and-policy p-y-md" gutter={[0, 10]}>
{entityPermissions.EditAll && !isTeamDeleted && (
<Col className="d-flex justify-end" span={24}>
<Button
@ -1035,7 +1035,7 @@ const TeamDetailsV1 = ({
const tabsChildrenRender = useCallback(
(key: TeamsPageTab) => (
<Row className="teams-tabs-content-container">
<Row className="teams-tabs-content-container p-x-lg">
<Col className="teams-scroll-component" span={previewAsset ? 18 : 24}>
{isFetchingAdvancedDetails ? <Loader /> : getTabChildren(key)}
</Col>
@ -1104,16 +1104,16 @@ const TeamDetailsV1 = ({
}
return (
<div className="teams-layout page-container">
<div className="teams-layout">
<Row className="h-full" data-testid="team-details-container">
{isOrganization && (
<Col className="p-x-md p-y-sm" span={24}>
<Col className="p-x-lg p-y-sm" span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>
)}
<Col
className="teams-profile-container"
className="teams-profile-container p-x-lg"
data-testid="team-detail-header"
span={24}>
<Collapse

2
openmetadata-ui/src/main/resources/ui/src/components/Team/TeamDetails/UserTab/UserTab.component.tsx
View File

@ -339,7 +339,7 @@ export const UserTab = ({
}
return (
<Row className="p-md" gutter={[16, 16]}>
<Row className="p-y-md" gutter={[0, 16]}>
<Col span={24}>
<Row justify="space-between">
<Col span={8}>

8
openmetadata-ui/src/main/resources/ui/src/components/Team/TeamDetails/teams.less
View File

@ -14,7 +14,7 @@
@import url('../../../styles/variables.less');
.team-list-container {
padding: 20px;
padding: 20px 0;
.ant-btn {
border-radius: 4px;
}
@ -78,7 +78,7 @@
}
.teams-layout {
margin: -16px -16px 0 -16px;
margin: -12px 0;
.ant-card-head-title {
padding-top: 0;
@ -96,6 +96,10 @@
background: none;
}
.ant-collapse-header {
padding-left: 0;
}
.ant-collapse-arrow {
top: 35px !important; // overriding from antd
}

6
openmetadata-ui/src/main/resources/ui/src/pages/Application/ApplicationPage.tsx
View File

@ -133,7 +133,7 @@ const ApplicationPage = () => {
return (
<PageLayoutV1 pageTitle={t('label.application-plural')}>
<Row className="page-container" gutter={[16, 16]}>
<Row className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>
@ -141,7 +141,7 @@ const ApplicationPage = () => {
<PageHeader data={PAGE_HEADERS.APPLICATION} />
</Col>
<Col className="d-flex justify-end" span={8}>
<Space>
<Space size="middle">
<div>
<Switch
checked={showDisabled}
@ -161,7 +161,7 @@ const ApplicationPage = () => {
</Space>
</Col>
</Row>
<Row className="m-t-lg">
<Row className="page-container m-t-lg">
{isLoading &&
[1, 2].map((key) => (
<Col key={key} span={12}>

2
openmetadata-ui/src/main/resources/ui/src/pages/Configuration/LoginConfigurationDetails/LoginConfigurationPage.tsx
View File

@ -89,7 +89,7 @@ const LoginConfigurationPage = () => {
return (
<PageLayoutV1 pageTitle={t('label.login')}>
<Row className="page-container" gutter={[16, 16]}>
<Row className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/CustomLogoConfigSettingsPage/CustomLogoConfigSettingsPage.tsx
View File

@ -96,7 +96,7 @@ const CustomLogoConfigSettingsPage = () => {
return (
<PageLayoutV1 pageTitle={t('label.custom-logo')}>
<Row align="middle" className="page-container" gutter={[16, 16]}>
<Row align="middle" className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/CustomPageSettings/CustomPageSettings.tsx
View File

@ -155,7 +155,7 @@ export const CustomPageSettings = () => {
<Row
className="customize-landing-page user-listing p-b-md page-container"
data-testid="custom-page-setting-component"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

4
openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/CustomPropertiesPageV1.tsx
View File

@ -269,9 +269,9 @@ const CustomEntityDetailV1 = () => {
return (
<PageLayoutV1 pageTitle={t('label.custom-property')}>
<Row
className="m-y-xs page-container"
className="page-container"
data-testid="custom-entity-container"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/EmailConfigSettingsPage/EmailConfigSettingsPage.component.tsx
View File

@ -157,7 +157,7 @@ function EmailConfigSettingsPage() {
return (
<PageLayoutV1 pageTitle={t('label.email')}>
<Row align="middle" className="page-container" gutter={[16, 16]}>
<Row align="middle" className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/NotificationListPage/NotificationListPage.tsx
View File

@ -211,7 +211,7 @@ const NotificationListPage = () => {
return (
<PageLayoutV1 pageTitle={t('label.alert-plural')}>
<Row className="page-container" gutter={[16, 16]}>
<Row className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertDetailsPage/ObservabilityAlertDetailsPage.tsx
View File

@ -312,7 +312,7 @@ function ObservabilityAlertDetailsPage({
data-testid="alert-details-container">
<Row
className="add-notification-container p-x-lg p-t-md"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumb} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.tsx
View File

@ -196,7 +196,7 @@ const ObservabilityAlertsPage = () => {
return (
<PageLayoutV1 pageTitle={t('label.alert-plural')}>
<Row className="p-x-lg p-t-md" gutter={[16, 16]}>
<Row className="p-x-lg p-t-md" gutter={[0, 16]}>
<Col span={24}>
<div className="d-flex justify-between">
<PageHeader data={pageHeaderData} />

2
openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaDetailsPage/PersonaDetailsPage.tsx
View File

@ -173,7 +173,7 @@ export const PersonaDetailsPage = () => {
return (
<PageLayoutV1 pageTitle={personaDetails.name}>
<Row className="m-b-md page-container" gutter={[16, 16]}>
<Row className="m-b-md page-container" gutter={[0, 16]}>
<Col span={24}>
<div className="d-flex justify-between items-start">
<PageHeader

2
openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaListPage/PersonaPage.tsx
View File

@ -132,7 +132,7 @@ export const PersonaPage = () => {
<Row
className="user-listing page-container p-b-md"
data-testid="user-list-v1-component"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesListPage/PoliciesListPage.tsx
View File

@ -265,7 +265,7 @@ const PoliciesListPage = () => {
<Row
className="policies-list-container page-container"
data-testid="policies-list-container"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesListPage/RolesListPage.tsx
View File

@ -263,7 +263,7 @@ const RolesListPage = () => {
<Row
className="roles-list-container page-container"
data-testid="roles-list-container"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/ServicesPage/ServicesPage.tsx
View File

@ -71,7 +71,7 @@ const ServicesPage = () => {
return viewAllPermission ? (
<PageLayoutV1 pageTitle={serviceName}>
<Row className="page-container" gutter={[16, 16]}>
<Row className="page-container" gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/TestSuiteDetailsPage/TestSuiteDetailsPage.component.tsx
View File

@ -332,7 +332,7 @@ const TestSuiteDetailsPage = () => {
pageTitle={t('label.entity-detail-plural', {
entity: getEntityName(testSuite),
})}>
<Row className="page-container" gutter={[16, 32]}>
<Row className="page-container" gutter={[0, 32]}>
<Col span={24}>
<Space align="center" className="justify-between w-full">
<TitleBreadcrumb

2
openmetadata-ui/src/main/resources/ui/src/pages/UserListPage/UserListPageV1.tsx
View File

@ -395,7 +395,7 @@ const UserListPageV1 = () => {
<Row
className="user-listing p-b-md page-container"
data-testid="user-list-v1-component"
gutter={[16, 16]}>
gutter={[0, 16]}>
<Col span={24}>
<TitleBreadcrumb titleLinks={breadcrumbs} />
</Col>

2
openmetadata-ui/src/main/resources/ui/src/styles/app.less
View File

@ -81,7 +81,7 @@ p {
}
.page-container {
padding: 4px 16px 16px;
padding: 0 24px;
}
a,