![](/build/_assets/logo-png-XGWSYHKJ.png)
Card by elijahgummer
#e8e8e8
1.card { 2 max-width: 250px; 3 width: 100%; 4 background: #fff; 5 padding: 30px; 6 border-radius: 10px; 7 border: 1px solid #d9d9d9; 8} 9.card .header { 10 display: flex; 11 align-items: center; 12} 13.header .img { 14 height: 45px; 15 width: 45px; 16 background: #d9d9d9; 17 border-radius: 50%; 18 position: relative; 19 overflow: hidden; 20} 21.header .details { 22 margin-left: 20px; 23} 24.details span { 25 display: block; 26 background: #d9d9d9; 27 border-radius: 10px; 28 overflow: hidden; 29 position: relative; 30} 31.details .name { 32 height: 12px; 33 width: 70px; 34} 35.details .about { 36 height: 13px; 37 width: 120px; 38 margin-top: 10px; 39} 40.card .description { 41 margin: 25px 0; 42} 43.description .line { 44 background: #d9d9d9; 45 border-radius: 10px; 46 height: 11px; 47 margin: 10px 0; 48 overflow: hidden; 49 position: relative; 50} 51.description .line-1 { 52 width: calc(100% - 15%); 53} 54.description .line-3 { 55 width: calc(100% - 40%); 56} 57.card .btns { 58 display: flex; 59} 60.card .btns .btn { 61 height: 25px; 62 width: 100%; 63 background: #d9d9d9; 64 border-radius: 25px; 65 position: relative; 66 overflow: hidden; 67} 68.btns .btn-1 { 69 margin-right: 8px; 70} 71.btns .btn-2 { 72 margin-left: 8px; 73} 74.header .img::before, 75.details span::before, 76.description .line::before, 77.btns .btn::before { 78 position: absolute; 79 content: ""; 80 height: 100%; 81 width: 100%; 82 background-image: linear-gradient( 83 to right, 84 #d9d9d9 0%, 85 rgba(0, 0, 0, 0.05) 20%, 86 #d9d9d9 40%, 87 #d9d9d9 100% 88 ); 89 background-repeat: no-repeat; 90 background-size: 450px 400px; 91 animation: shimmer 1s linear infinite; 92} 93.header .img::before { 94 background-size: 650px 600px; 95} 96.details span::before { 97 animation-delay: 0.2s; 98} 99.btns .btn-2::before { 100 animation-delay: 0.22s; 101} 102@keyframes shimmer { 103 0% { 104 background-position: -450px 0; 105 } 106 100% { 107 background-position: 450px 0; 108 } 109} 110
60 views
60 views
MIT License