(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol.
Something went wrong. Try again.
CSS
at ui-refactor
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; font-size: 0.85rem; font-weight: 500; border-radius: var(--radius-md); transition: all 0.15s ease; white-space: nowrap; border: none; cursor: pointer;}
.btn-primary { background: var(--accent); color: white;}
.btn-primary:hover { background: var(--accent-hover); box-shadow: var(--shadow-glow);}
.btn-secondary { background: var(--bg-tertiary); color: var(--text-primary); border: 1px solid var(--border);}
.btn-secondary:hover { background: var(--bg-hover); border-color: var(--border-hover);}
.btn-ghost { color: var(--text-secondary); padding: 8px 12px; background: transparent;}
.btn-ghost:hover { color: var(--text-primary); background: var(--bg-tertiary);}
.btn-bluesky { background: #0085ff; color: white; display: flex; align-items: center; justify-content: center; gap: 8px; transition: all 0.15s;}
.btn-bluesky:hover { background: #0070dd;}
.btn-sm { padding: 6px 12px; font-size: 0.8rem;}
.btn-text { background: none; border: none; color: var(--text-secondary); font-size: 0.85rem; padding: 6px 10px; cursor: pointer; transition: color 0.15s; border-radius: var(--radius-sm);}
.btn-text:hover { color: var(--text-primary); background: var(--bg-tertiary);}
.btn-block { width: 100%; text-align: left; padding: 10px 14px; color: var(--text-secondary); background: var(--bg-tertiary); border-radius: var(--radius-md); margin-top: 8px; font-size: 0.85rem; cursor: pointer; transition: all 0.15s; border: 1px solid transparent;}
.btn-block:hover { background: var(--bg-hover); color: var(--text-primary); border-color: var(--border);}
.btn-icon-danger { padding: 8px; background: rgba(255, 69, 58, 0.1); color: var(--error); border: none; border-radius: var(--radius-md); cursor: pointer; transition: all 0.15s ease; display: flex; align-items: center; justify-content: center;}
.btn-icon-danger:hover { background: var(--error); color: white;}
.btn-danger { background: rgba(255, 69, 58, 0.1); color: var(--error); border: 1px solid rgba(255, 69, 58, 0.2);}
.btn-danger:hover { background: var(--error); color: white; border-color: var(--error);}
.action-buttons { display: flex; gap: var(--spacing-sm); flex-wrap: wrap;}
.action-buttons-end { display: flex; justify-content: flex-end; gap: var(--spacing-sm);}