#e8e8e8
1.card { 2 max-width: 300px; 3 border-radius: 0.5rem; 4 background-color: #fff; 5 box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); 6 border: 1px solid transparent; 7} 8 9.card a { 10 text-decoration: none 11} 12 13.content { 14 padding: 1.1rem; 15} 16 17.image { 18 object-fit: cover; 19 width: 100%; 20 height: 150px; 21 background-color: rgb(239, 205, 255); 22} 23 24.title { 25 color: #111827; 26 font-size: 1.125rem; 27 line-height: 1.75rem; 28 font-weight: 600; 29} 30 31.desc { 32 margin-top: 0.5rem; 33 color: #6B7280; 34 font-size: 0.875rem; 35 line-height: 1.25rem; 36} 37 38.action { 39 display: inline-flex; 40 margin-top: 1rem; 41 color: #ffffff; 42 font-size: 0.875rem; 43 line-height: 1.25rem; 44 font-weight: 500; 45 align-items: center; 46 gap: 0.25rem; 47 background-color: #2563EB; 48 padding: 4px 8px; 49 border-radius: 4px; 50} 51 52.action span { 53 transition: .3s ease; 54} 55 56.action:hover span { 57 transform: translateX(4px); 58} 59
Comments
MIT License