Card by mrpumps31232
This card was created for Open-Source CSS Odyssey
#212121
1.card { 2 background-color: rgb(86, 30, 124); 3 border-radius: 8px; 4 transform: scale(1.3); 5 border: 13px solid rgb(86, 30, 124); 6 height: 15rem; 7 box-shadow: 0px 0px 15px rgb(221, 108, 255); 8} 9 10div.heading { 11 font-size: large; 12 font-weight: bold; 13} 14 15button { 16 margin: auto; 17 position: absolute; 18 top: 0; 19 left: 0; 20 bottom: -9.5rem; 21 right: 0; 22 height: 30px; 23 width: 120px; 24 border: none; 25 border-radius: 8px; 26 background-color: purple; 27 color: white; 28 transition: 0.4s all; 29 font-weight: bold; 30 box-shadow: 0px 0px 12px rgb(221, 108, 255); 31 background-image: linear-gradient(to bottom right, #ff69b4, #9b4fe5); 32 background-size: 200% 200%; 33 background-position: left bottom; 34} 35 36svg { 37 margin-top: .3rem; 38 background-color: ; 39} 40 41button:hover { 42 cursor: pointer; 43 transform: scale(1.2); 44 background-position: right top; 45} 46 47div.item--inspire:hover { 48 transition: 0.9s ease; 49 transform: scale(1.1); 50 background-color: rgb(221, 108, 255); 51 border-radius: 10px; 52 opacity: .8; 53 cursor: pointer; 54} 55 56div.item--post:hover { 57 transition: 0.9s ease; 58 transform: scale(1.1); 59 opacity: .8; 60 cursor: pointer; 61} 62 63div.item--create:hover { 64 transition: 0.9s ease; 65 transform: scale(1.1); 66 opacity: .8; 67 cursor: pointer; 68} 69 70div.item { 71 background-color: rgb(221, 108, 255); 72 border-radius: 9px; 73 margin-top: 0.4rem; 74 transition: 0.4s all; 75} 76
484 views
484 views
MIT License