Files
ladill-meet/resources/css/app.css
T
isaaccladandCursor dc3c6dee2d
Deploy Ladill Meet / deploy (push) Successful in 39s
Fix meeting audio playback and restyle room detail actions.
Unlock LiveKit audio after user gesture, respect join mute/video settings,
and replace plain links with btn-secondary pills on the meeting details page.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-01 13:38:01 +00:00

277 lines
6.4 KiB
CSS

@import 'tailwindcss';
@plugin '@tailwindcss/forms';
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';
@theme {
--font-sans: 'Figtree', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
'Segoe UI Symbol', 'Noto Color Emoji';
}
[x-cloak] {
display: none !important;
}
.meet-toolbar-icon {
filter: brightness(0) invert(1);
opacity: 0.92;
}
.meet-chat-bubble {
max-width: 85%;
}
.meet-chat-bubble--own {
margin-left: auto;
}
/* QR create/show: flush mobile action bar to the physical screen bottom (mobile only) */
@media (max-width: 1023px) {
.mobile-action-bar {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 50;
display: flex;
flex-direction: column;
background-color: #fff;
}
.mobile-action-bar__toolbar {
display: flex;
height: 4rem;
flex-shrink: 0;
align-items: center;
gap: 0.75rem;
border-top: 1px solid rgb(226 232 240);
background-color: #fff;
padding-inline: 1rem;
}
.mobile-action-bar__inset-fill {
flex-shrink: 0;
width: 100%;
background-color: #fff;
height: env(safe-area-inset-bottom, 0px);
min-height: max(env(safe-area-inset-bottom, 0px), 20px);
}
}
/* Extra white bleed behind the bar for any remaining viewport gap on mobile */
.qr-mobile-bottom-bleed {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 48;
pointer-events: none;
background-color: #fff;
height: calc(4rem + env(safe-area-inset-bottom, 0px) + 24px);
min-height: calc(4rem + 24px);
}
html.qr-mobile-page {
background-color: #fff;
}
html.qr-mobile-page body {
background-color: #fff;
}
/* Payment QR landing: lock scroll and keep the amount sheet flush to the screen bottom */
@media (max-width: 767px) {
html.mini-payment-page,
html.mini-payment-page body {
overflow: hidden;
width: 100%;
height: 100%;
}
html.mini-payment-page body {
position: fixed;
inset: 0;
}
.mini-payment-sheet {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 20;
}
.mini-payment-bottom-bleed {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 19;
pointer-events: none;
background-color: #fff;
height: calc(12rem + env(safe-area-inset-bottom, 0px));
min-height: 8rem;
}
}
.mobile-stats-card {
width: calc(66.666667% - 0.5rem);
}
@layer components {
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
border-radius: 9999px;
background-image: linear-gradient(to right, rgb(79 70 229), rgb(124 58 237));
padding: 0.5rem 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 600;
color: #fff;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
transition: filter 0.15s ease;
}
.btn-primary:hover {
filter: brightness(0.92);
}
.btn-primary:disabled {
opacity: 0.6;
pointer-events: none;
}
.btn-primary-sm {
padding: 0.375rem 0.75rem;
font-size: 0.75rem;
line-height: 1rem;
}
.btn-primary-lg {
padding: 0.625rem 1.25rem;
}
.btn-secondary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
border-radius: 9999px;
border: 1px solid rgb(226 232 240);
background-color: #fff;
padding: 0.5rem 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 600;
color: rgb(51 65 85);
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
transition: background-color 0.15s ease, border-color 0.15s ease;
}
.btn-secondary:hover {
background-color: rgb(248 250 252);
border-color: rgb(203 213 225);
}
.btn-secondary:disabled {
opacity: 0.6;
pointer-events: none;
}
.btn-secondary-sm {
padding: 0.375rem 0.75rem;
font-size: 0.75rem;
line-height: 1rem;
}
.btn-group {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
}
.btn-fab {
display: inline-flex;
height: 2.75rem;
width: 2.75rem;
align-items: center;
justify-content: center;
border-radius: 9999px;
background-image: linear-gradient(to right, rgb(79 70 229), rgb(124 58 237));
color: #fff;
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
transition: filter 0.15s ease;
}
.btn-fab:hover {
filter: brightness(0.92);
}
}
@media (min-width: 640px) {
.mobile-stats-card {
width: auto;
}
}
/* Ladill app launcher — cap at 5 rows (15 apps), always-visible scroll indicator */
.ladill-launcher-apps-wrap {
position: relative;
}
.ladill-launcher-apps {
max-height: calc(5 * 5.25rem + 4 * 0.25rem);
overflow-y: scroll;
overscroll-behavior: contain;
scrollbar-gutter: stable;
scrollbar-width: thin;
scrollbar-color: rgb(148 163 184) rgb(241 245 249);
margin-right: -0.25rem;
padding-right: 0.25rem;
}
.ladill-launcher-apps::-webkit-scrollbar {
-webkit-appearance: none;
width: 8px;
}
.ladill-launcher-apps::-webkit-scrollbar-track {
background: rgb(241 245 249);
border-radius: 9999px;
}
.ladill-launcher-apps::-webkit-scrollbar-thumb {
background-color: rgb(148 163 184);
border-radius: 9999px;
min-height: 2.5rem;
border: 2px solid rgb(241 245 249);
background-clip: padding-box;
}
.ladill-launcher-apps::-webkit-scrollbar-thumb:hover {
background-color: rgb(100 116 139);
}
.ladill-launcher-scroll-more {
position: absolute;
left: 50%;
bottom: 0.125rem;
z-index: 1;
display: flex;
height: 1.25rem;
width: 1.25rem;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
align-items: center;
justify-content: center;
border-radius: 9999px;
background: rgb(255 255 255);
color: rgb(100 116 139);
box-shadow: 0 1px 2px rgb(15 23 42 / 0.08);
pointer-events: none;
}