Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added Hover effects in buttons across all pages #62

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Added Hover effects in buttons across all pages #62

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/components/Footer/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,19 +21,19 @@ export function Footer() {
</li>
<li>
<a href="https://www.instagram.com/lotengdev/" target="_blank" rel="noopener noreferrer">
<img
<img className="transform hover:scale-110 transition-transform duration-200"
src="https://upload.wikimedia.org/wikipedia/commons/a/a5/Instagram_icon.png"
alt="Instagram Logo"
style={{ display: 'inline-block', gap: '15px', width: '40px', height: '40px' }}
style={{ display: 'inline-block', gap: '18px', width: '30px', height: '28px', }}
/>
</a>
</li>
<li>
<a href="https://www.youtube.com/@lotengdev4516" target="_blank" rel="noopener noreferrer">
<img
<img className="transform hover:scale-110 transition-transform duration-200"
src="https://upload.wikimedia.org/wikipedia/commons/4/42/YouTube_icon_%282013-2017%29.png"
alt="YouTube Logo"
style={{ display: 'inline-block', gap: '15px', width: '40px', height: '40px', paddingLeft: '4px' }}
style={{ display: 'inline-block', gap: '18px', width: '40px', height: '28px', paddingLeft: '4px',marginLeft:'2px' }}
/>
</a>
</li>
Expand Down
10 changes: 5 additions & 5 deletions src/components/Navbar/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,10 @@ import LogtengDevLogo from '@/assets/lotengdev-logo.svg';
function CTAButtons() {
return (
<div className="hidden lg:flex justify-center">
<a href="https://t.me/lotengdev" target="_blank" rel="noopener noreferrer" className="flex items-center bg-blue-600 px-4 py-3 mr-4 rounded text-white">
<img className="inline mr-3" src={TelegramIcon} alt="Telegram Icon" />Join Group
<a href="https://t.me/lotengdev" target="_blank" rel="noopener noreferrer" className="flex items-center bg-blue-600 px-4 py-3 mr-4 rounded text-white transform hover:scale-105 transition-transform duration-200 ">
<img className="inline mr-3" src={TelegramIcon} alt="Telegram Icon " />Join Group
</a>
<a href="https://github.com/lotengdev/lotengdev-web/" target="_blank" rel="noopener noreferrer" className="flex items-center bg-neutral-100 border border-solid border-grey px-4 py-2 rounded">
<a href="https://github.com/lotengdev/lotengdev-web/" target="_blank" rel="noopener noreferrer" className="flex items-center bg-neutral-100 border border-solid border-grey px-4 py-2 rounded transform hover:scale-105 transition-transform duration-200 ">
<img className="inline mr-3" src={GithubIcon} alt="GitHub Icon" />Contribute
</a>
</div>
Expand Down Expand Up @@ -82,8 +82,8 @@ export default function Navbar() {
</ul>

<div className="px-6 flex gap-4 flex-col justify-center mt-20">
<a href="https://t.me/lotengdev" target="_blank" rel="noopener noreferrer" className="inline-flex items-center bg-blue-600 px-4 py-3 rounded text-xs text-white">
<img className="inline mr-3" width={21} onClick={toggleNavbar} src={TelegramIcon} alt="Telegram Icon" />Join Group
<a href="https://t.me/lotengdev" target="_blank" rel="noopener noreferrer" className="inline-flex items-center bg-blue-600 px-4 py-3 rounded text-xs text-white ">
<img className="inline mr-3" width={21} onClick={toggleNavbar} src={TelegramIcon} alt="Telegram Icon " />Join Group
</a>
<a href="https://github.com/lotengdev/lotengdev-web/" target="_blank" rel="noopener noreferrer" className="inline-flex items-center text-xs bg-neutral-100 border border-solid border-grey px-4 py-2 rounded">
<img className="inline mr-3" width={21} onClick={toggleNavbar} src={GithubIcon} alt="GitHub Icon" />Contribute
Expand Down
6 changes: 3 additions & 3 deletions src/pages/contact/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,10 +46,10 @@ export function ContactPage() {
<span>Contact Loteng Dev</span>
<div className="flex ml-3">
<a href="https://mail.google.com/mail/?view=cm&fs=1&[email protected]" target="_blank" rel="noopener noreferrer" className="ml-2">
<img src={emailIcon} alt="Email Icon" className="w-6 h-6" />
<img src={emailIcon} alt="Email Icon" className="w-6 h-6 transform hover:scale-110 transition-transform duration-200 " />
</a>
<a href="https://t.me/lotengdev" target="_blank" rel="noopener noreferrer" className="ml-2">
<img src={telegramIcon} alt="Telegram Icon" className="w-6 h-6" />
<img src={telegramIcon} alt="Telegram Icon" className="w-6 h-6 transform hover:scale-110 transition-transform duration-200" />
</a>
</div>
</div>
Expand Down Expand Up @@ -77,7 +77,7 @@ export function ContactPage() {
></textarea>
<button
type="submit"
className="bg-[color:#41B883] text-white font-bold py-2 px-6 rounded-lg text-lg"
className="bg-[color:#41B883] text-white font-bold py-2 px-6 rbg-blue-500 rounded transition-all duration-300 ease-in-out transform hover:bg-green-600 hover:scale-105 "
>
Send Email
</button>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/event/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -267,7 +267,7 @@ export function EventPage() {
Next meetup kita mau bahas <br /> apa nih?
</Motion.div>
<a href="https://github.com/Loteng-Dev/MeetupTopics/issues "
className="text-white bg-[#007BFF] font-normal text-sm px-5 py-2.5 text-center inline-flex items-center mr-2 mb-2 mt-[32px] ">
className="text-white font-normal text-sm px-5 py-2.5 text-center inline-flex items-center mr-2 mb-2 mt-[32px] rounded-md bg-blue-500 transition-all duration-300 ease-in-out transform hover:bg-blue-700 hover:shadow-lg">
+ Kirim ide topik
</a>
</section>
Expand Down
6 changes: 3 additions & 3 deletions src/pages/home/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,10 @@ export function HomePage() {
Programming, dan masih banyak lagi. </span>
</div>
<div className="flex">
<a href="https://t.me/lotengdev" target='_blank' className="flex items-center bg-blue-600 px-4 py-3 mr-4 rounded text-white text-[12px]">
<img className="inline mr-3 lg:w-auto lg:h-auto h-[12px] w-[12px]" src={TelegramIcon} />Join Group
<a href="https://t.me/lotengdev" target='_blank' className="flex items-center bg-blue-600 px-4 py-3 mr-4 rounded text-white text-[12px] transform hover:scale-105 transition-transform duration-200 ">
<img className="inline mr-3 lg:w-auto lg:h-auto h-[12px] w-[12px] " src={TelegramIcon} />Join Group
</a>
<a href="https://github.com/lotengdev/lotengdev-web/" target='_blank' className="flex items-center bg-neutral-100 border border-solid border-grey px-4 py-2 rounded">
<a href="https://github.com/lotengdev/lotengdev-web/" target='_blank' className="flex items-center bg-neutral-100 border border-solid border-grey px-4 py-2 rounded transform hover:scale-105 transition-transform duration-200 ">
<img className="inline mr-3 lg:w-auto lg:h-auto h-[12px] w-[12px]" src={GithubIcon} />Contribute
</a>
</div>
Expand Down
8 changes: 4 additions & 4 deletions src/pages/speaker/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,13 +69,13 @@ export function SpeakerPage() {
</div>
<div className="w-full flex md:justify-start justify-center md:items-start items-center">
<a href="#">
<img className="w-[23px] h-[23px] mr-2" src={LinkedinIcon} alt="icon_linkedin"/>
<img className="w-[23px] h-[23px] mr-2 transition-all duration-300 ease-in-out transform hover:scale-110" src={LinkedinIcon} alt="icon_linkedin"/>
</a>
<a href="#">
<img className="w-[23px] h-[23px] mr-2" src={GithubIcon} alt="icon_github"/>
<img className="w-[23px] h-[23px] mr-2 transition-all duration-300 ease-in-out transform hover:scale-110" src={GithubIcon} alt="icon_github"/>
</a>
<a href="#">
<img className="w-[23px] h-[23px]" src={WebsiteIcon} alt="icon_website"/>
<img className="w-[23px] h-[23px] transition-all duration-300 ease-in-out transform hover:scale-110" src={WebsiteIcon} alt="icon_website"/>
</a>
</div>
</div>
Expand All @@ -98,7 +98,7 @@ export function SpeakerPage() {
Tertarik menjadi pembicara di <br/> acara Lotengdev ?
</Motion.div>
<a href="https://github.com/Loteng-Dev/MeetupTopics/issues"
className="text-white bg-[#007BFF] font-normal text-sm px-5 py-2.5 text-center inline-flex items-center mr-2 mb-2 mt-[32px]">
className="text-white font-normal text-sm px-5 py-2.5 text-center inline-flex items-center mr-2 mb-2 mt-[32px] rounded-md bg-blue-500 transition-all duration-300 ease-in-out transform hover:bg-blue-700 hover:shadow-lg">
+ Kirim ide topik
</a>
</section>
Expand Down