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

update doc stylings

Browse Source
This commit is contained in:
shrushti2000 2025-09-24 23:37:04 +05:30
parent 9688858b13
commit 1a1c1ca3f8
1 changed files with 43 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
openmetadata-ui/src/main/resources/ui/src/components/SettingsSso/SSODocPanel/sso-doc-panel.less
View File

@ -18,7 +18,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: @padding-xs; gap: @padding-xs;
margin-bottom: @size-sm - 2px; padding: @size-lg;
.sso-provider-icon { .sso-provider-icon {
display: flex; display: flex;
@ -31,6 +31,7 @@
font-weight: 600; font-weight: 600;
color: @grey-900; color: @grey-900;
line-height: @size-lg; line-height: @size-lg;
font-size: 18px;
} }
} }
@ -41,7 +42,7 @@
h4, h4,
h5, h5,
h6 { h6 {
font-size: @font-size-base; font-size: 18px;
font-weight: 600; font-weight: 600;
line-height: @size-mlg; line-height: @size-mlg;
padding-bottom: @size-xs; padding-bottom: @size-xs;
@ -53,17 +54,14 @@
background: @primary-50; background: @primary-50;
border-left: @size-xxs solid @primary-6; border-left: @size-xxs solid @primary-6;
box-shadow: @box-shadow-highlight-light;
animation: highlightPulse 0.6s ease-in-out;
margin: 0; margin: 0;
&[data-highlight-position='first'] { &[data-highlight-position='first'] {
padding-left: @size-xs;
padding-top: @size-xs; padding-top: @size-xs;
padding-bottom: @size-xs;
border-bottom: none; border-bottom: none;
h3 { h3 {
padding: 0; padding: 0 @size-lg;
} }
} }
@ -88,10 +86,21 @@
h3 { h3 {
color: @grey-800; color: @grey-800;
font-size: @font-size-base; font-size: 18px;
padding: 0 @size-lg;
font-weight: 600; font-weight: 600;
border-bottom: none; border-bottom: none;
padding-bottom: @padding-xs; padding-bottom: @padding-xs;
margin: 24px 0px 10px 0px;
// Add margin after the entire section (after h3 and its siblings)
~ h3 {
margin-top: @size-lg;
}
~ ul {
padding: 0 @size-lg 0 40px;
}
} }
h4 { h4 {
@ -100,19 +109,23 @@
font-weight: 600; font-weight: 600;
} }
h6 {
font-size: 18px;
}
ul { ul {
margin-bottom: @padding-md; padding: 0 @size-lg @size-md @size-lg + @size-mlg;
margin-bottom: @size-lg;
&[data-highlighted='true'] { &[data-highlighted='true'] {
background: @primary-50; background: @primary-50;
border-left: @size-xxs solid @primary-6; border-left: @size-xxs solid @primary-6;
margin: 0; margin: 0;
animation: highlightPulse 0.6s ease-in-out;
&[data-highlight-position='first'] { &[data-highlight-position='first'] {
border-bottom: none; border-bottom: none;
padding-left: @size-xs; padding-left: @size-lg + @size-mlg;
} }
&[data-highlight-position='middle'] { &[data-highlight-position='middle'] {
@ -129,12 +142,18 @@
} }
li { li {
margin-bottom: @padding-xs; margin-bottom: @padding-xss;
line-height: @size-sm + 2px; line-height: @size-sm + 2px;
font-size: @font-size-base; font-size: @font-size-base;
font-weight: 400; font-weight: 400;
color: @grey-800; color: @grey-800;
// Remove padding for paragraphs inside list items
p {
padding: 0 !important;
margin: 0 0 @size-lg 0;
}
strong { strong {
color: @grey-800; color: @grey-800;
font-weight: 600; font-weight: 600;
@ -143,35 +162,44 @@
} }
p { p {
margin-bottom: @padding-md; padding: 0 @size-lg;
margin-top: 0; margin-bottom: @size-lg;
line-height: @size-mlg; line-height: @size-mlg;
font-size: @font-size-base; font-size: @font-size-base;
font-weight: 400; font-weight: 400;
color: @grey-800; color: @grey-800;
// Remove padding for paragraphs that can be highlighted
&[data-highlighted] {
padding: 0 !important;
}
&[data-highlighted='true'] { &[data-highlighted='true'] {
background: @primary-50; background: @primary-50;
border: 1px solid @primary-6; border: 1px solid @primary-6;
border-left: @size-xxs solid @primary-6; border-left: @size-xxs solid @primary-6;
padding: @padding-mlg @padding-md; padding: @padding-mlg @padding-md;
margin: 0; margin: 0;
animation: highlightPulse 0.6s ease-in-out;
&[data-highlight-position='first'] { &[data-highlight-position='first'] {
border-radius: @border-rad-sm @border-rad-sm 0 0; border-radius: @border-rad-sm @border-rad-sm 0 0;
border-bottom: none; border-bottom: none;
margin: 0px;
padding: 0px !important;
} }
&[data-highlight-position='middle'] { &[data-highlight-position='middle'] {
border-radius: 0; border-radius: 0;
border-top: none; border-top: none;
border-bottom: none; border-bottom: none;
padding: 0px;
} }
&[data-highlight-position='last'] { &[data-highlight-position='last'] {
border-radius: 0 0 @border-rad-sm @border-rad-sm; border-radius: 0 0 @border-rad-sm @border-rad-sm;
border-top: none; border-top: none;
padding: 0px !important;
margin: 0px !important;
} }
} }
} }
@ -227,21 +255,3 @@
} }
} }
} }
@keyframes highlightPulse {
0% {
transform: translateX(-@size-xxs / 2);
box-shadow: 0 0 0 rgba(21, 112, 239, 0.3);
border-left-width: @size-xxs;
}
50% {
transform: translateX(0);
box-shadow: @box-shadow-highlight-medium;
border-left-width: @border-rad-xs - @size-xxs;
}
100% {
transform: translateX(0);
box-shadow: @box-shadow-highlight-light;
border-left-width: @size-xxs;
}
}