Major updates, authentication, multi-users
This commit is contained in:
blaisadmin
+1306
-78
File diff suppressed because it is too large
Load Diff
+224
-7
@@ -102,6 +102,12 @@ textarea {
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.auth-shell {
|
||||
max-width: 1180px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.content-shell {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
@@ -114,6 +120,120 @@ textarea {
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
.auth-panel {
|
||||
display: grid;
|
||||
grid-template-columns: 1.1fr 0.9fr;
|
||||
gap: 1.5rem;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.auth-hero-card {
|
||||
min-height: 280px;
|
||||
align-items: end;
|
||||
}
|
||||
|
||||
.auth-copy,
|
||||
.auth-card {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.auth-card {
|
||||
padding: 1.25rem;
|
||||
border-radius: 24px;
|
||||
background: linear-gradient(180deg, rgba(255, 252, 247, 0.9), rgba(240, 248, 244, 0.82));
|
||||
border: 1px solid rgba(39, 105, 179, 0.12);
|
||||
}
|
||||
|
||||
.auth-tabs {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.auth-provider-stack {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.provider-button {
|
||||
text-decoration: none;
|
||||
display: grid;
|
||||
grid-template-columns: 46px 1fr;
|
||||
align-items: center;
|
||||
gap: 0.9rem;
|
||||
border: 1px solid rgba(39, 105, 179, 0.12);
|
||||
border-radius: 18px;
|
||||
padding: 0.85rem 0.95rem;
|
||||
background: rgba(255, 255, 255, 0.88);
|
||||
box-shadow: 0 12px 24px rgba(39, 105, 179, 0.08);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.provider-button-mark {
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
border-radius: 14px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: #ffffff;
|
||||
border: 1px solid rgba(31, 42, 42, 0.08);
|
||||
color: #1f2328;
|
||||
}
|
||||
|
||||
.provider-button-copy {
|
||||
display: grid;
|
||||
gap: 0.15rem;
|
||||
}
|
||||
|
||||
.provider-button-copy small {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.provider-icon-svg {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.provider-icon-apple {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.provider-google {
|
||||
background: #ffffff;
|
||||
border-color: rgba(66, 133, 244, 0.18);
|
||||
}
|
||||
|
||||
.provider-microsoft {
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(246, 250, 255, 0.92));
|
||||
border-color: rgba(0, 164, 239, 0.18);
|
||||
}
|
||||
|
||||
.provider-apple {
|
||||
background: linear-gradient(180deg, #1f2328, #111418);
|
||||
border-color: rgba(17, 20, 24, 0.92);
|
||||
color: #f7f7f5;
|
||||
}
|
||||
|
||||
.provider-apple .provider-button-mark {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
color: #f7f7f5;
|
||||
}
|
||||
|
||||
.provider-apple .provider-button-copy small {
|
||||
color: rgba(247, 247, 245, 0.76);
|
||||
}
|
||||
|
||||
.provider-button.disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.provider-button:not(.disabled):hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 16px 28px rgba(39, 105, 179, 0.12);
|
||||
}
|
||||
|
||||
.stack-grid {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
@@ -202,8 +322,9 @@ textarea {
|
||||
}
|
||||
|
||||
.hero-stats {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-columns: minmax(220px, 280px);
|
||||
align-self: end;
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
.hero-stats article,
|
||||
@@ -228,8 +349,7 @@ textarea {
|
||||
}
|
||||
|
||||
.hero-stats article::before,
|
||||
.bird-card::before,
|
||||
.chart-card::before {
|
||||
.bird-card::before {
|
||||
content: "";
|
||||
display: block;
|
||||
height: 5px;
|
||||
@@ -286,6 +406,42 @@ textarea {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.workspace-switcher {
|
||||
display: grid;
|
||||
gap: 0.9rem;
|
||||
}
|
||||
|
||||
.workspace-switcher-header {
|
||||
display: grid;
|
||||
gap: 0.2rem;
|
||||
}
|
||||
|
||||
.workspace-switcher-header small,
|
||||
.workspace-switcher-item small {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.workspace-switcher-list {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.workspace-switcher-item {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border: 1px solid rgba(39, 105, 179, 0.12);
|
||||
border-radius: 18px;
|
||||
padding: 0.85rem 0.95rem;
|
||||
background: rgba(255, 255, 255, 0.58);
|
||||
display: grid;
|
||||
gap: 0.2rem;
|
||||
}
|
||||
|
||||
.workspace-switcher-item.active {
|
||||
background: linear-gradient(135deg, rgba(203, 58, 53, 0.16), rgba(39, 105, 179, 0.18));
|
||||
border-color: rgba(39, 105, 179, 0.24);
|
||||
}
|
||||
|
||||
.bird-list {
|
||||
display: grid;
|
||||
gap: 0.9rem;
|
||||
@@ -298,6 +454,16 @@ textarea {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bird-card-copy {
|
||||
display: grid;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.bird-card-copy span {
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.bird-avatar,
|
||||
.profile-photo {
|
||||
width: 56px;
|
||||
@@ -360,10 +526,6 @@ textarea {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chart-card::before {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.overview-chart-card::before {
|
||||
display: none;
|
||||
}
|
||||
@@ -516,6 +678,23 @@ label {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.toggle-card {
|
||||
display: grid;
|
||||
gap: 0.45rem;
|
||||
padding: 1rem;
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, rgba(255, 252, 247, 0.9), rgba(240, 248, 244, 0.82));
|
||||
border: 1px solid rgba(39, 105, 179, 0.1);
|
||||
}
|
||||
|
||||
.toggle-card input[type="checkbox"] {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-top: 0.15rem;
|
||||
padding: 0;
|
||||
accent-color: var(--accent-green);
|
||||
}
|
||||
|
||||
.primary-button {
|
||||
border: 0;
|
||||
border-radius: 18px;
|
||||
@@ -616,11 +795,48 @@ label {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.crop-preview-frame {
|
||||
width: 112px;
|
||||
height: 112px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border-radius: 28px;
|
||||
border: 1px solid rgba(39, 105, 179, 0.16);
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
cursor: grab;
|
||||
touch-action: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.crop-preview-image {
|
||||
position: absolute;
|
||||
object-fit: cover;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.crop-preview-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border: 2px solid rgba(255, 255, 255, 0.78);
|
||||
border-radius: 28px;
|
||||
box-shadow: inset 0 0 0 999px rgba(31, 42, 42, 0.08);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.crop-preview-frame.dragging {
|
||||
cursor: grabbing;
|
||||
}
|
||||
|
||||
.photo-copy {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.crop-control-stack {
|
||||
display: grid;
|
||||
gap: 0.85rem;
|
||||
}
|
||||
|
||||
.file-picker input[type="file"] {
|
||||
margin-top: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
@@ -628,6 +844,7 @@ label {
|
||||
|
||||
@media (max-width: 980px) {
|
||||
.app-shell,
|
||||
.auth-panel,
|
||||
.hero-card,
|
||||
.dashboard-grid,
|
||||
.forms-grid,
|
||||
|
||||
Reference in New Issue
Block a user