diff --git a/src/App/App.css b/src/App/App.css index bd134adb090439a6dfa74f122e5a91692979c80b..e93047a84d898ac361ba9d599f5c596de36e615a 100644 --- a/src/App/App.css +++ b/src/App/App.css @@ -94,7 +94,7 @@ p { text-align: justify; } a { - color: var(--lightblue) !important; + color: var(--accent-gradient-one-of-three) !important; text-decoration: none !important; } @@ -130,13 +130,18 @@ code{ text-shadow: 5px 5px 15px black; transition: all 0.1s linear; } +.sideitem{ + min-height: 40px; + display: inline-block; +} + .sidebar>div{ overflow: hidden; text-align: center; cursor: pointer; } .sidebar>div>a>span{ -padding: 1rem; +padding: 0.5rem; color: var(--text-primary); } .active-scroll-spy{ @@ -895,8 +900,9 @@ svg{ .circle { display: flex; width: 10vw; + color: white; height: 10vw; - background-color: var(--lightblue) !important; + background-color: var(--text-primary) !important; box-shadow: 3px 3px 10px black !important; border-radius: 50%; margin: 1vw; diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index 1a0f86f5c6a32bb2ca35b002c07e90d57f4a9fd5..9b490710efe1415dcb0f8e38fa42829abc0d8f53 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -8,7 +8,7 @@ function SideItem({hesh, num}:{hesh: string; num: number}){ return( <div> <a href={link}> - <span id={subdi}> + <span id={subdi} className='sideitem'> {hesh} </span> </a> @@ -99,11 +99,12 @@ function Sidebar(){ let TopDistance = 100; if (el != null && subtitle != null){ if (el.getBoundingClientRect().top < TopDistance + 1 && el.getBoundingClientRect().bottom > TopDistance){ - subtitle.style.color = "#FFF6F2"; - subtitle.style.backgroundColor = "#850F78"; + subtitle.style.color = "white"; + subtitle.style.backgroundColor = "rgb(133, 15, 120, 0.8)"; subtitle.style.borderRadius = "15px"; subtitle.style.borderWidth = "15px"; subtitle.style.borderColor = "#850F78"; + /* console.log("subtitle: ",subtitle) console.log("style: ", subtitle.style) console.log("color: ",subtitle.style.color)