diff --git a/fedireads/static/format.css b/fedireads/static/format.css index 43ad9969..1d83af33 100644 --- a/fedireads/static/format.css +++ b/fedireads/static/format.css @@ -364,10 +364,39 @@ blockquote { .interaction { background-color: #B2DBBF; border-radius: 0 0 0.5em 0.5em; + display: flex; + flex-direction: row; + padding: 0.5em; +} +.interaction > * { + margin-right: 0.5em; +} +.interaction button:hover { + box-shadow: #247BA0 0em 0em 1em 0em; + color: #247BA0; +} +.interaction button.active:hover .icon { + color: #888; +} +.interaction button { + background: white; + height: 2em; + min-width: 3em; + padding: 0; + color: #888; +} +.interaction button.active .icon { + color: #FF1654; } - .interaction textarea { height: 2em; + width: 23em; + float: left; + padding: 0.25em; + margin-right: 0.5em; +} +.interaction textarea:valid, .interaction textarea:focus { + height: 4em; } table { @@ -408,6 +437,10 @@ th, td { position: relative; right: 2em; } +.post .time-ago { + position: relative; + left: 2em; +} .post .user-pic, .compose-suggestion .user-pic { right: 0.25em; } diff --git a/fedireads/templates/snippets/interaction.html b/fedireads/templates/snippets/interaction.html index 2c44068d..8d530109 100644 --- a/fedireads/templates/snippets/interaction.html +++ b/fedireads/templates/snippets/interaction.html @@ -1,26 +1,33 @@ {% load fr_display %}