mirror of
https://github.com/apache/superset.git
synced 2024-09-12 00:29:39 -04:00
fix: homepage card layout (#14725)
* initial commit * ensure card lsize
This commit is contained in:
parent
173c486d4a
commit
29828f8552
@ -301,15 +301,13 @@ export const mq = breakpoints.map(bp => `@media (max-width: ${bp}px)`);
|
|||||||
export const CardContainer = styled.div`
|
export const CardContainer = styled.div`
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fit, minmax(31%, 31%));
|
grid-template-columns: repeat(auto-fit, minmax(31%, 31%));
|
||||||
${[mq[3]]} {
|
${mq[3]} {
|
||||||
grid-template-columns: repeat(auto-fit, minmax(31%, 31%));
|
grid-template-columns: repeat(auto-fit, minmax(31%, 31%));
|
||||||
}
|
}
|
||||||
|
${mq[2]} {
|
||||||
${[mq[2]]} {
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(48%, 48%));
|
grid-template-columns: repeat(auto-fit, minmax(48%, 48%));
|
||||||
}
|
}
|
||||||
|
${mq[1]} {
|
||||||
${[mq[1]]} {
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(50%, 80%));
|
grid-template-columns: repeat(auto-fit, minmax(50%, 80%));
|
||||||
}
|
}
|
||||||
grid-gap: ${({ theme }) => theme.gridUnit * 8}px;
|
grid-gap: ${({ theme }) => theme.gridUnit * 8}px;
|
||||||
|
@ -74,15 +74,7 @@ const ActivityContainer = styled.div`
|
|||||||
margin-top: ${({ theme }) => theme.gridUnit * -4}px;
|
margin-top: ${({ theme }) => theme.gridUnit * -4}px;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fit, minmax(31%, max-content));
|
grid-template-columns: repeat(auto-fit, minmax(31%, max-content));
|
||||||
${[mq[3]]} {
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(31%, max-content));
|
|
||||||
}
|
|
||||||
${[mq[2]]} {
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(42%, max-content));
|
|
||||||
}
|
|
||||||
${[mq[1]]} {
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(63%, max-content));
|
|
||||||
}
|
|
||||||
grid-gap: ${({ theme }) => theme.gridUnit * 8}px;
|
grid-gap: ${({ theme }) => theme.gridUnit * 8}px;
|
||||||
justify-content: left;
|
justify-content: left;
|
||||||
padding: ${({ theme }) => theme.gridUnit * 6}px;
|
padding: ${({ theme }) => theme.gridUnit * 6}px;
|
||||||
@ -94,6 +86,15 @@ const ActivityContainer = styled.div`
|
|||||||
.ant-card-meta-title {
|
.ant-card-meta-title {
|
||||||
font-weight: ${({ theme }) => theme.typography.weights.bold};
|
font-weight: ${({ theme }) => theme.typography.weights.bold};
|
||||||
}
|
}
|
||||||
|
${mq[3]} {
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(31%, max-content));
|
||||||
|
}
|
||||||
|
${mq[2]} {
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(42%, max-content));
|
||||||
|
}
|
||||||
|
${mq[1]} {
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(80%, max-content));
|
||||||
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const UNTITLED = t('[Untitled]');
|
const UNTITLED = t('[Untitled]');
|
||||||
|
Loading…
Reference in New Issue
Block a user