docs: move anchor links to the right (#7350)

VKCOM · Aug 9, 2024 · 35bbf1c · 35bbf1c
1 parent 46d6950
commit 35bbf1c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/styleguide/Components/SectionSubheading/SectionSubheading.css b/styleguide/Components/SectionSubheading/SectionSubheading.css
@@ -2,13 +2,12 @@
   margin-top: 36px;
   margin-bottom: 18px;
   position: relative;
+  display: flex;
+  align-items: center;
 }
 
 .SectionSubheading__link {
-  position: absolute;
-  right: 100%;
-  padding-right: 6px;
-  top: 3px;
+  padding-left: 6px;
   color: var(--vkui--color_icon_secondary);
   opacity: 0;
 }

diff --git a/styleguide/Components/SectionSubheading/SectionSubheading.js b/styleguide/Components/SectionSubheading/SectionSubheading.js
@@ -9,6 +9,7 @@ export const SectionSubheading = ({ children, className, level = 2, href, ...res
 
   return (
     <Heading {...restProps} level={level} className={classNames('SectionSubheading', className)}>
+      <span className="SectionSubheading__text">{children}</span>
       {href && id && (
         <Fragment>
           <a className="SectionSubheading__link" href={href}>
@@ -17,7 +18,6 @@ export const SectionSubheading = ({ children, className, level = 2, href, ...res
           <a className="SectionSubheading__anchor" id={id} />
         </Fragment>
       )}
-      <span className="SectionSubheading__text">{children}</span>
     </Heading>
   );
 };