-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathoffers.css
More file actions
8 lines (8 loc) · 6.85 KB
/
Copy pathoffers.css
File metadata and controls
8 lines (8 loc) · 6.85 KB
1
2
3
4
5
6
7
8
:root{--book-line:rgba(255,255,255,.1);--book-muted:#a4a39f}.orderbook-shell{width:min(1380px,calc(100% - 32px));margin:0 auto;padding:76px 0 100px;color:#f5f5f2}.orderbook-header{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;padding:24px 0 28px;border-bottom:1px solid var(--book-line)}.orderbook-header h1{margin:0;font-size:clamp(2.1rem,5vw,4.8rem);line-height:.95;letter-spacing:0}.orderbook-header p{max-width:620px;margin:12px 0 0;color:var(--book-muted)}.orderbook-header .eyebrow{margin:0 0 10px;color:#f2a900;font:700 .75rem/1 sans-serif;text-transform:uppercase;letter-spacing:0}.snapshot-meta{display:flex;align-items:center;gap:9px;min-width:max-content;color:var(--book-muted);font-size:.82rem}.live-dot{width:7px;height:7px;border-radius:50%;background:#55c98b;box-shadow:0 0 10px rgba(85,201,139,.6)}.icon-button{width:36px;height:36px;display:grid;place-items:center;color:#eee;background:#202223;border:1px solid var(--book-line);border-radius:50%;cursor:pointer}.icon-button.spinning i{animation:book-spin .7s linear infinite}@keyframes book-spin{to{transform:rotate(360deg)}}
.market-stats{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--book-line)}.market-stats div{display:flex;flex-direction:column;padding:22px 18px;border-right:1px solid var(--book-line)}.market-stats div:first-child{padding-left:0}.market-stats div:last-child{border-right:0}.market-stats span{font:750 clamp(1.35rem,3vw,2.2rem)/1 sans-serif;color:#fff}.market-stats small{margin-top:7px;color:var(--book-muted);text-transform:uppercase;font-size:.68rem}
.orderbook-controls{display:grid;grid-template-columns:1.25fr repeat(5,minmax(120px,1fr));gap:8px;padding:18px 0;position:sticky;top:0;z-index:5;background:rgba(16,17,18,.94);backdrop-filter:blur(14px)}.orderbook-controls label{min-width:0}.orderbook-controls label>span{display:block;margin:0 0 5px 3px;color:var(--book-muted);font-size:.68rem;text-transform:uppercase}.orderbook-controls select,.orderbook-controls input{width:100%;height:42px;box-sizing:border-box;padding:0 11px;color:#eee;background:#1b1d1e;border:1px solid var(--book-line);border-radius:5px;font:inherit}.orderbook-controls select:focus,.orderbook-controls input:focus{outline:1px solid #f2a900;border-color:#f2a900}.side-switch{display:grid;grid-template-columns:1fr 1fr;align-self:end;height:42px;padding:3px;background:#1b1d1e;border:1px solid var(--book-line);border-radius:5px}.side-switch button{color:var(--book-muted);background:transparent;border:0;border-radius:3px;font-weight:700;cursor:pointer}.side-switch button.active{color:#111;background:#f2a900}
.source-health{display:flex;gap:7px;overflow-x:auto;padding:2px 0 18px;scrollbar-width:none}.source-pill{display:flex;align-items:center;gap:7px;min-width:max-content;padding:7px 10px;color:#cfceca;background:transparent;border:1px solid var(--book-line);border-radius:20px;cursor:pointer}.source-pill>span{width:6px;height:6px;border-radius:50%;background:#555}.source-pill.available>span{background:#55c98b}.source-pill b{color:#777;font-size:.72rem}.offers-container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.offer-card{--source:#f2a900;position:relative;min-width:0;padding:17px;overflow:hidden;background:#181a1b;border:1px solid var(--book-line);border-radius:7px;transition:transform .18s ease,border-color .18s ease,background .18s ease}.offer-card::before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--source)}.offer-card:hover{transform:translateY(-2px);background:#1c1e1f;border-color:rgba(242,169,0,.45)}.source-peach{--source:#f29a8b}.source-robo{--source:#72a7ff}.source-mostro{--source:#a98aff}.source-lnp{--source:#55c98b}.source-bisq{--source:#8acb4a}.offer-topline{display:flex;align-items:center;gap:8px;min-height:23px}.source-mark{color:var(--source);font-size:.78rem;font-weight:800;text-transform:uppercase}.side-label,.online-label{padding:3px 6px;color:#94938f;background:#232526;border-radius:3px;font-size:.61rem;font-weight:700}.online-label{margin-left:auto;color:#72d99e}
.offer-primary{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:25px 0 18px}.offer-primary small,.offer-range small{display:block;margin-bottom:5px;color:var(--book-muted);font-size:.7rem}.offer-primary strong{display:block;color:#fff;font-size:clamp(1.2rem,2vw,1.65rem);line-height:1.05}.offer-primary .unknown{font-size:1rem;color:#c8c7c3}.rate-stack{display:grid;justify-items:end;gap:5px}.premium,.bond{padding:5px 7px;color:#f0b2a4;background:rgba(184,82,62,.13);border-radius:4px;font-size:.76rem;font-weight:700;white-space:nowrap}.bond{color:#aaa;background:#232526}.premium.discount{color:#75d7a0;background:rgba(65,157,105,.13)}.premium span{color:#777;font-weight:500}.offer-range{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--book-line);border-bottom:1px solid var(--book-line)}.offer-range b{display:block;overflow:hidden;color:#e6e5e1;font-size:.82rem;text-overflow:ellipsis;white-space:nowrap}.method-row{display:flex;gap:5px;min-height:25px;padding:13px 0;overflow:hidden}.method-row span{max-width:130px;padding:4px 7px;overflow:hidden;color:#b8b7b3;background:#232526;border-radius:3px;font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}.method-row .muted{background:transparent;padding-left:0;color:#777}.offer-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.trader-line{display:flex;flex-wrap:wrap;gap:5px 9px;min-width:0;color:#777;font-size:.67rem;text-transform:capitalize}.offer-footer a{flex:0 0 auto;color:#f2a900;font-size:.78rem;font-weight:750;text-decoration:none}.offer-footer a i{margin-left:3px}
.loading,.error,.empty-book{grid-column:1/-1;padding:70px 20px;text-align:center;color:var(--book-muted);background:transparent;border:1px dashed var(--book-line);border-radius:7px}.loading[hidden],.error[hidden]{display:none}.empty-book i{font-size:2rem;color:#f2a900}.empty-book h2{margin:12px 0 5px;color:#eee;font-size:1.2rem}.empty-book p{margin:0}.load-more-btn{display:block;margin:20px auto 0;padding:11px 22px;color:#111;background:#f2a900;border:0;border-radius:4px;font-weight:800;cursor:pointer}.load-more-btn[hidden]{display:none}.affiliate-note{margin:24px 0 0;color:#686966;font-size:.7rem;text-align:center}
@media(max-width:1050px){.orderbook-controls{grid-template-columns:repeat(3,1fr)}.offers-container{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.orderbook-shell{width:min(100% - 20px,1380px);padding-top:64px}.orderbook-header{display:block}.snapshot-meta{margin-top:18px}.market-stats{grid-template-columns:repeat(2,1fr)}.market-stats div:nth-child(2){border-right:0}.market-stats div:nth-child(-n+2){border-bottom:1px solid var(--book-line)}.orderbook-controls{grid-template-columns:1fr 1fr;top:0;padding:11px 0}.side-switch{grid-column:1/-1}.offers-container{grid-template-columns:1fr}.offer-card{padding:15px}}