commit | author | age | ||
eb387d | 1 | <template> |
275780 | 2 | <li> |
CM | 3 | <base-card> |
4 | <header> | |
5 | <h3>{{ title }}</h3> | |
6 | <button>Delete</button> | |
7 | </header> | |
8 | <p>{{ description }}</p> | |
9 | <nav> | |
10 | <a :href="link">View Resource</a> | |
11 | </nav> | |
12 | </base-card> | |
13 | </li> | |
eb387d | 14 | </template> |
CM | 15 | |
16 | <script> | |
17 | export default { | |
275780 | 18 | props: ['title', 'description', 'link'], |
CM | 19 | }; |
43396a | 20 | </script> |
CM | 21 | |
22 | <style scoped> | |
23 | li { | |
24 | margin: auto; | |
25 | max-width: 40rem; | |
26 | } | |
27 | ||
28 | header { | |
29 | display: flex; | |
30 | justify-content: space-between; | |
31 | align-items: center; | |
32 | } | |
33 | ||
34 | h3 { | |
35 | font-size: 1.25rem; | |
36 | margin: 0.5rem 0; | |
37 | } | |
38 | ||
39 | p { | |
40 | margin: 0.5rem 0; | |
41 | } | |
42 | ||
43 | a { | |
44 | text-decoration: none; | |
45 | color: #ce5c00; | |
46 | } | |
47 | ||
48 | a:hover, | |
49 | a:active { | |
50 | color: #c89300; | |
51 | } | |
275780 | 52 | </style> |