Card by anniekoop
#e8e8e8
1.card { 2 width: fit-content; 3 background-color: #f2f3f7; 4 border-radius: 0.75em; 5 cursor: pointer; 6 transition: ease 0.2s; 7 box-shadow: 1em 1em 1em #d8dae0b1, -0.75em -0.75em 1em #ffffff; 8 border: 1.5px solid #f2f3f7; 9} 10 11.card:hover { 12 background-color: #d3ddf1; 13 border: 1.5px solid #1677ff; 14} 15 16.container { 17 margin-top: 1.25em; 18 margin-bottom: 1.375em; 19 margin-left: 1.375em; 20 margin-right: 2em; 21 display: flex; 22 flex-direction: row; 23 gap: 0.75em; 24} 25 26.status-ind { 27 width: 0.625em; 28 height: 0.625em; 29 background-color: #ff0000; 30 margin: 0.375em 0; 31 border-radius: 0.5em; 32} 33 34.text-wrap { 35 display: flex; 36 flex-direction: column; 37 gap: 0.25em; 38 color: #333; 39} 40 41.time { 42 font-size: 0.875em; 43 color: #777; 44} 45 46.text-link { 47 font-weight: 500; 48 text-decoration: none; 49 color: black; 50} 51 52.button-wrap { 53 display: flex; 54 flex-direction: row; 55 gap: 1em; 56 align-items: center; 57} 58 59.secondary-cta { 60 background-color: transparent; 61 border: none; 62 font-size: 15px; 63 font-weight: 400; 64 color: #666; 65 cursor: pointer; 66} 67 68.primary-cta { 69 font-size: 15px; 70 background-color: transparent; 71 font-weight: 600; 72 color: #1677ff; 73 border: none; 74 border-radius: 1.5em; 75 cursor: pointer; 76} 77 78button:hover { 79 text-decoration: underline; 80} 81 82.right { 83 display: flex; 84 flex-direction: column; 85 gap: 0.875em; 86} 87
194 views
194 views
MIT License