butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

UX: make room type selection responsive

Browse source
This commit is contained in:
10G Meow 2023-11-05 11:13:42 +02:00
parent fa612d2e9c
commit b33d73fff8
3 changed files with 25 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/assets/css/chat.scss
View file

@ -1018,13 +1018,15 @@ body {
& > *:last-child {
flex: 0 0 auto;
}
.option-title {
color: #000;
font-size: 16 * $chat-text-size;
}
.option-text {
font-size: 13 * $chat-text-size;
}
}
.option-text {
font-size: 13 * $chat-text-size;
}
.option-title {
color: #000;
font-size: 16 * $chat-text-size;
}
.header-button-left {

12
src/components/CreateRoom.vue
View file

@ -65,11 +65,15 @@
</v-card>
<v-card v-if="availableRoomTypes.length > 1" v-show="showOptions" class="room-option account ma-0" flat>
<v-card-text class="with-right-label">
<div>
<div class="option-title">{{ $t('room_info.room_type') }}</div>
<v-card-text>
<div class="d-flex flex-wrap text-left">
<div class="col-12 col-md-6 mr-auto pa-0">
<div class="option-title">{{ $t('room_info.room_type') }}</div>
</div>
<div class="col-12 col-md-6 pa-0">
<RoomTypeSelector v-model="roomType" />
</div>
</div>
<RoomTypeSelector v-model="roomType" />
</v-card-text>
</v-card>
<v-card v-if="$config.experimental_read_only_room" v-show="showOptions" class="room-option account ma-0" flat>

12
src/components/RoomInfo.vue
View file

@ -140,11 +140,15 @@
<v-card class="account ma-3" flat v-if="(iAmAdmin() && availableRoomTypes.length > 1) || canChangeReadOnly()">
<v-card-title class="h2 with-right-label"><div>{{ $t("room_info.experimental_features") }}</div><div></div></v-card-title>
<v-card-text class="with-right-label" v-if="iAmAdmin() && availableRoomTypes.length > 1">
<div>
<div class="option-title">{{ $t('room_info.room_type') }}</div>
<v-card-text v-if="iAmAdmin() && availableRoomTypes.length > 1">
<div class="d-flex flex-wrap">
<div class="col-12 col-md-6 mr-auto pa-0">
<div class="option-title">{{ $t('room_info.room_type') }}</div>
</div>
<div class="col-12 col-md-6 pa-0">
<RoomTypeSelector v-model="roomType" />
</div>
</div>
<RoomTypeSelector v-model="roomType" />
</v-card-text>
<v-card-text class="with-right-label" v-if="canChangeReadOnly()">
<div>