nakama/frontend/src/components/PostMenu.css

232 lines
3.9 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* Блокирует ВСЕ клики под собой */
.post-menu-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: transparent;
z-index: 10500;
display: flex;
align-items: flex-start;
justify-content: flex-start;
overflow: hidden;
touch-action: none;
overscroll-behavior: contain;
}
.report-modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: var(--bg-secondary);
z-index: 10600;
display: flex;
flex-direction: column;
touch-action: none;
overscroll-behavior: contain;
}
.menu-content {
background: var(--bg-secondary);
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
padding: 4px;
margin-top: 8px;
min-width: 140px;
z-index: 10501;
}
.menu-items {
display: flex;
flex-direction: column;
gap: 2px;
}
.menu-item {
width: 100%;
padding: 10px 12px;
background: transparent;
border: none;
display: flex;
align-items: center;
gap: 10px;
color: var(--text-primary);
font-size: 14px;
font-weight: 500;
border-radius: 8px;
cursor: pointer;
transition: background 0.2s;
}
.menu-item:hover {
background: var(--bg-primary);
}
.menu-item:active {
opacity: 0.7;
}
.menu-close-btn {
width: 24px;
height: 24px;
border-radius: 50%;
background: transparent;
color: var(--text-primary);
display: flex;
align-items: center;
justify-content: center;
border: none;
cursor: pointer;
padding: 0;
}
.menu-close-btn svg {
stroke: currentColor;
}
.menu-item svg {
stroke: currentColor;
flex-shrink: 0;
}
.menu-item.danger {
color: #FF3B30;
}
.menu-item.danger svg {
stroke: #FF3B30;
}
/* Edit modal styles */
.edit-menu-content {
background: var(--bg-secondary);
border-radius: 16px;
padding: 16px;
max-width: 90vw;
width: 400px;
max-height: 80vh;
display: flex;
flex-direction: column;
gap: 12px;
}
.edit-menu-header {
display: flex;
align-items: center;
justify-content: space-between;
}
.edit-menu-header h3 {
font-size: 18px;
font-weight: 600;
color: var(--text-primary);
margin: 0;
}
.edit-content-input {
width: 100%;
padding: 12px;
border: 1px solid var(--divider-color);
border-radius: 12px;
background: var(--bg-primary);
color: var(--text-primary);
font-size: 15px;
line-height: 1.5;
resize: none;
font-family: inherit;
}
.edit-menu-actions {
display: flex;
gap: 8px;
justify-content: flex-end;
}
.edit-cancel-btn {
padding: 10px 16px;
border-radius: 8px;
background: var(--bg-primary);
color: var(--text-primary);
border: 1px solid var(--divider-color);
font-size: 14px;
font-weight: 500;
cursor: pointer;
}
.edit-save-btn {
padding: 10px 16px;
border-radius: 8px;
background: var(--button-accent);
color: white;
border: none;
font-size: 14px;
font-weight: 600;
cursor: pointer;
}
.edit-save-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.report-modal-header {
padding: 16px;
border-bottom: 1px solid var(--divider-color);
display: flex;
align-items: center;
justify-content: space-between;
}
.report-modal-header h2 {
font-size: 18px;
font-weight: 600;
color: var(--text-primary);
}
.report-modal-body {
flex: 1;
padding: 16px;
}
.report-modal-body textarea {
width: 100%;
height: 200px;
padding: 12px;
border: 1px solid var(--border-color);
border-radius: 12px;
background: var(--bg-primary);
color: var(--text-primary);
font-size: 15px;
line-height: 1.5;
resize: none;
/* Убираем pointer-events чтобы клики работали */
}
.submit-btn {
padding: 8px 16px;
border-radius: 20px;
background: #1C1C1E;
color: white;
font-size: 14px;
font-weight: 600;
border: none;
cursor: pointer;
/* Убираем pointer-events чтобы клики работали */
}
.submit-btn:disabled {
opacity: 0.5;
}
[data-theme="dark"] .submit-btn {
background: #FFFFFF;
color: #000000;
}
[data-theme="dark"] .submit-btn:disabled {
opacity: 0.5;
}