yumoqing
73ee108cab
- Add /tenant/index.ui using bricks framework (no inline styles) - Use Image widget for all images (logo, hero, case studies) - Register /tenant and /tenant/index.ui routes as 'any' permission - Include responsive CSS with tenant- prefix to avoid conflicts - Login button redirects to /rbac/user/login.ui - Support multi-tenant customization via ?tenant=xxx parameter
198 lines
3.2 KiB
CSS
198 lines
3.2 KiB
CSS
.tenant-landing {
|
|
background: #fff;
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
}
|
|
|
|
.tenant-header {
|
|
background: rgba(255,255,255,0.95);
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 100;
|
|
height: 80px;
|
|
}
|
|
|
|
.tenant-logo img {
|
|
height: 50px;
|
|
}
|
|
|
|
.tenant-nav {
|
|
gap: 30px;
|
|
}
|
|
|
|
.nav-link {
|
|
cursor: pointer;
|
|
font-size: 15px;
|
|
color: #333;
|
|
font-weight: 500;
|
|
transition: color 0.2s;
|
|
}
|
|
|
|
.nav-link:hover {
|
|
color: #6366f1;
|
|
}
|
|
|
|
.login-btn {
|
|
background: #6366f1 !important;
|
|
color: #fff !important;
|
|
border: none !important;
|
|
padding: 10px 24px !important;
|
|
border-radius: 6px !important;
|
|
font-size: 14px !important;
|
|
font-weight: 600 !important;
|
|
cursor: pointer !important;
|
|
}
|
|
|
|
.login-btn:hover {
|
|
background: #5558e3 !important;
|
|
}
|
|
|
|
.tenant-hero {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
min-height: 500px;
|
|
}
|
|
|
|
.hero-content {
|
|
color: #fff;
|
|
}
|
|
|
|
.hero-title {
|
|
font-size: 48px !important;
|
|
font-weight: 700 !important;
|
|
line-height: 1.2 !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
.hero-subtitle {
|
|
font-size: 24px !important;
|
|
color: rgba(255,255,255,0.9) !important;
|
|
font-weight: 400 !important;
|
|
}
|
|
|
|
.hero-btn {
|
|
background: #fff !important;
|
|
color: #6366f1 !important;
|
|
border: none !important;
|
|
padding: 14px 32px !important;
|
|
border-radius: 8px !important;
|
|
font-size: 16px !important;
|
|
font-weight: 600 !important;
|
|
cursor: pointer !important;
|
|
}
|
|
|
|
.hero-btn:hover {
|
|
background: #f0f0f0 !important;
|
|
}
|
|
|
|
.hero-image {
|
|
width: 45%;
|
|
}
|
|
|
|
.tenant-solutions {
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 36px !important;
|
|
font-weight: 700 !important;
|
|
text-align: center !important;
|
|
color: #1a1a2e !important;
|
|
margin-bottom: 20px !important;
|
|
}
|
|
|
|
.solution-cards {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 24px;
|
|
}
|
|
|
|
.solution-card {
|
|
background: #fff;
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
.solution-card:hover {
|
|
transform: translateY(-4px);
|
|
box-shadow: 0 8px 30px rgba(0,0,0,0.12);
|
|
}
|
|
|
|
.card-title {
|
|
font-size: 24px !important;
|
|
font-weight: 700 !important;
|
|
color: #1a1a2e !important;
|
|
}
|
|
|
|
.card-text {
|
|
font-size: 15px !important;
|
|
color: #666 !important;
|
|
line-height: 1.6 !important;
|
|
}
|
|
|
|
.card-stat {
|
|
font-size: 14px !important;
|
|
color: #6366f1 !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.tenant-cases {
|
|
background: #fff;
|
|
}
|
|
|
|
.case-cards {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 24px;
|
|
}
|
|
|
|
.case-card {
|
|
background: #fff;
|
|
border-radius: 12px;
|
|
overflow: hidden;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
.case-card:hover {
|
|
transform: translateY(-4px);
|
|
}
|
|
|
|
.case-image img {
|
|
width: 100%;
|
|
height: 200px;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.case-title {
|
|
font-size: 20px !important;
|
|
font-weight: 700 !important;
|
|
color: #1a1a2e !important;
|
|
padding: 0 20px !important;
|
|
}
|
|
|
|
.case-company {
|
|
font-size: 14px !important;
|
|
color: #6366f1 !important;
|
|
font-weight: 600 !important;
|
|
padding: 0 20px !important;
|
|
}
|
|
|
|
.case-desc {
|
|
font-size: 14px !important;
|
|
color: #666 !important;
|
|
line-height: 1.6 !important;
|
|
padding: 0 20px 20px !important;
|
|
}
|
|
|
|
.tenant-footer {
|
|
background: #1a1a2e;
|
|
color: #fff;
|
|
min-height: 80px;
|
|
}
|
|
|
|
.footer-text {
|
|
color: rgba(255,255,255,0.6);
|
|
font-size: 14px !important;
|
|
}
|