Files: 4a58e38afe8d7cd5659d286607457aeb91ee7638 / app / html / blogCard.mcss
1062 bytesRaw
1 | BlogCard { |
2 | padding: 1rem |
3 | $backgroundPrimaryText |
4 | |
5 | border: 1px solid #fff |
6 | transition: all .5s ease |
7 | |
8 | :hover { |
9 | border: 1px solid gainsboro |
10 | box-shadow: gainsboro 2px 2px 10px |
11 | } |
12 | |
13 | display: flex |
14 | flex-direction: column |
15 | |
16 | div.context { |
17 | font-size: .8rem |
18 | margin-bottom: 1rem |
19 | |
20 | display: flex |
21 | align-items: center |
22 | |
23 | img.Avatar { |
24 | margin-right: .5rem |
25 | } |
26 | |
27 | div.name { |
28 | margin-right: 1rem |
29 | } |
30 | |
31 | div.Timeago {} |
32 | } |
33 | |
34 | div.content { |
35 | display: flex |
36 | flex-direction: row |
37 | flex-grow: 1 |
38 | |
39 | cursor: pointer |
40 | |
41 | |
42 | div.Thumbnail { |
43 | margin-right: 1rem |
44 | } |
45 | |
46 | div.text { |
47 | display: flex |
48 | flex-wrap: wrap |
49 | |
50 | h2 { |
51 | $markdownLarge |
52 | margin: 0 .5rem 0 0 |
53 | } |
54 | div.Button.-channel {} |
55 | div.summary { |
56 | flex-basis: 100% |
57 | } |
58 | } |
59 | } |
60 | background-color: #f8f8f8 |
61 | |
62 | -unread { |
63 | div.content { |
64 | font-weight: bold |
65 | } |
66 | background-color: #fff |
67 | } |
68 | } |
69 | |
70 | Thumbnail { |
71 | border-radius: .5rem |
72 | min-width: 8rem |
73 | min-height: 6rem |
74 | width: 8rem |
75 | height: 6rem |
76 | } |
77 | |
78 |
Built with git-ssb-web