From fbd3989da5582d177564115f14760a6881667a6e Mon Sep 17 00:00:00 2001
From: Victoria Zhizhonkova <indarklight@gmail.com>
Date: Fri, 9 Aug 2024 15:49:47 +0700
Subject: [PATCH] docs: move anchor links to the right (#7350)

---
 .../Components/SectionSubheading/SectionSubheading.css     | 7 +++----
 .../Components/SectionSubheading/SectionSubheading.js      | 2 +-
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/styleguide/Components/SectionSubheading/SectionSubheading.css b/styleguide/Components/SectionSubheading/SectionSubheading.css
index e4e7292ea7..e20d73e595 100644
--- 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
index db374a49cd..2ad58954ba 100644
--- 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>
   );
 };