#e8e8e8
1.card { 2 max-width: 320px; 3 position: relative; 4 display: block; 5 overflow: hidden; 6 border: 1px solid rgba(243, 244, 246, ); 7 border-radius: 0.5rem; 8 padding: 1rem; 9 background-color: #fff; 10} 11 12.header { 13 display: flex; 14 justify-content: space-between; 15 grid-gap: 1rem; 16 gap: 1rem; 17} 18 19.title { 20 font-size: 1.125rem; 21 line-height: 1.25rem; 22 font-weight: 700; 23 color: rgba(17, 24, 39, 1); 24 text-decoration: none; 25} 26 27.title:hover { 28 text-decoration: underline royalblue; 29} 30 31.name { 32 margin-top: 0.25rem; 33 font-size: 0.75rem; 34 line-height: 1rem; 35 font-weight: 500; 36 color: rgba(75, 85, 99, 1); 37} 38 39.image { 40 display: block; 41 flex-shrink: 0; 42 height: 3rem; 43 width: 3rem; 44 border-radius: 0.5rem; 45 object-fit: cover; 46 background-color: royalblue; 47} 48 49.description { 50 margin-top: 1rem; 51 font-size: 0.875rem; 52 line-height: 1.25rem; 53 color: rgba(107, 114, 128, 1); 54} 55 56.post-info { 57 margin-top: 1.5rem; 58 display: flex; 59 grid-gap: 1rem; 60 gap: 1rem; 61} 62 63.cr { 64 display: flex; 65 flex-direction: column-reverse; 66} 67 68.dt { 69 font-size: 0.875rem; 70 line-height: 1.25rem; 71 font-weight: 600; 72 color: rgba(75, 85, 99, 1); 73} 74 75.dd { 76 font-size: 0.75rem; 77 line-height: 1rem; 78 color: rgba(107, 114, 128,1); 79}
Comments
MIT License