aboutsummaryrefslogtreecommitdiff
path: root/src/web/components/post/Post.css
diff options
context:
space:
mode:
authorNicolas James <Eele1Ephe7uZahRie@tutanota.com>2025-02-13 18:04:18 +1100
committerNicolas James <Eele1Ephe7uZahRie@tutanota.com>2025-02-13 18:04:18 +1100
commit93dfe2be64e8658839bcfe5356adf35f8cde7075 (patch)
treec60b1e20d569b74dbde85123e1b2bf3590c66244 /src/web/components/post/Post.css
initial commit
Diffstat (limited to 'src/web/components/post/Post.css')
-rw-r--r--src/web/components/post/Post.css91
1 files changed, 91 insertions, 0 deletions
diff --git a/src/web/components/post/Post.css b/src/web/components/post/Post.css
new file mode 100644
index 0000000..8721640
--- /dev/null
+++ b/src/web/components/post/Post.css
@@ -0,0 +1,91 @@
+
+
+.postCard {
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+
+ font-size: 2em;
+ margin-bottom: 0.75rem;
+ padding: 1rem 1rem;
+
+ background-color: var(--black-10);
+ border-radius: 0.5em;
+ color: white;
+ box-shadow: none;
+
+ cursor: pointer;
+}
+.postCard:hover {
+ background-color: hsl(0, 0%, 25%);
+}
+
+.postCard > img {
+ flex-shrink: 0;
+
+ border-radius: 50%;
+ height: 2.5em;
+ width: 2.5em;
+}
+
+.rowContainer {
+ display: flex;
+ flex-direction: column;
+ flex-basis: 100%;
+ justify-content: space-between;
+
+ height: 2.5em;
+ padding-left: 0.5em;
+ min-width: 0;
+
+ color: var(--black-95);
+}
+
+.rowContainer > h4 {
+ font-size: 0.4em;
+
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
+.titleContainer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+.titleContainer h3 {
+ font-size: 0.5em;
+ font-weight: bold;
+ color: var(--black-98);
+
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+}
+.titleContainer h4 {
+ font-size: 0.5em;
+ font-style: italic;
+ white-space: nowrap;
+}
+
+.placeholder {
+ text-decoration: line-through hsl(0, 0%, 60%) 1em;
+}
+.placeholder img {
+ background-color: hsl(0, 0%, 50%);
+}
+
+.postIconsContainer {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+
+ font-size: 0.5em;
+ color: var(--brand-50);
+}
+.postIconsContainer > div {
+ margin-left: 0.25em;
+}