Release Healer Man 0.1.16
This commit is contained in:
1 parent
f49e54f35f
commit
b57d2b2839
89 files changed
+6055
-17
No files matched your search
+352
@@ -3094,3 +3094,355 @@ button.equipment-slot:hover { background: rgba(174,191,131,.1); }
|
||||
@media (max-height: 560px) and (min-width: 601px) {
|
||||
.gm-review-card { top: auto; bottom: max(62px, calc(env(safe-area-inset-bottom) + 50px)); }
|
||||
}
|
||||
|
||||
/* Rated arenas */
|
||||
.arena-select-screen {
|
||||
display: grid;
|
||||
grid-template: 4.4rem 1fr 2.6rem / 17.5rem 1fr;
|
||||
min-height: 100%;
|
||||
color: #eef5e8;
|
||||
}
|
||||
|
||||
.arena-select-header {
|
||||
grid-column: 1 / -1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
padding: .65rem 1rem;
|
||||
border-bottom: 1px solid rgba(205, 223, 186, .18);
|
||||
background: rgba(6, 15, 12, .86);
|
||||
}
|
||||
|
||||
.arena-select-header > div,
|
||||
.arena-select-header > p {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: .7rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.arena-select-header p {
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
gap: .1rem;
|
||||
}
|
||||
|
||||
.arena-select-sidebar {
|
||||
padding: .9rem;
|
||||
overflow: auto;
|
||||
border-right: 1px solid rgba(205, 223, 186, .16);
|
||||
background: rgba(8, 20, 16, .88);
|
||||
}
|
||||
|
||||
.arena-segmented {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: .25rem;
|
||||
margin: .35rem 0 1rem;
|
||||
}
|
||||
|
||||
.arena-segmented:first-of-type {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
.arena-segmented button,
|
||||
.arena-mode-list button,
|
||||
.arena-stage-grid button,
|
||||
.arena-loadout-editor button,
|
||||
.arena-loadout-editor input,
|
||||
.arena-loadout-editor select {
|
||||
border: 1px solid rgba(198, 219, 177, .2);
|
||||
color: inherit;
|
||||
background: rgba(20, 38, 30, .9);
|
||||
}
|
||||
|
||||
.arena-segmented button {
|
||||
padding: .55rem .3rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.arena-segmented button.is-active,
|
||||
.arena-mode-list button.is-active,
|
||||
.arena-stage-grid button.is-active {
|
||||
border-color: #d8b962;
|
||||
background: linear-gradient(135deg, rgba(127, 102, 38, .65), rgba(29, 57, 42, .9));
|
||||
box-shadow: inset 0 0 0 1px rgba(255, 232, 154, .16);
|
||||
}
|
||||
|
||||
.arena-mode-list {
|
||||
display: grid;
|
||||
gap: .35rem;
|
||||
margin: .35rem 0 1rem;
|
||||
}
|
||||
|
||||
.arena-mode-list button {
|
||||
display: grid;
|
||||
gap: .18rem;
|
||||
padding: .6rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.arena-mode-list small,
|
||||
.arena-stage-grid small {
|
||||
color: #aeb9ab;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.arena-select-main {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr);
|
||||
gap: 1rem;
|
||||
padding: 1rem;
|
||||
overflow: auto;
|
||||
background: radial-gradient(circle at 25% 20%, rgba(54, 88, 59, .28), transparent 45%);
|
||||
}
|
||||
|
||||
.arena-stage-browser,
|
||||
.arena-configuration {
|
||||
min-width: 0;
|
||||
padding: .9rem;
|
||||
border: 1px solid rgba(205, 223, 186, .16);
|
||||
background: rgba(8, 18, 14, .76);
|
||||
}
|
||||
|
||||
.arena-stage-browser > header,
|
||||
.arena-configuration > header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
gap: .6rem;
|
||||
}
|
||||
|
||||
.arena-stage-browser h1,
|
||||
.arena-configuration h2 {
|
||||
margin: .12rem 0 .65rem;
|
||||
font-family: Georgia, serif;
|
||||
}
|
||||
|
||||
.arena-status {
|
||||
padding: .28rem .45rem;
|
||||
border: 1px solid currentColor;
|
||||
color: #d8b962;
|
||||
font-size: .65rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: .08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.arena-status--validated { color: #88d49a; }
|
||||
.arena-status--repair-required { color: #dc8d73; }
|
||||
|
||||
.arena-stage-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: .35rem;
|
||||
}
|
||||
|
||||
.arena-stage-grid button {
|
||||
display: grid;
|
||||
grid-template-columns: 2rem 1fr;
|
||||
align-items: center;
|
||||
gap: .4rem;
|
||||
padding: .55rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.arena-stage-grid button > b {
|
||||
color: #d8b962;
|
||||
font: 700 1rem Georgia, serif;
|
||||
}
|
||||
|
||||
.arena-stage-grid button > span {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.arena-stage-note {
|
||||
margin: .7rem 0 0;
|
||||
color: #c7cec2;
|
||||
font-size: .74rem;
|
||||
}
|
||||
|
||||
.arena-configuration {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: .7rem;
|
||||
}
|
||||
|
||||
.arena-configuration input[type="range"] { width: 100%; accent-color: #d8b962; }
|
||||
|
||||
.arena-configuration dl {
|
||||
display: grid;
|
||||
gap: .3rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.arena-configuration dl div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(205, 223, 186, .12);
|
||||
}
|
||||
|
||||
.arena-loadout-editor,
|
||||
.arena-loadout-editor label {
|
||||
display: grid;
|
||||
gap: .3rem;
|
||||
}
|
||||
|
||||
.arena-loadout-editor {
|
||||
gap: .55rem;
|
||||
}
|
||||
|
||||
.arena-loadout-editor label {
|
||||
color: #aeb9ab;
|
||||
font-size: .7rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.arena-loadout-editor input,
|
||||
.arena-loadout-editor select,
|
||||
.arena-loadout-editor button {
|
||||
padding: .48rem;
|
||||
}
|
||||
|
||||
.arena-queue-button {
|
||||
display: grid;
|
||||
gap: .15rem;
|
||||
margin-top: auto;
|
||||
padding: .8rem;
|
||||
}
|
||||
|
||||
.arena-runtime {
|
||||
position: relative;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
color: #f2f5ee;
|
||||
background: #07100d;
|
||||
}
|
||||
|
||||
.arena-world,
|
||||
.arena-world > div { position: absolute; inset: 0; }
|
||||
|
||||
.arena-match-header {
|
||||
position: absolute;
|
||||
top: .7rem;
|
||||
left: 50%;
|
||||
display: flex;
|
||||
gap: .7rem;
|
||||
align-items: center;
|
||||
padding: .45rem .7rem;
|
||||
border: 1px solid rgba(225, 236, 214, .22);
|
||||
background: rgba(5, 12, 9, .82);
|
||||
transform: translateX(-50%);
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
.arena-match-header span,
|
||||
.arena-match-header em { color: #bac5b7; font-size: .72rem; font-style: normal; }
|
||||
|
||||
.arena-team-frames {
|
||||
position: absolute;
|
||||
top: 4.2rem;
|
||||
display: grid;
|
||||
width: min(16rem, 27vw);
|
||||
gap: .3rem;
|
||||
}
|
||||
|
||||
.arena-team-frames--0 { left: .7rem; }
|
||||
.arena-team-frames--1 { right: .7rem; }
|
||||
|
||||
.arena-team-frames button {
|
||||
display: grid;
|
||||
grid-template: auto .28rem / 1fr auto;
|
||||
gap: .22rem .6rem;
|
||||
padding: .42rem;
|
||||
border: 1px solid rgba(215, 230, 204, .2);
|
||||
color: inherit;
|
||||
text-align: left;
|
||||
background: rgba(5, 12, 9, .82);
|
||||
}
|
||||
|
||||
.arena-team-frames--1 button { text-align: right; }
|
||||
.arena-team-frames button.is-dead { opacity: .38; filter: grayscale(1); }
|
||||
.arena-team-frames button > span { display: grid; }
|
||||
.arena-team-frames button small { color: #acb8aa; }
|
||||
.arena-team-frames button i { grid-column: 1 / -1; overflow: hidden; background: #241b1b; }
|
||||
.arena-team-frames button i b { display: block; height: 100%; background: #54a55d; transition: width .1s linear; }
|
||||
.arena-team-frames button em { font-style: normal; }
|
||||
|
||||
.arena-countdown {
|
||||
position: absolute;
|
||||
inset: 50% auto auto 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
min-width: 13rem;
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(220, 190, 99, .5);
|
||||
background: rgba(6, 13, 10, .88);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.arena-countdown strong { color: #e1c46f; font: 700 3rem Georgia, serif; }
|
||||
|
||||
.arena-action-bar {
|
||||
position: absolute;
|
||||
bottom: .8rem;
|
||||
left: 50%;
|
||||
display: flex;
|
||||
gap: .3rem;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.arena-action-bar button {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 4.2rem;
|
||||
min-height: 3.6rem;
|
||||
border: 1px solid rgba(221, 232, 210, .25);
|
||||
color: inherit;
|
||||
background: rgba(5, 12, 9, .88);
|
||||
}
|
||||
|
||||
.arena-action-bar button b { color: #dfc16b; }
|
||||
.arena-action-bar button span { font-size: .65rem; text-transform: capitalize; }
|
||||
|
||||
.arena-exit {
|
||||
position: absolute;
|
||||
right: .7rem;
|
||||
bottom: .8rem;
|
||||
padding: .5rem;
|
||||
border: 1px solid rgba(221, 232, 210, .2);
|
||||
color: #d2d9cd;
|
||||
background: rgba(5, 12, 9, .8);
|
||||
}
|
||||
|
||||
.arena-result-panel {
|
||||
position: absolute;
|
||||
inset: 50% auto auto 50%;
|
||||
width: min(27rem, 85vw);
|
||||
padding: 1.25rem;
|
||||
border: 1px solid #c4a95d;
|
||||
text-align: center;
|
||||
background: rgba(7, 15, 11, .96);
|
||||
transform: translate(-50%, -50%);
|
||||
box-shadow: 0 1rem 5rem rgba(0, 0, 0, .55);
|
||||
}
|
||||
|
||||
.arena-result-panel h1 { margin: .2rem 0 .7rem; color: #e0c26c; font: 700 2.5rem Georgia, serif; }
|
||||
|
||||
@media (max-width: 760px) {
|
||||
.arena-select-screen { grid-template: auto auto 1fr auto / 1fr; }
|
||||
.arena-select-header { grid-column: 1; }
|
||||
.arena-select-sidebar { border-right: 0; border-bottom: 1px solid rgba(205, 223, 186, .16); }
|
||||
.arena-select-main { grid-template-columns: 1fr; }
|
||||
.arena-team-frames { width: 42vw; }
|
||||
.arena-match-header { left: .55rem; gap: .35rem; transform: none; }
|
||||
.arena-match-header span { display: none; }
|
||||
.arena-action-bar { bottom: .55rem; gap: .2rem; }
|
||||
.arena-action-bar button { width: 3rem; min-height: 3.25rem; }
|
||||
.arena-exit { inset: .55rem .55rem auto auto; max-width: 5.4rem; font-size: .65rem; }
|
||||
}
|
||||
Reference in new issue
Block a user