aheh/mirotalk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[mirotalk] - move room generate button inside room name input field

Browse Source
This commit is contained in:
Miroslav Pejic
2026-03-29 17:30:56 +02:00
parent 5a55a072dd
commit 6ee6e7a2c3
3 changed files with 74 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/landing.css
+48
View File
@@ -1446,11 +1446,51 @@ textarea.form-input {
margin-top: 8px;
}
.room-input-wrap {
position: relative;
flex-grow: 1;
flex-shrink: 1;
}
.room-input-wrap .form-input {
padding-right: 44px;
}
.room-gen-btn {
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
background: none;
border: none;
color: #6a6f82;
font-size: 18px;
cursor: pointer;
padding: 6px;
border-radius: 6px;
opacity: 0.6;
transition: color 0.2s, background 0.2s, opacity 0.2s;
}
.room-gen-btn:hover {
color: #fff;
background: #376df9;
opacity: 1;
}
@media (max-width: 640px) {
.form-group-desktop .form-input {
margin-bottom: 12px;
}
.form-group-desktop .room-input-wrap {
margin-bottom: 12px;
}
.form-group-desktop .room-input-wrap .form-input {
margin-bottom: 0;
}
.form-group-desktop .button {
width: 100%;
}
@@ -1467,6 +1507,14 @@ textarea.form-input {
margin-right: 12px;
}
.form-group-desktop .room-input-wrap {
margin-right: 12px;
}
.form-group-desktop .room-input-wrap .form-input {
margin-right: 0;
}
.form-group-desktop .button {
padding-left: 24px;
padding-right: 24px;
public/views/landing.html
+13 -11
View File
@@ -139,17 +139,19 @@
<div class="mb-0">
<label class="form-label screen-reader" for="roomName">MiroTalk-P2P</label>
<div class="form-group-desktop">
<input
id="roomName"
class="form-input"
type="text"
value="mirotalk"
maxlength="32"
/>
<button
id="genRoomButton"
class="button button-primary br-6 mr-8 mb-8 fas fa-arrows-rotate"
></button>
<div class="room-input-wrap">
<input
id="roomName"
class="form-input"
type="text"
value="mirotalk"
maxlength="32"
/>
<button
id="genRoomButton"
class="room-gen-btn fas fa-arrows-rotate"
></button>
</div>
<button id="joinRoomButton" class="button button-primary br-6">
Join Room
</button>
public/views/newcall.html
+13 -11
View File
@@ -129,17 +129,19 @@
<div class="mb-0">
<label class="form-label screen-reader" for="roomName">MiroTalk-P2P</label>
<div class="form-group-desktop">
<input
id="roomName"
class="form-input"
type="text"
value="mirotalk"
maxlength="32"
/>
<button
id="genRoomButton"
class="button button-primary br-6 mr-8 mb-8 fas fa-arrows-rotate"
></button>
<div class="room-input-wrap">
<input
id="roomName"
class="form-input"
type="text"
value="mirotalk"
maxlength="32"
/>
<button
id="genRoomButton"
class="room-gen-btn fas fa-arrows-rotate"
></button>
</div>
<button id="joinRoomButton" class="button button-primary br-6">
Join Room
</button>