Skip to content

Commit 6a47c9d

Browse files
Merge branch 'main' into main
2 parents e357a96 + 9289e57 commit 6a47c9d

File tree

2 files changed

+118
-8
lines changed

2 files changed

+118
-8
lines changed

buttons/buttons.css

Lines changed: 91 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2310,6 +2310,91 @@ a:focus-visible {
23102310

23112311
/*radzhiv's btn end*/
23122312

2313+
2314+
/* avishaan24's btn start */
2315+
2316+
.avishaan24-btn-1{
2317+
color: white;
2318+
padding: 15px 70px;
2319+
border: 2px solid white;
2320+
border-radius: 15px;
2321+
font-size: medium;
2322+
margin: auto;
2323+
background: transparent;
2324+
}
2325+
.avishaan24-btn-1:hover{
2326+
cursor: pointer;
2327+
box-shadow: 0 0 1px 5px rgba(138, 59, 88, 0.4), 0 0 1px 10px rgba(138, 59, 88, 0.1), 0 0 1px 15px rgba(138, 59, 88, 0.1);
2328+
transform: rotate(360deg);
2329+
}
2330+
2331+
.avishaan24-btn-1::after {
2332+
content: '';
2333+
width: 30px; height: 30px;
2334+
border-radius: 100%;
2335+
border: 5px solid rgb(238, 236, 238);
2336+
position: absolute;
2337+
z-index: -1;
2338+
top: 50%;
2339+
left: 50%;
2340+
transform: translate(-50%, -50%);
2341+
animation: avishaan24-btn-1-oval 2s infinite;
2342+
}
2343+
@keyframes avishaan24-btn-1-oval {
2344+
0% {
2345+
width: 30px;
2346+
height: 30px;
2347+
opacity: 1;
2348+
}
2349+
100% {
2350+
width: 250px;
2351+
height: 150px;
2352+
opacity: 0;
2353+
}
2354+
}
2355+
2356+
/* avishaan24's btn end */
2357+
2358+
/* Aditya's button starts */
2359+
2360+
.aditya-btn-1 {
2361+
width: 150px;
2362+
height: 50px;
2363+
color: white;
2364+
position: relative;
2365+
display: inline-block;
2366+
background: rgb(0, 68, 255);
2367+
border: none;
2368+
border-radius: 4px;
2369+
padding: 10px 25px;
2370+
font-family: Verdana, Geneva, Tahoma, sans-serif;
2371+
font-weight: 20px;
2372+
cursor: pointer;
2373+
transition: all 0.2s ease;
2374+
z-index: 1;
2375+
}
2376+
.aditya-btn-1:after {
2377+
position: absolute;
2378+
content: "";
2379+
width: 0;
2380+
height: 0;
2381+
top: 0;
2382+
left: 0;
2383+
border-radius: 5px;
2384+
background-image: linear-gradient(275deg, #190c8e 0%, #b53232 74%);
2385+
transition: all 0.2s ease-in-out;
2386+
z-index: -1;
2387+
}
2388+
.aditya-btn-1:hover:after {
2389+
top: auto;
2390+
bottom: 0;
2391+
width: 100%;
2392+
height: 100%;
2393+
border-radius: 40%;
2394+
border: none;
2395+
}
2396+
/* Aditya's button end */
2397+
23132398
/* Gaurav Sharma's button 1 starts*/
23142399

23152400
.gauravsharmatheofficial-btn-1-svg {
@@ -2350,7 +2435,7 @@ a:focus-visible {
23502435

23512436
/* Gaurav Sharma's button 1 end*/
23522437

2353-
.arnav-btn{
2438+
.arnav-btn-1{
23542439
opacity: 1;
23552440
outline: 0;
23562441
color: #fff;
@@ -2364,15 +2449,15 @@ a:focus-visible {
23642449
font-weight: 700;
23652450
text-transform: uppercase;
23662451
}
2367-
.arnav-btn:hover:after {
2452+
.arnav-btn-1:hover:after {
23682453
opacity: 1;
23692454
transform: translateY(0) rotateX(0);
23702455
}
2371-
.arnav-btn:hover:before {
2456+
.arnav-btn-1:hover:before {
23722457
opacity: 0;
23732458
transform: translateY(50%) rotateX(90deg);
23742459
}
2375-
.arnav-btn:after {
2460+
.arnav-btn-1:after {
23762461
top: 0;
23772462
left: 0;
23782463
opacity: 0;
@@ -2385,7 +2470,7 @@ a:focus-visible {
23852470
content: attr(data-back);
23862471
transform: translateY(-50%) rotateX(90deg);
23872472
}
2388-
.arnav-btn:before {
2473+
.arnav-btn-1:before {
23892474
top: 0;
23902475
left: 0;
23912476
opacity: 1;
@@ -2399,3 +2484,4 @@ a:focus-visible {
23992484
content: attr(data-front);
24002485
transform: translateY(0) rotateX(0);
24012486
}
2487+

index.html

Lines changed: 27 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -588,11 +588,34 @@
588588
<button class="radzhiv-btn-1">Hover me</button>
589589
<div class="createdby-section">
590590
Created by
591-
<a href="https://github.com/radzhiv25">radzhiv</a>
591+
<a href="https://github.com/radzhiv25">radzhiv25</a>
592592
</div>
593593
</div>
594594
<!-- radzhiv's btn end -->
595595

596+
<!-- avishaan24-btn-1 start -->
597+
<div class="button-container">
598+
<!-- add your buttons here, eg.-->
599+
<button class="avishaan24-btn-1"> Hover Me !
600+
</button>
601+
<div class="createdby-section">
602+
Created by
603+
<a href="https://github.com/avishaan24/">avishaan24</a>
604+
</div>
605+
</div>
606+
<!-- avishaan24-btn-1 end -->
607+
608+
<!-- Aditya's btn start -->
609+
<div class="button-container">
610+
<button class="aditya-btn-1">Hover Me</button>
611+
<div class="createdby-section">
612+
Created by
613+
<a href="https://github.com/Aditya-ahirwar">Aditya-ahirwar</a>
614+
</div>
615+
</div>
616+
<!-- Aditya's btn end -->
617+
618+
596619
<!-- Gaurav Sharma's btn start-->
597620
<div class="button-container ">
598621
<button class="gauravsharmatheofficial-btn-1">
@@ -603,17 +626,18 @@
603626
<span class="gauravsharmatheofficial-btn-1-span"> Hover Me </span></button>
604627
<div class="createdby-section">
605628
Created by
606-
<a href="https://github.com/gauravsharmatheofficial"> Gaurav Sharma </a>
629+
<a href="https://github.com/gauravsharmatheofficial">gauravsharmatheofficial</a>
607630
</div>
608631
</div>
609632
<!-- Gaurav Sharma's btn end-->
610633

634+
611635
<!--0b51d14n217's btn-->
612636
<div class="button-container">
613637
<a class="arnav-btn" data-back="Hover Me" data-front="Hover Me"></a>
614638
<div class="createdby-section">
615639
Created by
616-
<a href="https://github.com/0b51d14n217">Arnav Sharma</a>
640+
<a href="https://github.com/0b51d14n217">0b51d14n217</a>
617641
</div>
618642
</div>
619643
<!--0b51d14n217's btn-->

0 commit comments

Comments
 (0)