olcxjas-softworks/LarpixClient
2
0
Fork 1
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions 3

small ui fix

Browse source
This commit is contained in:
olcxja 2026-08-26 08:53:28 +02:00
commit e00bfdce39
4 changed files with 22 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
android/app/src/main/assets/public/screens.js
View file

@ -141,7 +141,7 @@ var invitesEntry = `
var chatScreen = ` var chatScreen = `
<div style="display: flex; flex-direction: column; height: 100%; width: 100%;"> <div style="display: flex; flex-direction: column; height: 100%; width: 100%;">
<div id="chat-messages" style="flex-grow: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem;"> <div id="chat-messages" style="flex-grow: 1; overflow-y: auto; overflow-x: hidden; padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem;">
</div> </div>
<div id="replying-bar" style="display: none; padding: 0 1rem; border-top: var(--border-width) solid var(--light-border-color); font-size: 0.85rem; justify-content: space-between; align-items: center; background: var(--main-bg-color);"> <div id="replying-bar" style="display: none; padding: 0 1rem; border-top: var(--border-width) solid var(--light-border-color); font-size: 0.85rem; justify-content: space-between; align-items: center; background: var(--main-bg-color);">
<div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1;"> <div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1;">

11
android/app/src/main/assets/public/style.css
View file

@ -686,6 +686,7 @@ space{
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
margin: 0; margin: 0;
position: relative;
} }
.room-pfp { .room-pfp {
width: 2.2rem; width: 2.2rem;
@ -738,6 +739,7 @@ space{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
min-width: 0;
} }
.chat-message-header { .chat-message-header {
display: flex; display: flex;
@ -1178,7 +1180,15 @@ input:checked + .toggle-slider:before {
margin-top: 0.2rem; margin-top: 0.2rem;
} }
/* Czerwona kropka nieprzeczytanych - pozycjonowana absolutnie. Odstęp liczony tak,
żeby ŚRODEK kropki leżał na tej samej osi co środek 1rem-owego .call-indicator
(0.6rem paddingu + (1rem - 0.65rem)/2) - inaczej kropka "ucieka" w prawo
względem większej ikony słuchawek. */
.unread-badge { .unread-badge {
position: absolute;
right: calc(0.6rem + (1rem - 0.65rem) / 2);
top: 50%;
margin-top: -0.325rem;
width: 0.65rem; width: 0.65rem;
height: 0.65rem; height: 0.65rem;
min-width: 0.65rem; min-width: 0.65rem;
@ -1186,7 +1196,6 @@ input:checked + .toggle-slider:before {
background-color: var(--big-red); background-color: var(--big-red);
border-radius: 50%; border-radius: 50%;
flex-shrink: 0; flex-shrink: 0;
margin-right: 0.5rem;
transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275); transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
transform: scale(0); transform: scale(0);
} }

2
webroot/screens.js
View file

@ -141,7 +141,7 @@ var invitesEntry = `
var chatScreen = ` var chatScreen = `
<div style="display: flex; flex-direction: column; height: 100%; width: 100%;"> <div style="display: flex; flex-direction: column; height: 100%; width: 100%;">
<div id="chat-messages" style="flex-grow: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem;"> <div id="chat-messages" style="flex-grow: 1; overflow-y: auto; overflow-x: hidden; padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem;">
</div> </div>
<div id="replying-bar" style="display: none; padding: 0 1rem; border-top: var(--border-width) solid var(--light-border-color); font-size: 0.85rem; justify-content: space-between; align-items: center; background: var(--main-bg-color);"> <div id="replying-bar" style="display: none; padding: 0 1rem; border-top: var(--border-width) solid var(--light-border-color); font-size: 0.85rem; justify-content: space-between; align-items: center; background: var(--main-bg-color);">
<div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1;"> <div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1;">

11
webroot/style.css
View file

@ -686,6 +686,7 @@ space{
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
margin: 0; margin: 0;
position: relative;
} }
.room-pfp { .room-pfp {
width: 2.2rem; width: 2.2rem;
@ -738,6 +739,7 @@ space{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
min-width: 0;
} }
.chat-message-header { .chat-message-header {
display: flex; display: flex;
@ -1178,7 +1180,15 @@ input:checked + .toggle-slider:before {
margin-top: 0.2rem; margin-top: 0.2rem;
} }
/* Czerwona kropka nieprzeczytanych - pozycjonowana absolutnie. Odstęp liczony tak,
żeby ŚRODEK kropki leżał na tej samej osi co środek 1rem-owego .call-indicator
(0.6rem paddingu + (1rem - 0.65rem)/2) - inaczej kropka "ucieka" w prawo
względem większej ikony słuchawek. */
.unread-badge { .unread-badge {
position: absolute;
right: calc(0.6rem + (1rem - 0.65rem) / 2);
top: 50%;
margin-top: -0.325rem;
width: 0.65rem; width: 0.65rem;
height: 0.65rem; height: 0.65rem;
min-width: 0.65rem; min-width: 0.65rem;
@ -1186,7 +1196,6 @@ input:checked + .toggle-slider:before {
background-color: var(--big-red); background-color: var(--big-red);
border-radius: 50%; border-radius: 50%;
flex-shrink: 0; flex-shrink: 0;
margin-right: 0.5rem;
transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275); transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
transform: scale(0); transform: scale(0);
} }