Fossil

Differences From Artifact [a74bfc2548]:

• File src/default.css — part of check-in [0a00a10312] at 2020-12-26 23:57:45 on branch chat-safari-breaks-here — Found what seems to be a more or less viable solution for the chat layout in which the input area is effectively sticky while not actually being so. New messages do not scroll to the start of the list except for when a user locally posts a message, but instead, if a new message arrives and is scrolled out of view, a toast is shown to gently alert the user that a new message has arrived. (user: stephan size: 40515)

To Artifact [5a9ee38d1e]:

• File src/default.css — part of check-in [22b0faad3a] at 2020-12-27 00:22:07 on branch chat-safari-breaks-here — Disabled the top-down/bottom-up chat toggle, per chat discussion. Removed explicit setting of div.content margins, in chat,except in chat-only mode, so that we honor skin-level margin settings (resolves layout breakage in Xekri skin). (user: stephan size: 40515)

1650
1651
1652
1653
1654
1655
1656
1657
1658
1659
1660
1661
1662
1663
1664
1665
1666
1667
1668
1669

1670
1671
1672
1673
1674
1675
1676

                 lower than div.content then mouse events to it
                 are blocked!*/;
}
body.chat.chat-only-mode #chat-message-wrapper {
}

body.chat div.content {
  margin: 0;
  padding: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  max-height: 85vh /* rough approximate */;
}
body.chat.chat-bottom-up div.content {
  flex-direction: column-reverse;
}
body.chat.chat-only-mode div.content {
  max-height: 95vh/*larger than approx. this is too big for Firefox on Android*/;

}
/* Wrapper for /chat user input controls */
body.chat #chat-input-area {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid black;
  padding: 0.5em 1em 0 0.5em;

<












>

1650
1651
1652
1653
1654
1655
1656

1657
1658
1659
1660
1661
1662
1663
1664
1665
1666
1667
1668
1669
1670
1671
1672
1673
1674
1675
1676

                 lower than div.content then mouse events to it
                 are blocked!*/;
}
body.chat.chat-only-mode #chat-message-wrapper {
}

body.chat div.content {

  padding: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  max-height: 85vh /* rough approximate */;
}
body.chat.chat-bottom-up div.content {
  flex-direction: column-reverse;
}
body.chat.chat-only-mode div.content {
  max-height: 95vh/*larger than approx. this is too big for Firefox on Android*/;
  margin: 0;
}
/* Wrapper for /chat user input controls */
body.chat #chat-input-area {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid black;
  padding: 0.5em 1em 0 0.5em;