Various minor style updates
This commit is contained in:
parent
56a46b1ea5
commit
0064d6f111
18 changed files with 32 additions and 22 deletions
|
|
@ -26,7 +26,7 @@ function Recordings(props: Props) {
|
|||
};
|
||||
|
||||
return (
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto' }} className='bg-white rounded py-4 border h-screen overflow-y-scroll'>
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto' }} className='bg-white rounded-lg py-4 border h-screen overflow-y-scroll'>
|
||||
<div className='flex items-center mb-4 justify-between px-6'>
|
||||
<div className='flex items-baseline mr-3'>
|
||||
<PageTitle title='Training Videos' />
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ function AuditView() {
|
|||
}
|
||||
|
||||
return useObserver(() => (
|
||||
<div className="bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border">
|
||||
<div className="flex items-center mb-4 px-5 pt-5">
|
||||
<PageTitle title={
|
||||
<div className="flex items-center">
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ function CustomFields(props) {
|
|||
|
||||
const { fields, loading } = props;
|
||||
return (
|
||||
<div className="p-5 bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border p-5 ">
|
||||
<div className={cn(styles.tabHeader)}>
|
||||
<h3 className={cn(styles.tabTitle, 'text-2xl')}>{'Metadata'}</h3>
|
||||
<div style={{ marginRight: '15px' }}>
|
||||
|
|
|
|||
|
|
@ -108,7 +108,7 @@ function Integrations(props: Props) {
|
|||
|
||||
return (
|
||||
<>
|
||||
<div className='mb-4 p-5 bg-white rounded-lg border'>
|
||||
<div className='bg-white rounded-lg border shadow-sm p-5 mb-4'>
|
||||
{!hideHeader && <PageTitle title={<div>Integrations</div>} />}
|
||||
|
||||
<IntegrationFilters onChange={onChange} activeItem={activeFilter} filters={filters} />
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ export default class ProfileSettings extends React.PureComponent {
|
|||
render() {
|
||||
const { account, isEnterprise } = this.props;
|
||||
return (
|
||||
<div className="bg-white rounded-lg p-5">
|
||||
<div className="bg-white rounded-lg border shadow-sm p-5">
|
||||
<PageTitle title={<div>Account</div>} />
|
||||
<div className="flex items-center">
|
||||
<div className={styles.left}>
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ function Roles(props: Props) {
|
|||
return (
|
||||
<React.Fragment>
|
||||
<Loader loading={loading}>
|
||||
<div className="bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border">
|
||||
<div className={cn(stl.tabHeader, 'flex items-center')}>
|
||||
<div className="flex items-center mr-auto px-5 pt-5">
|
||||
<h3 className={cn(stl.tabTitle, 'text-2xl')}>Roles and Access</h3>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ const connector = connect(mapStateToProps);
|
|||
|
||||
function SessionsListingSettings(props: Props) {
|
||||
return (
|
||||
<div className='bg-white rounded-lg p-5'>
|
||||
<div className='bg-white rounded-lg border shadow-sm p-5'>
|
||||
<PageTitle title={<div>Sessions Listing</div>} />
|
||||
|
||||
<div className='flex flex-col mt-4'>
|
||||
|
|
|
|||
|
|
@ -111,7 +111,7 @@ const Sites = ({ loading, sites, user, init }: PropsFromRedux) => {
|
|||
|
||||
return (
|
||||
<Loader loading={loading}>
|
||||
<div className="bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border">
|
||||
<div className={cn(stl.tabHeader, 'px-5 pt-5')}>
|
||||
<PageTitle
|
||||
title={<div className="mr-4">Projects</div>}
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ function UsersView(props: Props) {
|
|||
}, []);
|
||||
|
||||
return (
|
||||
<div className="bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border">
|
||||
<div className="flex items-center justify-between px-5 pt-5">
|
||||
<PageTitle
|
||||
title={
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ function Webhooks() {
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="p-5 bg-white rounded-lg">
|
||||
<div className="bg-white rounded-lg shadow-sm border p-5">
|
||||
<div className={cn(styles.tabHeader)}>
|
||||
<h3 className={cn(styles.tabTitle, 'text-2xl')}>{'Webhooks'}</h3>
|
||||
<Button className="ml-auto" variant="primary" onClick={() => init()}>Add Webhook</Button>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ function AlertsView({ siteId }: IAlertsView) {
|
|||
return unmount;
|
||||
}, [history]);
|
||||
return (
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto'}} className="bg-white rounded py-4 border">
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto'}} className="bg-white rounded-lg shadow-sm py-4 border">
|
||||
<div className="flex items-center mb-4 justify-between px-6">
|
||||
<div className="flex items-baseline mr-3">
|
||||
<PageTitle title="Alerts" />
|
||||
|
|
|
|||
|
|
@ -84,10 +84,10 @@ function DashboardList({siteId}: { siteId: string }) {
|
|||
</Typography.Text>
|
||||
: (
|
||||
<div>
|
||||
<Typography.Text className="mb-2 text-lg">
|
||||
You haven't created any dashboards yet
|
||||
<Typography.Text className="mb-2 text-xl font-medium">
|
||||
Create your first dashboard.
|
||||
</Typography.Text>
|
||||
<div className="text-sm text-gray-500 mt-2">
|
||||
{/* <div className="text-base text-gray-500">
|
||||
A Dashboard is a collection of{' '}
|
||||
<Tooltip
|
||||
title={
|
||||
|
|
@ -98,9 +98,15 @@ function DashboardList({siteId}: { siteId: string }) {
|
|||
}
|
||||
className="text-center"
|
||||
>
|
||||
<span className="underline decoration-dotted">Cards</span>
|
||||
<span className="underline decoration-dotted">cards</span>
|
||||
</Tooltip>{' '}
|
||||
that can be shared across teams.
|
||||
</div> */}
|
||||
|
||||
<div>
|
||||
<div className="mb-2 text-lg text-gray-500 mt-2 leading-normal">
|
||||
Organize your product and technical insights as cards in dashboards to see the bigger picture, <br/>take action and improve user experience.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="my-4">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import Header from './Header';
|
|||
|
||||
function DashboardsView({history, siteId}: { history: any; siteId: string }) {
|
||||
return (
|
||||
<div style={{maxWidth: '1360px', margin: 'auto'}} className="bg-white rounded py-4 border">
|
||||
<div style={{maxWidth: '1360px', margin: 'auto'}} className="bg-white rounded-lg py-4 border shadow-sm">
|
||||
<Header />
|
||||
<DashboardList/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ interface Props {
|
|||
}
|
||||
function MetricsView({ siteId }: Props) {
|
||||
return useObserver(() => (
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto' }} className="bg-white rounded pt-4 border">
|
||||
<div style={{ maxWidth: '1360px', margin: 'auto' }} className="bg-white rounded-lg shadow-sm pt-4 border">
|
||||
<MetricViewHeader siteId={siteId} />
|
||||
<MetricsList siteId={siteId} />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -104,11 +104,11 @@ function TestsTable() {
|
|||
/>
|
||||
</Modal>
|
||||
|
||||
<div className={'rounded bg-white border'}>
|
||||
<div className={'bg-white rounded-lg shadow-sm border'}>
|
||||
<div className={'flex items-center p-4 gap-2'}>
|
||||
<Typography.Title level={4} style={{ marginBottom: 0 }}>
|
||||
<h1 style={{ marginBottom: 0 }} className='text-2xl capitalize-first'>
|
||||
Usability Tests
|
||||
</Typography.Title>
|
||||
</h1>
|
||||
<div className={'ml-auto'} />
|
||||
<Button type="primary" onClick={openModal}>
|
||||
Create Usability Test
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@ function LiveSessionList(props: Props) {
|
|||
|
||||
return (
|
||||
<div>
|
||||
<div className="bg-white p-3 rounded border">
|
||||
<div className="bg-white p-3 rounded-lg border shadow-sm">
|
||||
<div className="flex mb-6 justify-between items-center">
|
||||
<div className="flex items-center">
|
||||
<h3 className="text-2xl capitalize mr-2">
|
||||
|
|
|
|||
|
|
@ -382,4 +382,8 @@ p {
|
|||
border-radius: 3px;
|
||||
resize: none;
|
||||
background-color: #ffff;
|
||||
}
|
||||
|
||||
.ant-menu-light .ant-menu-item-selected, :where(.css-dev-only-do-not-override).ant-menu-light>.ant-menu .ant-menu-item-selected{
|
||||
background-color: #E6E9FA;
|
||||
}
|
||||
|
|
@ -14,7 +14,7 @@ input.no-focus:focus {
|
|||
}
|
||||
|
||||
.widget-wrapper {
|
||||
@apply rounded border bg-white;
|
||||
@apply rounded-lg shadow-sm border bg-white;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue