flex-direction
flex-direction(...)Description
Documentation for flex-direction.
Real-World Examples
Practical code examples showing how flex-direction is used in real projects.
border-radius: var(--ai-radius-xl) var(--ai-radius-xl) 0 0;
box-shadow: var(--ai-shadow-xl);
transform: translateY(100%);
transition: var(--ai-transition);
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
}
.ai-modal-overlay.active .ai-container {
transform: translateY(0);
}
/* Drag Handle */
.ai-drag-handle {
position: absolute;
top: var(--ai-spacing-sm);
left: 50%;
transform: translateX(-50%);
width: 40px;
height: 4px;
background: var(--ai-text-muted);
border-radius: 2px;
cursor: grab;
if (!Array.isArray(users)) throw new Error(users.message || 'Failed');
let html = '<div style="display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:15px;">';
users.forEach(u => {
html += `
<a href="${u.html_url}" target="_blank" style="text-decoration:none;color:var(--text);background:rgba...
<img src="${u.avatar_url}" style="width:50px;height:50px;border-radius:50%;margin-bottom:10px;">
<div style="font-weight:600;margin-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:...
<div style="font-size:11px;color:var(--text-dim);">${u.contributions} commits</div>
</a>`;
});
html += '</div>';
container.innerHTML = html;
statusDataCache.contributors = true;
} catch(e) { container.innerHTML = `<div style="color:red">Error: ${e.message}</div>`; }
};
const loadStatusIssues = async () => {
if (statusDataCache.issues) return;
const { owner, repo } = currentRepoInfo;
const container = $('#status-tab-issues');
try {
const issues = await fetchWithProxy(`https://api.github.com/repos/${owner}/${repo}/issues?state=open&sort=upd...
if (!Array.isArray(issues)) throw new Error(issues.message || 'Failed');