YunFeiyang
/
noname
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

pref: format @/layout.

This commit is contained in:
Rintim 2024-04-16 02:38:11 +08:00
parent 5427da93cb
commit ed7bbd57e5
No known key found for this signature in database
GPG Key ID: BE9E1EA615BACFCF
17 changed files with 7532 additions and 6373 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

592
layout/default/codemirror.css
View File

@ -6,7 +6,7 @@
height: 100%; height: 100%;
color: black; color: black;
} }
.CodeMirror div{ .CodeMirror div {
display: block; display: block;
text-shadow: none; text-shadow: none;
transition: all 0s; transition: all 0s;
@ -22,7 +22,8 @@
padding: 0 4px; /* Horizontal padding of content */ padding: 0 4px; /* Horizontal padding of content */
} }
.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler { .CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
background-color: white; /* The little square between H and V scrollbars */ background-color: white; /* The little square between H and V scrollbars */
} }
@ -33,7 +34,8 @@
background-color: #f7f7f7; background-color: #f7f7f7;
white-space: nowrap; white-space: nowrap;
} }
.CodeMirror-linenumbers {} .CodeMirror-linenumbers {
}
.CodeMirror-linenumber { .CodeMirror-linenumber {
padding: 0 3px 0 5px; padding: 0 3px 0 5px;
min-width: 20px; min-width: 20px;
@ -42,8 +44,12 @@
white-space: nowrap; white-space: nowrap;
} }
.CodeMirror-guttermarker { color: black; } .CodeMirror-guttermarker {
.CodeMirror-guttermarker-subtle { color: #999; } color: black;
}
.CodeMirror-guttermarker-subtle {
color: #999;
}
/* CURSOR */ /* CURSOR */
@ -74,81 +80,167 @@
background-color: #7e7; background-color: #7e7;
} }
@-moz-keyframes blink { @-moz-keyframes blink {
0% {} 0% {
50% { background-color: transparent; } }
100% {} 50% {
background-color: transparent;
}
100% {
}
} }
@-webkit-keyframes blink { @-webkit-keyframes blink {
0% {} 0% {
50% { background-color: transparent; } }
100% {} 50% {
background-color: transparent;
}
100% {
}
} }
@keyframes blink { @keyframes blink {
0% {} 0% {
50% { background-color: transparent; } }
100% {} 50% {
background-color: transparent;
}
100% {
}
} }
/* Can style cursor different in overwrite (non-insert) mode */ /* Can style cursor different in overwrite (non-insert) mode */
.CodeMirror-overwrite .CodeMirror-cursor {} .CodeMirror-overwrite .CodeMirror-cursor {
}
.cm-tab { display: inline-block; text-decoration: inherit; } .cm-tab {
display: inline-block;
text-decoration: inherit;
}
.CodeMirror .CodeMirror-rulers { .CodeMirror .CodeMirror-rulers {
position: absolute; position: absolute;
left: 0; right: 0; top: -50px; bottom: -20px; left: 0;
right: 0;
top: -50px;
bottom: -20px;
overflow: hidden; overflow: hidden;
} }
.CodeMirror .CodeMirror-ruler { .CodeMirror .CodeMirror-ruler {
border-left: 1px solid #ccc; border-left: 1px solid #ccc;
top: 0; bottom: 0; top: 0;
bottom: 0;
position: absolute; position: absolute;
} }
/* DEFAULT THEME */ /* DEFAULT THEME */
.cm-s-default .cm-header {color: blue;} .cm-s-default .cm-header {
.cm-s-default .cm-quote {color: #090;} color: blue;
.cm-negative {color: #d44;} }
.cm-positive {color: #292;} .cm-s-default .cm-quote {
.cm-header, .cm-strong {font-weight: bold;} color: #090;
.cm-em {font-style: italic;} }
.cm-link {text-decoration: underline;} .cm-negative {
.cm-strikethrough {text-decoration: line-through;} color: #d44;
}
.cm-positive {
color: #292;
}
.cm-header,
.cm-strong {
font-weight: bold;
}
.cm-em {
font-style: italic;
}
.cm-link {
text-decoration: underline;
}
.cm-strikethrough {
text-decoration: line-through;
}
.cm-s-default .cm-keyword {color: #708;} .cm-s-default .cm-keyword {
.cm-s-default .cm-atom {color: #219;} color: #708;
.cm-s-default .cm-number {color: #164;} }
.cm-s-default .cm-def {color: #00f;} .cm-s-default .cm-atom {
color: #219;
}
.cm-s-default .cm-number {
color: #164;
}
.cm-s-default .cm-def {
color: #00f;
}
.cm-s-default .cm-variable, .cm-s-default .cm-variable,
.cm-s-default .cm-punctuation, .cm-s-default .cm-punctuation,
.cm-s-default .cm-property, .cm-s-default .cm-property,
.cm-s-default .cm-operator {} .cm-s-default .cm-operator {
.cm-s-default .cm-variable-2 {color: #05a;} }
.cm-s-default .cm-variable-3 {color: #085;} .cm-s-default .cm-variable-2 {
.cm-s-default .cm-comment {color: #a50;} color: #05a;
.cm-s-default .cm-string {color: #a11;} }
.cm-s-default .cm-string-2 {color: #f50;} .cm-s-default .cm-variable-3 {
.cm-s-default .cm-meta {color: #555;} color: #085;
.cm-s-default .cm-qualifier {color: #555;} }
.cm-s-default .cm-builtin {color: #30a;} .cm-s-default .cm-comment {
.cm-s-default .cm-bracket {color: #997;} color: #a50;
.cm-s-default .cm-tag {color: #170;} }
.cm-s-default .cm-attribute {color: #00c;} .cm-s-default .cm-string {
.cm-s-default .cm-hr {color: #999;} color: #a11;
.cm-s-default .cm-link {color: #00c;} }
.cm-s-default .cm-string-2 {
color: #f50;
}
.cm-s-default .cm-meta {
color: #555;
}
.cm-s-default .cm-qualifier {
color: #555;
}
.cm-s-default .cm-builtin {
color: #30a;
}
.cm-s-default .cm-bracket {
color: #997;
}
.cm-s-default .cm-tag {
color: #170;
}
.cm-s-default .cm-attribute {
color: #00c;
}
.cm-s-default .cm-hr {
color: #999;
}
.cm-s-default .cm-link {
color: #00c;
}
.cm-s-default .cm-error {color: #f00;} .cm-s-default .cm-error {
.cm-invalidchar {color: #f00;} color: #f00;
}
.cm-invalidchar {
color: #f00;
}
.CodeMirror-composing { border-bottom: 2px solid; } .CodeMirror-composing {
border-bottom: 2px solid;
}
/* Default styles for common addons */ /* Default styles for common addons */
div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;} div.CodeMirror span.CodeMirror-matchingbracket {
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;} color: #0f0;
.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); } }
.CodeMirror-activeline-background {background: #e8f2ff;} div.CodeMirror span.CodeMirror-nonmatchingbracket {
color: #f22;
}
.CodeMirror-matchingtag {
background: rgba(255, 150, 0, 0.3);
}
.CodeMirror-activeline-background {
background: #e8f2ff;
}
/* STOP */ /* STOP */
@ -165,7 +257,8 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
overflow: scroll !important; /* Things will break if this is overridden */ overflow: scroll !important; /* Things will break if this is overridden */
/* 30px is the magic margin used to hide the element's real scrollbars */ /* 30px is the magic margin used to hide the element's real scrollbars */
/* See overflow: hidden in .CodeMirror */ /* See overflow: hidden in .CodeMirror */
margin-bottom: -30px; margin-right: -30px; margin-bottom: -30px;
margin-right: -30px;
padding-bottom: 30px; padding-bottom: 30px;
height: 100%; height: 100%;
outline: none; /* Prevent dragging from highlighting the element */ outline: none; /* Prevent dragging from highlighting the element */
@ -179,30 +272,39 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
/* The fake, visible scrollbars. Used to force redraw during scrolling /* The fake, visible scrollbars. Used to force redraw during scrolling
before actual scrolling happens, thus preventing shaking and before actual scrolling happens, thus preventing shaking and
flickering artifacts. */ flickering artifacts. */
.CodeMirror .CodeMirror-vscrollbar, .CodeMirror .CodeMirror-hscrollbar, .CodeMirror .CodeMirror-scrollbar-filler, .CodeMirror .CodeMirror-gutter-filler { .CodeMirror .CodeMirror-vscrollbar,
.CodeMirror .CodeMirror-hscrollbar,
.CodeMirror .CodeMirror-scrollbar-filler,
.CodeMirror .CodeMirror-gutter-filler {
position: absolute; position: absolute;
z-index: 6; z-index: 6;
display: none; display: none;
} }
.CodeMirror-vscrollbar { .CodeMirror-vscrollbar {
right: 0; top: 0; right: 0;
top: 0;
overflow-x: hidden; overflow-x: hidden;
overflow-y: scroll; overflow-y: scroll;
} }
.CodeMirror-hscrollbar { .CodeMirror-hscrollbar {
bottom: 0; left: 0; bottom: 0;
left: 0;
overflow-y: hidden; overflow-y: hidden;
overflow-x: scroll; overflow-x: scroll;
} }
.CodeMirror-scrollbar-filler { .CodeMirror-scrollbar-filler {
right: 0; bottom: 0; right: 0;
bottom: 0;
} }
.CodeMirror-gutter-filler { .CodeMirror-gutter-filler {
left: 0; bottom: 0; left: 0;
bottom: 0;
} }
.CodeMirror .CodeMirror-gutters { .CodeMirror .CodeMirror-gutters {
position: absolute; left: 0; top: 0; position: absolute;
left: 0;
top: 0;
min-height: 100%; min-height: 100%;
z-index: 3; z-index: 3;
} }
@ -213,8 +315,8 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
vertical-align: top; vertical-align: top;
margin-bottom: -30px; margin-bottom: -30px;
/* Hack to make IE7 behave */ /* Hack to make IE7 behave */
*zoom:1; *zoom: 1;
*display:inline; *display: inline;
} }
.CodeMirror .CodeMirror-gutter-wrapper { .CodeMirror .CodeMirror-gutter-wrapper {
position: absolute; position: absolute;
@ -224,7 +326,8 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
} }
.CodeMirror .CodeMirror-gutter-background { .CodeMirror .CodeMirror-gutter-background {
position: absolute; position: absolute;
top: 0; bottom: 0; top: 0;
bottom: 0;
z-index: 4; z-index: 4;
} }
.CodeMirror .CodeMirror-gutter-elt { .CodeMirror .CodeMirror-gutter-elt {
@ -244,7 +347,9 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
} }
.CodeMirror pre { .CodeMirror pre {
/* Reset some styles that the rest of the page might have set */ /* Reset some styles that the rest of the page might have set */
-moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
border-width: 0; border-width: 0;
background: transparent; background: transparent;
/*font-family: inherit;*/ /*font-family: inherit;*/
@ -270,7 +375,10 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
.CodeMirror .CodeMirror-linebackground { .CodeMirror .CodeMirror-linebackground {
position: absolute; position: absolute;
left: 0; right: 0; top: 0; bottom: 0; left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 0; z-index: 0;
} }
@ -280,7 +388,8 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
overflow: auto; overflow: auto;
} }
.CodeMirror-widget {} .CodeMirror-widget {
}
.CodeMirror-code { .CodeMirror-code {
outline: none; outline: none;
@ -308,7 +417,9 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
} }
.CodeMirror-measure pre { position: static; } .CodeMirror-measure pre {
position: static;
}
.CodeMirror div.CodeMirror-cursors { .CodeMirror div.CodeMirror-cursors {
visibility: hidden; visibility: hidden;
@ -323,22 +434,40 @@ div.CodeMirror-dragcursors {
visibility: visible; visibility: visible;
} }
.CodeMirror-selected { background: #d9d9d9; } .CodeMirror-selected {
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; } background: #d9d9d9;
.CodeMirror-crosshair { cursor: crosshair; } }
.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; } .CodeMirror-focused .CodeMirror-selected {
.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; } background: #d7d4f0;
}
.CodeMirror-crosshair {
cursor: crosshair;
}
.CodeMirror-line::selection,
.CodeMirror-line > span::selection,
.CodeMirror-line > span > span::selection {
background: #d7d4f0;
}
.CodeMirror-line::-moz-selection,
.CodeMirror-line > span::-moz-selection,
.CodeMirror-line > span > span::-moz-selection {
background: #d7d4f0;
}
.cm-searching { .cm-searching {
background: #ffa; background: #ffa;
background: rgba(255, 255, 0, .4); background: rgba(255, 255, 0, 0.4);
} }
/* IE7 hack to prevent it from returning funny offsetTops on the spans */ /* IE7 hack to prevent it from returning funny offsetTops on the spans */
.CodeMirror span { *vertical-align: text-bottom; } .CodeMirror span {
*vertical-align: text-bottom;
}
/* Used to force a border model for a node */ /* Used to force a border model for a node */
.cm-force-border { padding-right: .1px; } .cm-force-border {
padding-right: 0.1px;
}
@media print { @media print {
/* Hide the cursor when printing */ /* Hide the cursor when printing */
@ -348,10 +477,14 @@ div.CodeMirror-dragcursors {
} }
/* See issue #2901 */ /* See issue #2901 */
.cm-tab-wrap-hack:after { content: ''; } .cm-tab-wrap-hack:after {
content: "";
}
/* Help users use markselection to safely style text background */ /* Help users use markselection to safely style text background */
span.CodeMirror-selectedtext { background: none; } span.CodeMirror-selectedtext {
background: none;
}
/* /*
MDN-LIKE Theme - Mozilla MDN-LIKE Theme - Mozilla
@ -362,82 +495,219 @@ span.CodeMirror-selectedtext { background: none; }
The mdn-like theme is inspired on the displayed code examples at: https://developer.mozilla.org/en-US/docs/Web/CSS/animation The mdn-like theme is inspired on the displayed code examples at: https://developer.mozilla.org/en-US/docs/Web/CSS/animation
*/ */
.cm-s-mdn-like.CodeMirror { color: #999; background-color: #fff; } .cm-s-mdn-like.CodeMirror {
.cm-s-mdn-like div.CodeMirror-selected { background: #cfc; } color: #999;
.cm-s-mdn-like .CodeMirror-line::selection, .cm-s-mdn-like .CodeMirror-line > span::selection, .cm-s-mdn-like .CodeMirror-line > span > span::selection { background: #cfc; } background-color: #fff;
.cm-s-mdn-like .CodeMirror-line::-moz-selection, .cm-s-mdn-like .CodeMirror-line > span::-moz-selection, .cm-s-mdn-like .CodeMirror-line > span > span::-moz-selection { background: #cfc; } }
.cm-s-mdn-like div.CodeMirror-selected {
background: #cfc;
}
.cm-s-mdn-like .CodeMirror-line::selection,
.cm-s-mdn-like .CodeMirror-line > span::selection,
.cm-s-mdn-like .CodeMirror-line > span > span::selection {
background: #cfc;
}
.cm-s-mdn-like .CodeMirror-line::-moz-selection,
.cm-s-mdn-like .CodeMirror-line > span::-moz-selection,
.cm-s-mdn-like .CodeMirror-line > span > span::-moz-selection {
background: #cfc;
}
.cm-s-mdn-like .CodeMirror-gutters { background: #f8f8f8; border-left: 6px solid rgba(0,83,159,0); color: #333; } .cm-s-mdn-like .CodeMirror-gutters {
.cm-s-mdn-like .CodeMirror-linenumber { color: #aaa; padding-left: 8px; } background: #f8f8f8;
.cm-s-mdn-like .CodeMirror-cursor { border-left: 2px solid #222; } border-left: 6px solid rgba(0, 83, 159, 0);
color: #333;
}
.cm-s-mdn-like .CodeMirror-linenumber {
color: #aaa;
padding-left: 8px;
}
.cm-s-mdn-like .CodeMirror-cursor {
border-left: 2px solid #222;
}
.cm-s-mdn-like .cm-keyword { color: #6262FF; } .cm-s-mdn-like .cm-keyword {
.cm-s-mdn-like .cm-atom { color: #F90; } color: #6262ff;
.cm-s-mdn-like .cm-number { color: #ca7841; } }
.cm-s-mdn-like .cm-def { color: #8DA6CE; } .cm-s-mdn-like .cm-atom {
.cm-s-mdn-like span.cm-variable-2, .cm-s-mdn-like span.cm-tag { color: #690; } color: #f90;
.cm-s-mdn-like span.cm-variable-3, .cm-s-mdn-like span.cm-def { color: #07a; } }
.cm-s-mdn-like .cm-number {
color: #ca7841;
}
.cm-s-mdn-like .cm-def {
color: #8da6ce;
}
.cm-s-mdn-like span.cm-variable-2,
.cm-s-mdn-like span.cm-tag {
color: #690;
}
.cm-s-mdn-like span.cm-variable-3,
.cm-s-mdn-like span.cm-def {
color: #07a;
}
.cm-s-mdn-like .cm-variable { color: #07a; } .cm-s-mdn-like .cm-variable {
.cm-s-mdn-like .cm-property { color: #905; } color: #07a;
.cm-s-mdn-like .cm-qualifier { color: #690; } }
.cm-s-mdn-like .cm-property {
color: #905;
}
.cm-s-mdn-like .cm-qualifier {
color: #690;
}
.cm-s-mdn-like .cm-operator { color: #cda869; } .cm-s-mdn-like .cm-operator {
.cm-s-mdn-like .cm-comment { color:#777; font-weight:normal; } color: #cda869;
.cm-s-mdn-like .cm-string { color:#07a; font-style:italic; } }
.cm-s-mdn-like .cm-string-2 { color:#bd6b18; } /*?*/ .cm-s-mdn-like .cm-comment {
.cm-s-mdn-like .cm-meta { color: #000; } /*?*/ color: #777;
.cm-s-mdn-like .cm-builtin { color: #9B7536; } /*?*/ font-weight: normal;
.cm-s-mdn-like .cm-tag { color: #997643; } }
.cm-s-mdn-like .cm-attribute { color: #d6bb6d; } /*?*/ .cm-s-mdn-like .cm-string {
.cm-s-mdn-like .cm-header { color: #FF6400; } color: #07a;
.cm-s-mdn-like .cm-hr { color: #AEAEAE; } font-style: italic;
.cm-s-mdn-like .cm-link { color:#ad9361; font-style:italic; text-decoration:none; } }
.cm-s-mdn-like .cm-error { border-bottom: 1px solid red; } .cm-s-mdn-like .cm-string-2 {
color: #bd6b18;
} /*?*/
.cm-s-mdn-like .cm-meta {
color: #000;
} /*?*/
.cm-s-mdn-like .cm-builtin {
color: #9b7536;
} /*?*/
.cm-s-mdn-like .cm-tag {
color: #997643;
}
.cm-s-mdn-like .cm-attribute {
color: #d6bb6d;
} /*?*/
.cm-s-mdn-like .cm-header {
color: #ff6400;
}
.cm-s-mdn-like .cm-hr {
color: #aeaeae;
}
.cm-s-mdn-like .cm-link {
color: #ad9361;
font-style: italic;
text-decoration: none;
}
.cm-s-mdn-like .cm-error {
border-bottom: 1px solid red;
}
div.cm-s-mdn-like .CodeMirror-activeline-background { background: #efefff; } div.cm-s-mdn-like .CodeMirror-activeline-background {
div.cm-s-mdn-like span.CodeMirror-matchingbracket { outline:1px solid grey; color: inherit; } background: #efefff;
}
div.cm-s-mdn-like span.CodeMirror-matchingbracket {
outline: 1px solid grey;
color: inherit;
}
/*.cm-s-mdn-like.CodeMirror { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAyCAYAAAAp8UeFAAAHvklEQVR42s2b63bcNgyEQZCSHCdt2vd/0tWF7I+Q6XgMXiTtuvU5Pl57ZQKkKHzEAOtF5KeIJBGJ8uvL599FRFREZhFx8DeXv8trn68RuGaC8TRfo3SNp9dlDDHedyLyTUTeRWStXKPZrjtpZxaRw5hPqozRs1N8/enzIiQRWcCgy4MUA0f+XWliDhyL8Lfyvx7ei/Ae3iQFHyw7U/59pQVIMEEPEz0G7XiwdRjzSfC3UTtz9vchIntxvry5iMgfIhJoEflOz2CQr3F5h/HfeFe+GTdLaKcu9L8LTeQb/R/7GgbsfKedyNdoHsN31uRPWrfZ5wsj/NzzRQHuToIdU3ahwnsKPxXCjJITuOsi7XLc7SG/v5GdALs7wf8JjTFiB5+QvTEfRyGOfX3Lrx8wxyQi3sNq46O7QahQiCsRFgqddjBouVEHOKDgXAQHD9gJCr5sMKkEdjwsarG/ww3BMHBU7OBjXnzdyY7SfCxf5/z6ATccrwlKuwC/jhznnPF4CgVzhhVf4xp2EixcBActO75iZ8/fM9zAs2OMzKdslgXWJ9XG8PQoOAMA5fGcsvORgv0doBXyHrCwfLJAOwo71QLNkb8n2Pl6EWiR7OCibtkPaz4Kc/0NNAze2gju3zOwekALDaCFPI5vjPFmgGY5AZqyGEvH1x7QfIb8YtxMnA/b+QQ0aQDAwc6JMFg8CbQZ4qoYEEHbRwNojuK3EHwd7VALSgq+MNDKzfT58T8qdpADrgW0GmgcAS1lhzztJmkAzcPNOQbsWEALBDSlMKUG0Eq4CLAQWvEVQ9WU57gZJwZtgPO3r9oBTQ9WO8TjqXINx8R0EYpiZEUWOF3FxkbJkgU9B2f41YBrIj5ZfsQa0M5kTgiAAqM3ShXLgu8XMqcrQBvJ0CL5pnTsfMB13oB8athpAq2XOQmcGmoACCLydx7nToa23ATaSIY2ichfOdPTGxlasXMLaL0MLZAOwAKIM+y8CmicobGdCcbbK9DzN+yYGVoNNI5iUKTMyYOjPse4A8SM1MmcXgU0toOq1yO/v8FOxlASyc7TgeYaAMBJHcY1CcCwGI/TK4AmDbDyKYBBtFUkRwto8gygiQEaByFgJ00BH2M8JWwQS1nafDXQCidWyOI8AcjDCSjCLk8ngObuAm3JAHAdubAmOaK06V8MNEsKPJOhobSprwQa6gD7DclRQdqcwL4zxqgBrQcabUiBLclRDKAlWp+etPkBaNMA0AKlrHwTdEByZAA4GM+SNluSY6wAzcMNewxmgig5Ks0nkrSpBvSaQHMdKTBAnLojOdYyGpQ254602ZILPdTD1hdlggdIm74jbTp8vDwF5ZYUeLWGJpWsh6XNyXgcYwVoJQTEhhTYkxzZjiU5npU2TaB979TQehlaAVq4kaGpiPwwwLkYUuBbQwocyQTv1tA0+1UFWoJF3iv1oq+qoSk8EQdJmwHkziIF7oOZk14EGitibAdjLYYK78H5vZOhtWpoI0ATGHs0Q8OMb4Ey+2bU2UYztCtA0wFAs7TplGLRVQCcqaFdGSPCeTI1QNIC52iWNzof6Uib7xjEp07mNNoUYmVosVItHrHzRlLgBn9LFyRHaQCtVUMbtTNhoXWiTOO9k/V8BdAc1Oq0ArSQs6/5SU0hckNy9NnXqQY0PGYo5dWJ7nINaN6o958FWin27aBaWRka1r5myvLOAm0j30eBJqCxHLReVclxhxOEN2JfDWjxBtAC7MIH1fVaGdoOp4qJYDgKtKPSFNID2gSnGldrCqkFZ+5UeQXQBIRrSwocbdZYQT/2LwRahBPBXoHrB8nxaGROST62DKUbQOMMzZIC9abkuELfQzQALWTnDNAm8KHWFOJgJ5+SHIvTPcmx1xQyZRhNL5Qci689aXMEaN/uNIWkEwDAvFpOZmgsBaaGnbs1NPa1Jm32gBZAIh1pCtG7TSH4aE0y1uVY4uqoFPisGlpP2rSA5qTecWn5agK6BzSpgAyD+wFaqhnYoSZ1Vwr8CmlTQbrcO3ZaX0NAEyMbYaAlyquFoLKK3SPby9CeVUPThrSJmkCAE0CrKUQadi4DrdSlWhmah0YL9z9vClH59YGbHx1J8VZTyAjQepJjmXwAKTDQI3omc3p1U4gDUf6RfcdYfrUp5ClAi2J3Ba6UOXGo+K+bQrjjssitG2SJzshaLwMtXgRagUNpYYoVkMSBLM+9GGiJZMvduG6DRZ4qc04DMPtQQxOjEtACmhO7K1AbNbQDEggZyJwscFpAGwENhoBeUwh3bWolhe8BTYVKxQEWrSUn/uhcM5KhvUu/+eQu0Lzhi+VrK0PrZZNDQKs9cpYUuFYgMVpD4/NxenJTiMCNqdUEUf1qZWjppLT5qSkkUZbCwkbZMSuVnu80hfSkzRbQeqCZSAh6huR4VtoM2gHAlLf72smuWgE+VV7XpE25Ab2WFDgyhnSuKbs4GuGzCjR+tIoUuMFg3kgcWKLTwRqanJQ2W00hAsenfaApRC42hbCvK1SlE0HtE9BGgneJO+ELamitD1YjjOYnNYVcraGhtKkW0EqVVeDx733I2NH581k1NNxNLG0i0IJ8/NjVaOZ0tYZ2Vtr0Xv7tPV3hkWp9EFkgS/J0vosngTaSoaG06WHi+xObQkaAdlbanP8B2+2l0f90LmUAAAAASUVORK5CYII=); }*/ /*.cm-s-mdn-like.CodeMirror { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAyCAYAAAAp8UeFAAAHvklEQVR42s2b63bcNgyEQZCSHCdt2vd/0tWF7I+Q6XgMXiTtuvU5Pl57ZQKkKHzEAOtF5KeIJBGJ8uvL599FRFREZhFx8DeXv8trn68RuGaC8TRfo3SNp9dlDDHedyLyTUTeRWStXKPZrjtpZxaRw5hPqozRs1N8/enzIiQRWcCgy4MUA0f+XWliDhyL8Lfyvx7ei/Ae3iQFHyw7U/59pQVIMEEPEz0G7XiwdRjzSfC3UTtz9vchIntxvry5iMgfIhJoEflOz2CQr3F5h/HfeFe+GTdLaKcu9L8LTeQb/R/7GgbsfKedyNdoHsN31uRPWrfZ5wsj/NzzRQHuToIdU3ahwnsKPxXCjJITuOsi7XLc7SG/v5GdALs7wf8JjTFiB5+QvTEfRyGOfX3Lrx8wxyQi3sNq46O7QahQiCsRFgqddjBouVEHOKDgXAQHD9gJCr5sMKkEdjwsarG/ww3BMHBU7OBjXnzdyY7SfCxf5/z6ATccrwlKuwC/jhznnPF4CgVzhhVf4xp2EixcBActO75iZ8/fM9zAs2OMzKdslgXWJ9XG8PQoOAMA5fGcsvORgv0doBXyHrCwfLJAOwo71QLNkb8n2Pl6EWiR7OCibtkPaz4Kc/0NNAze2gju3zOwekALDaCFPI5vjPFmgGY5AZqyGEvH1x7QfIb8YtxMnA/b+QQ0aQDAwc6JMFg8CbQZ4qoYEEHbRwNojuK3EHwd7VALSgq+MNDKzfT58T8qdpADrgW0GmgcAS1lhzztJmkAzcPNOQbsWEALBDSlMKUG0Eq4CLAQWvEVQ9WU57gZJwZtgPO3r9oBTQ9WO8TjqXINx8R0EYpiZEUWOF3FxkbJkgU9B2f41YBrIj5ZfsQa0M5kTgiAAqM3ShXLgu8XMqcrQBvJ0CL5pnTsfMB13oB8athpAq2XOQmcGmoACCLydx7nToa23ATaSIY2ichfOdPTGxlasXMLaL0MLZAOwAKIM+y8CmicobGdCcbbK9DzN+yYGVoNNI5iUKTMyYOjPse4A8SM1MmcXgU0toOq1yO/v8FOxlASyc7TgeYaAMBJHcY1CcCwGI/TK4AmDbDyKYBBtFUkRwto8gygiQEaByFgJ00BH2M8JWwQS1nafDXQCidWyOI8AcjDCSjCLk8ngObuAm3JAHAdubAmOaK06V8MNEsKPJOhobSprwQa6gD7DclRQdqcwL4zxqgBrQcabUiBLclRDKAlWp+etPkBaNMA0AKlrHwTdEByZAA4GM+SNluSY6wAzcMNewxmgig5Ks0nkrSpBvSaQHMdKTBAnLojOdYyGpQ254602ZILPdTD1hdlggdIm74jbTp8vDwF5ZYUeLWGJpWsh6XNyXgcYwVoJQTEhhTYkxzZjiU5npU2TaB979TQehlaAVq4kaGpiPwwwLkYUuBbQwocyQTv1tA0+1UFWoJF3iv1oq+qoSk8EQdJmwHkziIF7oOZk14EGitibAdjLYYK78H5vZOhtWpoI0ATGHs0Q8OMb4Ey+2bU2UYztCtA0wFAs7TplGLRVQCcqaFdGSPCeTI1QNIC52iWNzof6Uib7xjEp07mNNoUYmVosVItHrHzRlLgBn9LFyRHaQCtVUMbtTNhoXWiTOO9k/V8BdAc1Oq0ArSQs6/5SU0hckNy9NnXqQY0PGYo5dWJ7nINaN6o958FWin27aBaWRka1r5myvLOAm0j30eBJqCxHLReVclxhxOEN2JfDWjxBtAC7MIH1fVaGdoOp4qJYDgKtKPSFNID2gSnGldrCqkFZ+5UeQXQBIRrSwocbdZYQT/2LwRahBPBXoHrB8nxaGROST62DKUbQOMMzZIC9abkuELfQzQALWTnDNAm8KHWFOJgJ5+SHIvTPcmx1xQyZRhNL5Qci689aXMEaN/uNIWkEwDAvFpOZmgsBaaGnbs1NPa1Jm32gBZAIh1pCtG7TSH4aE0y1uVY4uqoFPisGlpP2rSA5qTecWn5agK6BzSpgAyD+wFaqhnYoSZ1Vwr8CmlTQbrcO3ZaX0NAEyMbYaAlyquFoLKK3SPby9CeVUPThrSJmkCAE0CrKUQadi4DrdSlWhmah0YL9z9vClH59YGbHx1J8VZTyAjQepJjmXwAKTDQI3omc3p1U4gDUf6RfcdYfrUp5ClAi2J3Ba6UOXGo+K+bQrjjssitG2SJzshaLwMtXgRagUNpYYoVkMSBLM+9GGiJZMvduG6DRZ4qc04DMPtQQxOjEtACmhO7K1AbNbQDEggZyJwscFpAGwENhoBeUwh3bWolhe8BTYVKxQEWrSUn/uhcM5KhvUu/+eQu0Lzhi+VrK0PrZZNDQKs9cpYUuFYgMVpD4/NxenJTiMCNqdUEUf1qZWjppLT5qSkkUZbCwkbZMSuVnu80hfSkzRbQeqCZSAh6huR4VtoM2gHAlLf72smuWgE+VV7XpE25Ab2WFDgyhnSuKbs4GuGzCjR+tIoUuMFg3kgcWKLTwRqanJQ2W00hAsenfaApRC42hbCvK1SlE0HtE9BGgneJO+ELamitD1YjjOYnNYVcraGhtKkW0EqVVeDx733I2NH581k1NNxNLG0i0IJ8/NjVaOZ0tYZ2Vtr0Xv7tPV3hkWp9EFkgS/J0vosngTaSoaG06WHi+xObQkaAdlbanP8B2+2l0f90LmUAAAAASUVORK5CYII=); }*/
/****************************************************************/ /****************************************************************/
/* Based on mbonaci's Brackets mbo theme */ /* Based on mbonaci's Brackets mbo theme */
/* https://github.com/mbonaci/global/blob/master/Mbo.tmTheme */ /* https://github.com/mbonaci/global/blob/master/Mbo.tmTheme */
/* Create your own: http://tmtheme-editor.herokuapp.com */ /* Create your own: http://tmtheme-editor.herokuapp.com */
/****************************************************************/ /****************************************************************/
.cm-s-mbo.CodeMirror { background: #2c2c2c; color: #ffffec; } .cm-s-mbo.CodeMirror {
.cm-s-mbo div.CodeMirror-selected { background: #716C62; } background: #2c2c2c;
.cm-s-mbo .CodeMirror-line::selection, .cm-s-mbo .CodeMirror-line > span::selection, .cm-s-mbo .CodeMirror-line > span > span::selection { background: rgba(113, 108, 98, .99); } color: #ffffec;
.cm-s-mbo .CodeMirror-line::-moz-selection, .cm-s-mbo .CodeMirror-line > span::-moz-selection, .cm-s-mbo .CodeMirror-line > span > span::-moz-selection { background: rgba(113, 108, 98, .99); } }
.cm-s-mbo .CodeMirror-gutters { background: #4e4e4e; border-right: 0px; } .cm-s-mbo div.CodeMirror-selected {
.cm-s-mbo .CodeMirror-guttermarker { color: white; } background: #716c62;
.cm-s-mbo .CodeMirror-guttermarker-subtle { color: grey; } }
.cm-s-mbo .CodeMirror-linenumber { color: #dadada; } .cm-s-mbo .CodeMirror-line::selection,
.cm-s-mbo .CodeMirror-cursor { border-left: 1px solid #ffffec; } .cm-s-mbo .CodeMirror-line > span::selection,
.cm-s-mbo .CodeMirror-line > span > span::selection {
background: rgba(113, 108, 98, 0.99);
}
.cm-s-mbo .CodeMirror-line::-moz-selection,
.cm-s-mbo .CodeMirror-line > span::-moz-selection,
.cm-s-mbo .CodeMirror-line > span > span::-moz-selection {
background: rgba(113, 108, 98, 0.99);
}
.cm-s-mbo .CodeMirror-gutters {
background: #4e4e4e;
border-right: 0px;
}
.cm-s-mbo .CodeMirror-guttermarker {
color: white;
}
.cm-s-mbo .CodeMirror-guttermarker-subtle {
color: grey;
}
.cm-s-mbo .CodeMirror-linenumber {
color: #dadada;
}
.cm-s-mbo .CodeMirror-cursor {
border-left: 1px solid #ffffec;
}
.cm-s-mbo span.cm-comment { color: #95958a; } .cm-s-mbo span.cm-comment {
.cm-s-mbo span.cm-atom { color: #00a8c6; } color: #95958a;
.cm-s-mbo span.cm-number { color: #00a8c6; } }
.cm-s-mbo span.cm-atom {
color: #00a8c6;
}
.cm-s-mbo span.cm-number {
color: #00a8c6;
}
.cm-s-mbo span.cm-property, .cm-s-mbo span.cm-attribute { color: #9ddfe9; } .cm-s-mbo span.cm-property,
.cm-s-mbo span.cm-keyword { color: #ffb928; } .cm-s-mbo span.cm-attribute {
.cm-s-mbo span.cm-string { color: #ffcf6c; } color: #9ddfe9;
.cm-s-mbo span.cm-string.cm-property { color: #ffffec; } }
.cm-s-mbo span.cm-keyword {
color: #ffb928;
}
.cm-s-mbo span.cm-string {
color: #ffcf6c;
}
.cm-s-mbo span.cm-string.cm-property {
color: #ffffec;
}
.cm-s-mbo span.cm-variable { color: #ffffec; } .cm-s-mbo span.cm-variable {
.cm-s-mbo span.cm-variable-2 { color: #00a8c6; } color: #ffffec;
.cm-s-mbo span.cm-def { color: #ffffec; } }
.cm-s-mbo span.cm-bracket { color: #fffffc; font-weight: bold; } .cm-s-mbo span.cm-variable-2 {
.cm-s-mbo span.cm-tag { color: #9ddfe9; } color: #00a8c6;
.cm-s-mbo span.cm-link { color: #f54b07; } }
.cm-s-mbo span.cm-error { border-bottom: #636363; color: #ffffec; } .cm-s-mbo span.cm-def {
.cm-s-mbo span.cm-qualifier { color: #ffffec; } color: #ffffec;
}
.cm-s-mbo span.cm-bracket {
color: #fffffc;
font-weight: bold;
}
.cm-s-mbo span.cm-tag {
color: #9ddfe9;
}
.cm-s-mbo span.cm-link {
color: #f54b07;
}
.cm-s-mbo span.cm-error {
border-bottom: #636363;
color: #ffffec;
}
.cm-s-mbo span.cm-qualifier {
color: #ffffec;
}
.cm-s-mbo .CodeMirror-activeline-background { background: #494b41; } .cm-s-mbo .CodeMirror-activeline-background {
.cm-s-mbo .CodeMirror-matchingbracket { color: #ffb928 !important; } background: #494b41;
.cm-s-mbo .CodeMirror-matchingtag { background: rgba(255, 255, 255, .37); } }
.cm-s-mbo .CodeMirror-matchingbracket {
color: #ffb928 !important;
}
.cm-s-mbo .CodeMirror-matchingtag {
background: rgba(255, 255, 255, 0.37);
}
.CodeMirror-hints { .CodeMirror-hints {
position: absolute; position: absolute;
@ -448,9 +718,9 @@ div.cm-s-mdn-like span.CodeMirror-matchingbracket { outline:1px solid grey; colo
margin: 0; margin: 0;
padding: 2px; padding: 2px;
-webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.2);
box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.2);
border-radius: 3px; border-radius: 3px;
border: 1px solid silver; border: 1px solid silver;
@ -496,23 +766,47 @@ li.CodeMirror-hint-active {
position: relative; position: relative;
font-size: 90%; font-size: 90%;
font-family: monospace; font-family: monospace;
width: .8em; width: 0.8em;
display: inline-block; display: inline-block;
text-align: center; text-align: center;
padding-right: .6em; padding-right: 0.6em;
opacity: 0.6; opacity: 0.6;
box-sizing: content-box; box-sizing: content-box;
} }
.cm-completionIcon-function:after, .cm-completionIcon-function:after,
.cm-completionIcon-method:after {content: 'ƒ';} .cm-completionIcon-method:after {
.cm-completionIcon-class:after {content: '○';} content: "ƒ";
.cm-completionIcon-interface:after {content: '◌';} }
.cm-completionIcon-variable:after {content: '𝑥';} .cm-completionIcon-class:after {
.cm-completionIcon-constant:after {content: '𝐶';} content: "○";
.cm-completionIcon-type:after {content: '𝑡';} }
.cm-completionIcon-enum:after {content: '∪';} .cm-completionIcon-interface:after {
.cm-completionIcon-property:after {content: '□';} content: "◌";
.cm-completionIcon-keyword:after {content: '🔑︎';} }
.cm-completionIcon-namespace:after {content: '▢';} .cm-completionIcon-variable:after {
.cm-completionIcon-text:after {content: 'abc'; font-size: 50%; vertical-align: middle;} content: "𝑥";
}
.cm-completionIcon-constant:after {
content: "𝐶";
}
.cm-completionIcon-type:after {
content: "𝑡";
}
.cm-completionIcon-enum:after {
content: "∪";
}
.cm-completionIcon-property:after {
content: "□";
}
.cm-completionIcon-keyword:after {
content: "🔑︎";
}
.cm-completionIcon-namespace:after {
content: "▢";
}
.cm-completionIcon-text:after {
content: "abc";
font-size: 50%;
vertical-align: middle;
}

3013
layout/default/layout.css
View File

File diff suppressed because it is too large Load Diff

663
layout/default/menu.css
View File

File diff suppressed because it is too large Load Diff

94
layout/default/phone.css
View File

@ -1,118 +1,120 @@
#arena{ #arena {
height: calc(97% + 30px); height: calc(97% + 30px);
top:3% top: 3%;
} }
#arena.mobile>#control{ #arena.mobile > #control {
top:calc(100% - 205px); top: calc(100% - 205px);
} }
#arena.chess.mobile>#control{ #arena.chess.mobile > #control {
top:calc(100% - 175px); top: calc(100% - 175px);
} }
#control>div,#system>div>div{ #control > div,
#system > div > div {
height: 40px; height: 40px;
font-family: 'xinwei'; font-family: "xinwei";
font-size: 30px; font-size: 30px;
line-height: 34px; line-height: 34px;
} }
#historybar{ #historybar {
top:14px; top: 14px;
height: calc(100% - 150px); height: calc(100% - 150px);
} }
#window.oblongcard #historybar{ #window.oblongcard #historybar {
height: calc(100% - 170px); height: calc(100% - 170px);
} }
#time{ #time {
visibility: hidden; visibility: hidden;
} }
#system{ #system {
z-index: 31 !important; z-index: 31 !important;
} }
#window>.dialog.popped{ #window > .dialog.popped {
z-index: 21 !important; z-index: 21 !important;
} }
#system>div{ #system > div {
position: absolute; position: absolute;
height: 60px; height: 60px;
} }
#system>div:first-child{ #system > div:first-child {
left:5px; left: 5px;
} }
#system>div:last-child{ #system > div:last-child {
right:5px; right: 5px;
} }
#system>div>div{ #system > div > div {
line-height: 40px; line-height: 40px;
} }
#system{ #system {
z-index: 5; z-index: 5;
} }
#system>div{ #system > div {
transition-duration: 0.3s; transition-duration: 0.3s;
} }
#system>div:not(.shown){ #system > div:not(.shown) {
transform: translateY(-80px); transform: translateY(-80px);
} }
.statusbar #system>div:not(.shown){ .statusbar #system > div:not(.shown) {
transform: translateY(-120px); transform: translateY(-120px);
} }
#system>#system1{ #system > #system1 {
width: 140px; width: 140px;
} }
#system>#system2{ #system > #system2 {
width: calc(100% - 140px); width: calc(100% - 140px);
} }
#system>div:not(.shown)>div{ #system > div:not(.shown) > div {
pointer-events: none; pointer-events: none;
} }
#pausebutton,#autobutton,#restartbutton{ #pausebutton,
#autobutton,
#restartbutton {
display: none !important; display: none !important;
} }
.menu-container>.menu.main, .menu-container > .menu.main,
.popup-container>.menu{ .popup-container > .menu {
zoom:1.3; zoom: 1.3;
} }
.popup-container>.menu{ .popup-container > .menu {
max-height: 307px; max-height: 307px;
} }
.popup-container>.menu.visual.withbar{ .popup-container > .menu.visual.withbar {
max-height: 360px; max-height: 360px;
} }
.menu-container>.menu.main:not(.center){ .menu-container > .menu.main:not(.center) {
top: 12px !important; top: 12px !important;
left: 10px !important; left: 10px !important;
} }
#system{ #system {
width: calc(100% - 12px) !important; width: calc(100% - 12px) !important;
left: 0 !important; left: 0 !important;
} }
#arena.phonetop{ #arena.phonetop {
top:80px !important; top: 80px !important;
} }
.player>.identity{ .player > .identity {
transform: scale(1.3); transform: scale(1.3);
} }
#window>.dialog.popped.hoverdialog{ #window > .dialog.popped.hoverdialog {
transform: scale(1.3); transform: scale(1.3);
transform-origin: left top; transform-origin: left top;
} }
.player:not([data-position='0']).linked .identity, .player:not([data-position="0"]).linked .identity,
#arena.chess .player.linked .identity{ #arena.chess .player.linked .identity {
transform:scale(1.3) rotate(90deg); transform: scale(1.3) rotate(90deg);
} }
/*br.finish_game{ /*br.finish_game{
display: inline !important; display: inline !important;
}*/ }*/
div:not(.shown)>div.finish_game{ div:not(.shown) > div.finish_game {
opacity: 0 !important; opacity: 0 !important;
} }
div.finish_game{ div.finish_game {
transition: all 0.2s !important; transition: all 0.2s !important;
} }
@media screen and (orientation:portrait) { @media screen and (orientation: portrait) {
} }

347
layout/long/layout.css
View File

@ -1,152 +1,194 @@
@import "../mobile/layout.css"; @import "../mobile/layout.css";
#window.rightbar #system, #window.rightbar #system,
#window.leftbar #system{ #window.leftbar #system {
width: calc(100% - 62px); width: calc(100% - 62px);
} }
#window.leftbar #system{ #window.leftbar #system {
left: 50px; left: 50px;
} }
#window.rightbar #historybar{ #window.rightbar #historybar {
left: calc(100% - 50px); left: calc(100% - 50px);
} }
#window.leftbar #historybar{ #window.leftbar #historybar {
left: 0; left: 0;
} }
#historybar{ #historybar {
left: calc(100% - 50px); left: calc(100% - 50px);
border-radius: 0; border-radius: 0;
top: 0; top: 0;
height: calc(100% - 121px); height: calc(100% - 121px);
z-index: 1; z-index: 1;
} }
#window.oblongcard #historybar{ #window.oblongcard #historybar {
height: calc(100% - 141px); height: calc(100% - 141px);
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.name.name2{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .name.name2 {
left: auto; left: auto;
right: 13px; right: 13px;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0']){ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) {
width: 120px !important; width: 120px !important;
height: 220px !important; height: 220px !important;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.marks{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .marks {
left: -15px; left: -15px;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.judges{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .judges {
right: -27px; right: -27px;
} }
#arena:not(.fewplayer)[data-player_height='default']>.player:not(.minskin):not(*[data-position='0']){ #arena:not(.fewplayer)[data-player_height="default"] > .player:not(.minskin):not(*[data-position="0"]) {
height: 200px !important; height: 200px !important;
} }
#arena:not(.fewplayer)[data-player_height='short']>.player:not(.minskin):not(*[data-position='0']){ #arena:not(.fewplayer)[data-player_height="short"] > .player:not(.minskin):not(*[data-position="0"]) {
height: 180px !important; height: 180px !important;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.equips{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .equips {
transform: scale(0.8); transform: scale(0.8);
transform-origin: bottom left; transform-origin: bottom left;
} }
#arena:not(.fewplayer).lslim_player .player .equips{ #arena:not(.fewplayer).lslim_player .player .equips {
left: 5px; left: 5px;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar, #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar2 {
width: calc(100% - 14px) !important; width: calc(100% - 14px) !important;
height: calc(100% - 14px) !important; height: calc(100% - 14px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena.uslim_player:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar, #arena.uslim_player:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena.uslim_player:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena.uslim_player:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar2 {
width: calc(100% - 6px) !important; width: calc(100% - 6px) !important;
height: calc(100% - 6px) !important; height: calc(100% - 6px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena.lslim_player:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar, #arena.lslim_player:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena.lslim_player:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena.lslim_player:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .avatar2 {
width: calc(100% - 10px) !important; width: calc(100% - 10px) !important;
height: calc(100% - 10px) !important; height: calc(100% - 10px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #arena:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar2 {
height: 50% !important; height: 50% !important;
background-position: 0 0 !important; background-position: 0 0 !important;
border-radius: 8px !important; border-radius: 8px !important;
} }
#arena.uslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #arena.uslim_player:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena.uslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena.uslim_player:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar2 {
height: calc(50% + 4px) !important; height: calc(50% + 4px) !important;
} }
#arena.lslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #arena.lslim_player:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar,
#arena.lslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena.lslim_player:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar2 {
height: calc(50% + 2px) !important; height: calc(50% + 2px) !important;
} }
#window[data-radius_size='reduce'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #window[data-radius_size="reduce"]
#window[data-radius_size='reduce'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar,
#window[data-radius_size="reduce"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar2 {
border-radius: 4px !important; border-radius: 4px !important;
} }
#window[data-radius_size='off'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #window[data-radius_size="off"]
#window[data-radius_size='off'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar,
#window[data-radius_size="off"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar2 {
border-radius: 0px !important; border-radius: 0px !important;
} }
#window[data-radius_size='increase'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar, #window[data-radius_size="increase"]
#window[data-radius_size='increase'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar,
#window[data-radius_size="increase"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(*[data-position="0"])
> .avatar2 {
border-radius: 16px !important; border-radius: 16px !important;
} }
#arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena:not(.fewplayer) > .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"]) > .avatar {
border-radius: 8px 8px 0 0 !important; border-radius: 8px 8px 0 0 !important;
height: calc(50% + 14px) !important; height: calc(50% + 14px) !important;
clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px); clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px);
} }
#arena:not(.fewplayer)[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena:not(.fewplayer)[data-player_height="default"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px); clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px);
} }
#arena:not(.fewplayer)[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena:not(.fewplayer)[data-player_height="short"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px); clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px);
} }
#arena.uslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.uslim_player:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
height: calc(50% + 18px) !important; height: calc(50% + 18px) !important;
clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px); clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px);
} }
#arena.uslim_player:not(.fewplayer)[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.uslim_player:not(.fewplayer)[data-player_height="default"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px); clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px);
} }
#arena.uslim_player:not(.fewplayer)[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.uslim_player:not(.fewplayer)[data-player_height="short"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px); clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px);
} }
#arena.lslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.lslim_player:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
height: calc(50% + 18px) !important; height: calc(50% + 18px) !important;
clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px); clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px);
} }
#arena.lslim_player:not(.fewplayer)[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.lslim_player:not(.fewplayer)[data-player_height="default"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px); clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px);
} }
#arena.lslim_player:not(.fewplayer)[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #arena.lslim_player:not(.fewplayer)[data-player_height="short"]
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px); clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px);
} }
#window[data-radius_size='reduce'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #window[data-radius_size="reduce"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
border-radius: 4px 4px 0 0 !important; border-radius: 4px 4px 0 0 !important;
} }
#window[data-radius_size='off'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #window[data-radius_size="off"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
border-radius: 0 0 0 0 !important; border-radius: 0 0 0 0 !important;
} }
#window[data-radius_size='increase'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position='0'])>.avatar{ #window[data-radius_size="increase"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen2):not(*[data-position="0"])
> .avatar {
border-radius: 16px 16px 0 0 !important; border-radius: 16px 16px 0 0 !important;
} }
#arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer) > .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"]) > .avatar2 {
border-radius: 0 0 8px 8px !important; border-radius: 0 0 8px 8px !important;
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 14px) !important; height: calc(50% + 14px) !important;
@ -154,104 +196,215 @@
clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px); clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px);
} }
#arena.uslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #arena.uslim_player:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"])
> .avatar2 {
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 18px) !important; height: calc(50% + 18px) !important;
clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px); clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px);
} }
#arena.lslim_player:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #arena.lslim_player:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"])
> .avatar2 {
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 16px) !important; height: calc(50% + 16px) !important;
clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px); clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px);
} }
#window[data-radius_size='reduce'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #window[data-radius_size="reduce"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"])
> .avatar2 {
border-radius: 0 0 4px 4px !important; border-radius: 0 0 4px 4px !important;
} }
#window[data-radius_size='off'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #window[data-radius_size="off"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"])
> .avatar2 {
border-radius: 0 0 0 0 !important; border-radius: 0 0 0 0 !important;
} }
#window[data-radius_size='increase'] #arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(.unseen):not(*[data-position='0'])>.avatar2{ #window[data-radius_size="increase"]
#arena:not(.fewplayer)
> .player.fullskin2:not(.minskin):not(.unseen):not(*[data-position="0"])
> .avatar2 {
border-radius: 0 0 16px 16px !important; border-radius: 0 0 16px 16px !important;
} }
#arena:not(.fewplayer)>.player.fullskin2:not(.minskin):not(*[data-position='0'])>.avatar2{ #arena:not(.fewplayer) > .player.fullskin2:not(.minskin):not(*[data-position="0"]) > .avatar2 {
top: calc(50% - 7px) !important; top: calc(50% - 7px) !important;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.identity{ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .identity {
left: 102px; left: 102px;
} }
#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.hp:not(.actcount){ #arena:not(.fewplayer) > .player:not(.minskin):not(*[data-position="0"]) > .hp:not(.actcount) {
left: 93px; left: 93px;
} }
/*#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.hp:not(.actcount).text{ /*#arena:not(.fewplayer)>.player:not(.minskin):not(*[data-position='0'])>.hp:not(.actcount).text{
left: 89px; left: 89px;
}*/ }*/
#arena:not(.fewplayer)>.player.fullskin2 .avatar2{ #arena:not(.fewplayer) > .player.fullskin2 .avatar2 {
z-index: 2; z-index: 2;
} }
#arena:not(.fewplayer)>.player.unseen:not(.unseen2) .count{ #arena:not(.fewplayer) > .player.unseen:not(.unseen2) .count {
text-align: left; text-align: left;
border-radius:3px 0 0 3px; border-radius: 3px 0 0 3px;
} }
#arena:not(.fewplayer)>.player.unseen2 .count{ #arena:not(.fewplayer) > .player.unseen2 .count {
border-radius: 3px; border-radius: 3px;
text-align: center; text-align: center;
} }
#arena:not(.fewplayer) .timerbar>div{ #arena:not(.fewplayer) .timerbar > div {
top: 205px; top: 205px;
width: 96px; width: 96px;
left: 12px; left: 12px;
} }
#arena:not(.fewplayer)[data-player_height='default'] .timerbar>div{ #arena:not(.fewplayer)[data-player_height="default"] .timerbar > div {
top: 185px; top: 185px;
} }
#arena:not(.fewplayer)[data-player_height='short'] .timerbar>div{ #arena:not(.fewplayer)[data-player_height="short"] .timerbar > div {
top: 165px; top: 165px;
} }
/*--------位置(8人)------*/ /*--------位置(8人)------*/
#arena:not(.fewplayer)[data-number='8']>.player[data-position='1']{top:calc(30% - 120px);left:calc(-300% / 94 + 4375% / 47 - 735px + 720px);} #arena:not(.fewplayer)[data-number="8"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='8']>.player[data-position='2']{top:calc(8% - 32px);left:calc(-300% / 94 + 3750% / 47 - 630px + 600px);} top: calc(30% - 120px);
#arena:not(.fewplayer)[data-number='8']>.player[data-position='3']{top:0;left:calc(-300% / 94 + 3125% / 47 - 525px + 480px);} left: calc(-300% / 94 + 4375% / 47 - 735px + 720px);
#arena:not(.fewplayer)[data-number='8']>.player[data-position='4']{top:0;left:calc(-300% / 94 + 2500% / 47 - 420px + 360px);} }
#arena:not(.fewplayer)[data-number='8']>.player[data-position='5']{top:0;left:calc(-300% / 94 + 1875% / 47 - 315px + 240px);} #arena:not(.fewplayer)[data-number="8"] > .player[data-position="2"] {
#arena:not(.fewplayer)[data-number='8']>.player[data-position='6']{top:calc(8% - 32px);left:calc(-300% / 94 + 1250% / 47 - 210px + 120px);} top: calc(8% - 32px);
#arena:not(.fewplayer)[data-number='8']>.player[data-position='7']{top:calc(30% - 120px);left:calc(-300% / 94 + 625% / 47 - 105px);} left: calc(-300% / 94 + 3750% / 47 - 630px + 600px);
@media screen and (min-width: 1105px){ }
#arena:not(.fewplayer)[data-number='8']>.player[data-position='1']{left:calc(100% - 120px);} #arena:not(.fewplayer)[data-number="8"] > .player[data-position="3"] {
#arena:not(.fewplayer)[data-number='8']>.player[data-position='2']{left:calc(500% / 6 - 100px);} top: 0;
#arena:not(.fewplayer)[data-number='8']>.player[data-position='3']{left:calc(400% / 6 - 80px);} left: calc(-300% / 94 + 3125% / 47 - 525px + 480px);
#arena:not(.fewplayer)[data-number='8']>.player[data-position='4']{left:calc(300% / 6 - 60px);} }
#arena:not(.fewplayer)[data-number='8']>.player[data-position='5']{left:calc(200% / 6 - 40px);} #arena:not(.fewplayer)[data-number="8"] > .player[data-position="4"] {
#arena:not(.fewplayer)[data-number='8']>.player[data-position='6']{left:calc(100% / 6 - 20px);} top: 0;
#arena:not(.fewplayer)[data-number='8']>.player[data-position='7']{left:0;} left: calc(-300% / 94 + 2500% / 47 - 420px + 360px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="5"] {
top: 0;
left: calc(-300% / 94 + 1875% / 47 - 315px + 240px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="6"] {
top: calc(8% - 32px);
left: calc(-300% / 94 + 1250% / 47 - 210px + 120px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="7"] {
top: calc(30% - 120px);
left: calc(-300% / 94 + 625% / 47 - 105px);
}
@media screen and (min-width: 1105px) {
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="1"] {
left: calc(100% - 120px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="2"] {
left: calc(500% / 6 - 100px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="3"] {
left: calc(400% / 6 - 80px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="4"] {
left: calc(300% / 6 - 60px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="5"] {
left: calc(200% / 6 - 40px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="6"] {
left: calc(100% / 6 - 20px);
}
#arena:not(.fewplayer)[data-number="8"] > .player[data-position="7"] {
left: 0;
}
} }
/*--------位置(7人)------*/ /*--------位置(7人)------*/
#arena:not(.fewplayer)[data-number='7']>.player[data-position='1']{top:calc(30% - 120px);left:calc(100% - 120px);} #arena:not(.fewplayer)[data-number="7"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='7']>.player[data-position='2']{top:calc(8% - 32px);left:calc(80% - 96px);} top: calc(30% - 120px);
#arena:not(.fewplayer)[data-number='7']>.player[data-position='3']{top:0;left:calc(60% - 72px);} left: calc(100% - 120px);
#arena:not(.fewplayer)[data-number='7']>.player[data-position='4']{top:0;left:calc(40% - 48px);} }
#arena:not(.fewplayer)[data-number='7']>.player[data-position='5']{top:calc(8% - 32px);left:calc(20% - 24px);} #arena:not(.fewplayer)[data-number="7"] > .player[data-position="2"] {
#arena:not(.fewplayer)[data-number='7']>.player[data-position='6']{top:calc(30% - 120px);left:0;} top: calc(8% - 32px);
left: calc(80% - 96px);
}
#arena:not(.fewplayer)[data-number="7"] > .player[data-position="3"] {
top: 0;
left: calc(60% - 72px);
}
#arena:not(.fewplayer)[data-number="7"] > .player[data-position="4"] {
top: 0;
left: calc(40% - 48px);
}
#arena:not(.fewplayer)[data-number="7"] > .player[data-position="5"] {
top: calc(8% - 32px);
left: calc(20% - 24px);
}
#arena:not(.fewplayer)[data-number="7"] > .player[data-position="6"] {
top: calc(30% - 120px);
left: 0;
}
/*--------位置(6人)------*/ /*--------位置(6人)------*/
#arena:not(.fewplayer)[data-number='6']>.player[data-position='1']{top:calc(30% - 120px);left:calc(100% - 120px);} #arena:not(.fewplayer)[data-number="6"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='6']>.player[data-position='2']{top:0px;left:calc(75% - 90px);} top: calc(30% - 120px);
#arena:not(.fewplayer)[data-number='6']>.player[data-position='3']{top:0;left:calc(50% - 60px);} left: calc(100% - 120px);
#arena:not(.fewplayer)[data-number='6']>.player[data-position='4']{top:0px;left:calc(25% - 30px);} }
#arena:not(.fewplayer)[data-number='6']>.player[data-position='5']{top:calc(30% - 120px);left:0;} #arena:not(.fewplayer)[data-number="6"] > .player[data-position="2"] {
top: 0px;
left: calc(75% - 90px);
}
#arena:not(.fewplayer)[data-number="6"] > .player[data-position="3"] {
top: 0;
left: calc(50% - 60px);
}
#arena:not(.fewplayer)[data-number="6"] > .player[data-position="4"] {
top: 0px;
left: calc(25% - 30px);
}
#arena:not(.fewplayer)[data-number="6"] > .player[data-position="5"] {
top: calc(30% - 120px);
left: 0;
}
/*--------位置(5人)------*/ /*--------位置(5人)------*/
#arena:not(.fewplayer)[data-number='5']>.player[data-position='1']{top:calc(30% - 120px);left:calc(100% - 120px);} #arena:not(.fewplayer)[data-number="5"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='5']>.player[data-position='2']{top:0;left:calc(200% / 3 - 80px);} top: calc(30% - 120px);
#arena:not(.fewplayer)[data-number='5']>.player[data-position='3']{top:0;left:calc(100% / 3 - 40px);} left: calc(100% - 120px);
#arena:not(.fewplayer)[data-number='5']>.player[data-position='4']{top:calc(30% - 120px);left:0;} }
#arena:not(.fewplayer)[data-number="5"] > .player[data-position="2"] {
top: 0;
left: calc(200% / 3 - 80px);
}
#arena:not(.fewplayer)[data-number="5"] > .player[data-position="3"] {
top: 0;
left: calc(100% / 3 - 40px);
}
#arena:not(.fewplayer)[data-number="5"] > .player[data-position="4"] {
top: calc(30% - 120px);
left: 0;
}
/*--------位置(4人)------*/ /*--------位置(4人)------*/
#arena:not(.fewplayer)[data-number='4']>.player[data-position='1']{top:calc(30% - 120px);left:calc(100% - 120px);} #arena:not(.fewplayer)[data-number="4"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='4']>.player[data-position='2']{top:0;left:calc(50% - 60px);} top: calc(30% - 120px);
#arena:not(.fewplayer)[data-number='4']>.player[data-position='3']{top:calc(30% - 120px);left:0;} left: calc(100% - 120px);
}
#arena:not(.fewplayer)[data-number="4"] > .player[data-position="2"] {
top: 0;
left: calc(50% - 60px);
}
#arena:not(.fewplayer)[data-number="4"] > .player[data-position="3"] {
top: calc(30% - 120px);
left: 0;
}
/*--------位置(3人)------*/ /*--------位置(3人)------*/
#arena:not(.fewplayer)[data-number='3']>.player[data-position='1']{top:calc(60% / 3 - 88px);left:calc(75% + 80px);} #arena:not(.fewplayer)[data-number="3"] > .player[data-position="1"] {
#arena:not(.fewplayer)[data-number='3']>.player[data-position='2']{top:calc(60% / 3 - 88px);left:calc(25% - 200px);} top: calc(60% / 3 - 88px);
left: calc(75% + 80px);
}
#arena:not(.fewplayer)[data-number="3"] > .player[data-position="2"] {
top: calc(60% / 3 - 88px);
left: calc(25% - 200px);
}
/*--------位置(2人)------*/ /*--------位置(2人)------*/
#arena:not(.fewplayer)[data-number='2']>.player[data-position='1']{top:0;left:calc(50% - 60px);} #arena:not(.fewplayer)[data-number="2"] > .player[data-position="1"] {
top: 0;
left: calc(50% - 60px);
}

599
layout/long2/layout.css
View File

@ -1,212 +1,212 @@
@import "../newlayout/layout.css"; @import "../newlayout/layout.css";
#arena{ #arena {
height: calc(95% + 20px); height: calc(95% + 20px);
} }
#control{ #control {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
bottom:150px; bottom: 150px;
height: 40px; height: 40px;
} }
#arena.phone #control{ #arena.phone #control {
bottom:160px; bottom: 160px;
} }
#arena.ipad #control{ #arena.ipad #control {
bottom:155px; bottom: 155px;
} }
#arena:not(.chess)>#me, #arena:not(.chess) > #me,
#arena:not(.chess)>#mebg, #arena:not(.chess) > #mebg,
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
bottom:30px; bottom: 30px;
width: calc(5000% / 47); width: calc(5000% / 47);
left:calc(-150% / 47); left: calc(-150% / 47);
top:auto; top: auto;
border-radius:0 !important; border-radius: 0 !important;
height:120px;
}
#arena.oblongcard:not(.chess)>#me,
#arena.oblongcard:not(.chess)>#mebg,
#arena.oblongcard:not(.chess)>#autonode{
height: 140px;
}
#arena.oblongcard:not(.chess)>.card,
#arena.oblongcard:not(.chess) .handcards>.card{
height: 120px; height: 120px;
} }
#arena.oblongcard:not(.chess)>.card>.image, #arena.oblongcard:not(.chess) > #me,
#arena.oblongcard:not(.chess) .handcards>.card>.image{ #arena.oblongcard:not(.chess) > #mebg,
#arena.oblongcard:not(.chess) > #autonode {
height: 140px;
}
#arena.oblongcard:not(.chess) > .card,
#arena.oblongcard:not(.chess) .handcards > .card {
height: 120px;
}
#arena.oblongcard:not(.chess) > .card > .image,
#arena.oblongcard:not(.chess) .handcards > .card > .image {
height: 110px; height: 110px;
top: 8px; top: 8px;
background-position-x: -3px; background-position-x: -3px;
} }
#arena.oblongcard:not(.chess) #handcards1{ #arena.oblongcard:not(.chess) #handcards1 {
height: 100%; height: 100%;
top: 2px; top: 2px;
} }
#arena.oblongcard:not(.chess):not(.choose-character) #control{ #arena.oblongcard:not(.chess):not(.choose-character) #control {
bottom:165px; bottom: 165px;
} }
#arena.phone.oblongcard:not(.chess):not(.choose-character) #control{ #arena.phone.oblongcard:not(.chess):not(.choose-character) #control {
bottom:180px; bottom: 180px;
} }
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
} }
#arena:not(.mobile).single-handcard #handcards1{ #arena:not(.mobile).single-handcard #handcards1 {
width: calc(100% - 120px); width: calc(100% - 120px);
} }
#window.rightbar #system, #window.rightbar #system,
#window.leftbar #system{ #window.leftbar #system {
width: calc(100% - 62px); width: calc(100% - 62px);
} }
#window.leftbar #system{ #window.leftbar #system {
left: 50px; left: 50px;
} }
#window.rightbar #historybar{ #window.rightbar #historybar {
left: calc(100% - 50px); left: calc(100% - 50px);
border-radius: 0; border-radius: 0;
top: 0; top: 0;
height: 100%; height: 100%;
} }
#window.leftbar #historybar{ #window.leftbar #historybar {
left: 0; left: 0;
border-radius: 0; border-radius: 0;
top: 0; top: 0;
height: 100%; height: 100%;
} }
#window.single-handcard #historybar{ #window.single-handcard #historybar {
height: calc(100% - 121px); height: calc(100% - 121px);
} }
#window.oblongcard.single-handcard #historybar{ #window.oblongcard.single-handcard #historybar {
height: calc(100% - 141px); height: calc(100% - 141px);
} }
#window.leftbar #arena:not(.chess)>#me, #window.leftbar #arena:not(.chess) > #me,
#window.leftbar #arena:not(.chess)>#mebg, #window.leftbar #arena:not(.chess) > #mebg,
#window.leftbar #arena:not(.chess)>#autonode{ #window.leftbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 50px - 75px / 47); left: calc(-150% / 47 - 50px - 75px / 47);
} }
#window.leftbar #arena:not(.chess)>#autonode{ #window.leftbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 50px - 75px / 47 + 120px); left: calc(-150% / 47 - 50px - 75px / 47 + 120px);
} }
#window.rightbar #arena:not(.chess)>#me, #window.rightbar #arena:not(.chess) > #me,
#window.rightbar #arena:not(.chess)>#mebg, #window.rightbar #arena:not(.chess) > #mebg,
#window.rightbar #arena:not(.chess)>#autonode{ #window.rightbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 75px / 47); left: calc(-150% / 47 - 75px / 47);
} }
#window.rightbar #arena:not(.chess)>#autonode{ #window.rightbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 75px / 47 + 120px); left: calc(-150% / 47 - 75px / 47 + 120px);
} }
#arena:not(.chess) #handcards1{ #arena:not(.chess) #handcards1 {
height:120px; height: 120px;
padding:0; padding: 0;
top:calc(100% - 120px); top: calc(100% - 120px);
} }
#arena:not(.chess) #handcards1.scrollh{ #arena:not(.chess) #handcards1.scrollh {
top: calc(100% - 180px); top: calc(100% - 180px);
height: 180px; height: 180px;
} }
#arena:not(.chess).oblongcard #handcards1.scrollh{ #arena:not(.chess).oblongcard #handcards1.scrollh {
top: calc(100% - 200px); top: calc(100% - 200px);
height: 200px; height: 200px;
} }
#arena:not(.chess) #handcards1.scrollh>div{ #arena:not(.chess) #handcards1.scrollh > div {
height: 120px; height: 120px;
top: 60px; top: 60px;
} }
#arena:not(.chess).oblongcard #handcards1.scrollh>div{ #arena:not(.chess).oblongcard #handcards1.scrollh > div {
top: 62px; top: 62px;
} }
#arena:not(.chess):not(.single-handcard) #handcards1{ #arena:not(.chess):not(.single-handcard) #handcards1 {
width:calc(100% - 240px); width: calc(100% - 240px);
left:calc(150% / 47 - 300% / 94 + 625% / 47 - 105px + 120px); left: calc(150% / 47 - 300% / 94 + 625% / 47 - 105px + 120px);
} }
#arena:not(.single-handcard):not(.chess)>#me, #arena:not(.single-handcard):not(.chess) > #me,
#arena:not(.single-handcard):not(.chess)>#mebg, #arena:not(.single-handcard):not(.chess) > #mebg,
#arena:not(.single-handcard):not(.chess)>#autonode{ #arena:not(.single-handcard):not(.chess) > #autonode {
left: 0 !important; left: 0 !important;
bottom: 38px !important; bottom: 38px !important;
width: calc(9700% / 94) !important; width: calc(9700% / 94) !important;
} }
#arena:not(.single-handcard):not(.chess)>#mebg{ #arena:not(.single-handcard):not(.chess) > #mebg {
visibility: hidden; visibility: hidden;
} }
#arena:not(.single-handcard):not(.chess)>#me #handcards1{ #arena:not(.single-handcard):not(.chess) > #me #handcards1 {
left: 120px !important; left: 120px !important;
width: calc(100% - 120px) !important; width: calc(100% - 120px) !important;
} }
#arena:not(.single-handcard):not(.chess)>#me #handcards1>.handcards{ #arena:not(.single-handcard):not(.chess) > #me #handcards1 > .handcards {
left: 0 !important; left: 0 !important;
} }
#autonode{ #autonode {
display: table !important; display: table !important;
} }
@media screen and (max-width: 1105px){ @media screen and (max-width: 1105px) {
#arena[data-number='8']:not(.single-handcard):not(.chess)>#me, #arena[data-number="8"]:not(.single-handcard):not(.chess) > #me,
#arena[data-number='8']:not(.single-handcard):not(.chess)>#mebg, #arena[data-number="8"]:not(.single-handcard):not(.chess) > #mebg,
#arena[data-number='8']:not(.single-handcard):not(.chess)>#autonode{ #arena[data-number="8"]:not(.single-handcard):not(.chess) > #autonode {
left: calc(-300% / 94 + 625% / 47 - 105px) !important; left: calc(-300% / 94 + 625% / 47 - 105px) !important;
width: calc(9700% / 94 + 300% / 94 - 625% / 47 + 105px) !important; width: calc(9700% / 94 + 300% / 94 - 625% / 47 + 105px) !important;
} }
} }
#handcards2{ #handcards2 {
display:none;
}
.dialog{
height:calc(100% - 370px);
bottom:170px;
}
#arena.choose-character>.dialog .placeholder+.placeholder{
display: none; display: none;
} }
#arena.choose-character>.dialog .placeholder{ .dialog {
height: calc(100% - 370px);
bottom: 170px;
}
#arena.choose-character > .dialog .placeholder + .placeholder {
display: none;
}
#arena.choose-character > .dialog .placeholder {
margin-bottom: 4px; margin-bottom: 4px;
height: 0px; height: 0px;
} }
#arena.choose-character>.dialog.noupdate .placeholder{ #arena.choose-character > .dialog.noupdate .placeholder {
margin-bottom: 0; margin-bottom: 0;
height: 0; height: 0;
} }
#arena.choose-character>.dialog{ #arena.choose-character > .dialog {
height:calc(100% - 280px); height: calc(100% - 280px);
bottom:80px; bottom: 80px;
} }
#arena.choose-character>.dialog.scroll3{ #arena.choose-character > .dialog.scroll3 {
height:calc(100% - 240px); height: calc(100% - 240px);
} }
#arena.phone.choose-character>.dialog{ #arena.phone.choose-character > .dialog {
bottom:93px; bottom: 93px;
} }
#arena.ipad.choose-character>.dialog{ #arena.ipad.choose-character > .dialog {
bottom:96px; bottom: 96px;
} }
#arena.choose-to-move>#control, #arena.choose-to-move > #control,
#arena.discard-player-card>#control, #arena.discard-player-card > #control,
#arena.gain-player-card>#control, #arena.gain-player-card > #control,
#arena.choose-player-card>#control, #arena.choose-player-card > #control,
#arena.choose-character>#control{ #arena.choose-character > #control {
bottom: 30px; bottom: 30px;
transition: all 0s; transition: all 0s;
} }
#arena.phone.choose-to-move>#control, #arena.phone.choose-to-move > #control,
#arena.phone.discard-player-card>#control, #arena.phone.discard-player-card > #control,
#arena.phone.gain-player-card>#control, #arena.phone.gain-player-card > #control,
#arena.phone.choose-player-card>#control, #arena.phone.choose-player-card > #control,
#arena.phone.choose-character>#control{ #arena.phone.choose-character > #control {
bottom: 43px; bottom: 43px;
} }
#arena.ipad.choose-to-move>#control, #arena.ipad.choose-to-move > #control,
#arena.ipad.discard-player-card>#control, #arena.ipad.discard-player-card > #control,
#arena.ipad.gain-player-card>#control, #arena.ipad.gain-player-card > #control,
#arena.ipad.choose-player-card>#control, #arena.ipad.choose-player-card > #control,
#arena.ipad.choose-character>#control{ #arena.ipad.choose-character > #control {
bottom: 45px; bottom: 45px;
} }
.dialog.fullheight { .dialog.fullheight {
@ -214,172 +214,188 @@
top: 40px !important; top: 40px !important;
} }
#me>.fakeme.avatar{ #me > .fakeme.avatar {
width:120px; width: 120px;
height:100%; height: 100%;
border-radius:0px; border-radius: 0px;
top:0; top: 0;
left:0; left: 0;
background-size:cover; background-size: cover;
clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); -webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
} }
#window[data-radius_size='increase'] #me>.fakeme.avatar, #window[data-radius_size="increase"] #me > .fakeme.avatar,
#window[data-radius_size='reduce'] #me>.fakeme.avatar{ #window[data-radius_size="reduce"] #me > .fakeme.avatar {
border-radius:0px; border-radius: 0px;
} }
#arena>.player[data-position='0']:not(.minskin){ #arena > .player[data-position="0"]:not(.minskin) {
top: calc(100% - 258px); top: calc(100% - 258px);
} }
#arena[data-player_height='default']>.player[data-position='0']:not(.minskin){ #arena[data-player_height="default"] > .player[data-position="0"]:not(.minskin) {
top: calc(100% - 238px); top: calc(100% - 238px);
} }
#arena[data-player_height='short']>.player[data-position='0']:not(.minskin){ #arena[data-player_height="short"] > .player[data-position="0"]:not(.minskin) {
top: calc(100% - 218px); top: calc(100% - 218px);
} }
#arena > .player:not(.minskin) > .marks {
#arena>.player:not(.minskin)>.marks{
left: -15px; left: -15px;
} }
#arena>.player:not(.minskin)>.judges{ #arena > .player:not(.minskin) > .judges {
right: -27px; right: -27px;
} }
#arena.lslim_player .player .equips{ #arena.lslim_player .player .equips {
left: 5px; left: 5px;
} }
#arena>.player:not(.minskin)>.name.name2{ #arena > .player:not(.minskin) > .name.name2 {
left: auto !important; left: auto !important;
right: 13px; right: 13px;
} }
#arena>.player:not(.minskin){ #arena > .player:not(.minskin) {
width: 120px !important; width: 120px !important;
height: 220px !important; height: 220px !important;
} }
#arena>.player:not(.minskin)>.damage.dieidentity{ #arena > .player:not(.minskin) > .damage.dieidentity {
font-size: 60px; font-size: 60px;
transform: scale(1); transform: scale(1);
} }
#arena[data-player_height='default']>.player:not(.minskin){ #arena[data-player_height="default"] > .player:not(.minskin) {
height: 200px !important; height: 200px !important;
} }
#arena[data-player_height='short']>.player:not(.minskin){ #arena[data-player_height="short"] > .player:not(.minskin) {
height: 180px !important; height: 180px !important;
} }
#arena>.player:not(.minskin)>.equips{ #arena > .player:not(.minskin) > .equips {
transform: scale(0.8); transform: scale(0.8);
transform-origin: bottom left; transform-origin: bottom left;
} }
#arena>.player:not(.minskin)>.avatar, #arena > .player:not(.minskin) > .avatar,
#arena>.player:not(.minskin)>.avatar2{ #arena > .player:not(.minskin) > .avatar2 {
width: calc(100% - 14px) !important; width: calc(100% - 14px) !important;
height: calc(100% - 14px) !important; height: calc(100% - 14px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena.uslim_player>.player:not(.minskin)>.avatar, #arena.uslim_player > .player:not(.minskin) > .avatar,
#arena.uslim_player>.player:not(.minskin)>.avatar2{ #arena.uslim_player > .player:not(.minskin) > .avatar2 {
width: calc(100% - 6px) !important; width: calc(100% - 6px) !important;
height: calc(100% - 6px) !important; height: calc(100% - 6px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena.lslim_player>.player:not(.minskin)>.avatar, #arena.lslim_player > .player:not(.minskin) > .avatar,
#arena.lslim_player>.player:not(.minskin)>.avatar2{ #arena.lslim_player > .player:not(.minskin) > .avatar2 {
width: calc(100% - 10px) !important; width: calc(100% - 10px) !important;
height: calc(100% - 10px) !important; height: calc(100% - 10px) !important;
background-position: 50% !important; background-position: 50% !important;
} }
#arena>.player.fullskin2:not(.minskin)>.avatar, #arena > .player.fullskin2:not(.minskin) > .avatar,
#arena>.player.fullskin2:not(.minskin)>.avatar2{ #arena > .player.fullskin2:not(.minskin) > .avatar2 {
height: 50% !important; height: 50% !important;
background-position: 0 0 !important; background-position: 0 0 !important;
border-radius: 8px !important; border-radius: 8px !important;
} }
#arena.uslim_player>.player.fullskin2:not(.minskin)>.avatar, #arena.uslim_player > .player.fullskin2:not(.minskin) > .avatar,
#arena.uslim_player>.player.fullskin2:not(.minskin)>.avatar2{ #arena.uslim_player > .player.fullskin2:not(.minskin) > .avatar2 {
height: calc(50% + 4px) !important; height: calc(50% + 4px) !important;
} }
#arena.lslim_player>.player.fullskin2:not(.minskin)>.avatar, #arena.lslim_player > .player.fullskin2:not(.minskin) > .avatar,
#arena.lslim_player>.player.fullskin2:not(.minskin)>.avatar2{ #arena.lslim_player > .player.fullskin2:not(.minskin) > .avatar2 {
height: calc(50% + 2px) !important; height: calc(50% + 2px) !important;
} }
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin)>.avatar, #window[data-radius_size="reduce"] #arena > .player.fullskin2:not(.minskin) > .avatar,
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin)>.avatar2{ #window[data-radius_size="reduce"] #arena > .player.fullskin2:not(.minskin) > .avatar2 {
border-radius: 4px !important; border-radius: 4px !important;
} }
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin)>.avatar, #window[data-radius_size="off"] #arena > .player.fullskin2:not(.minskin) > .avatar,
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin)>.avatar2{ #window[data-radius_size="off"] #arena > .player.fullskin2:not(.minskin) > .avatar2 {
border-radius: 0px !important; border-radius: 0px !important;
} }
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin)>.avatar, #window[data-radius_size="increase"] #arena > .player.fullskin2:not(.minskin) > .avatar,
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin)>.avatar2{ #window[data-radius_size="increase"] #arena > .player.fullskin2:not(.minskin) > .avatar2 {
border-radius: 16px !important; border-radius: 16px !important;
} }
#arena>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena > .player.fullskin2:not(.minskin).unseen2[data-position="0"] > .avatar {
border-radius: 8px 8px 0 0 !important; border-radius: 8px 8px 0 0 !important;
height: calc(50% + 14px) !important; height: calc(50% + 14px) !important;
clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px); clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 92px, 106px 92px, 0px 114px, -10px 114px);
} }
#arena[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena[data-player_height="default"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena[data-player_height='default']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena[data-player_height="default"] > .player.fullskin2:not(.minskin).unseen2[data-position="0"] > .avatar {
clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px); clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 82px, 106px 82px, 0px 104px, -10px 104px);
} }
#arena[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena[data-player_height="short"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena[data-player_height='short']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena[data-player_height="short"] > .player.fullskin2:not(.minskin).unseen2[data-position="0"] > .avatar {
clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px); clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px);
-webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px); -webkit-clip-path: polygon(-10px -10px, 116px -10px, 116px 72px, 106px 72px, 0px 94px, -10px 94px);
} }
#arena.uslim_player>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.uslim_player > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.uslim_player>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.uslim_player > .player.fullskin2:not(.minskin).unseen2[data-position="0"] > .avatar {
height: calc(50% + 18px) !important; height: calc(50% + 18px) !important;
clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px); clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 96px, 114px 96px, 0px 118px, -10px 118px);
} }
#arena.uslim_player[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.uslim_player[data-player_height="default"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.uslim_player[data-player_height='default']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.uslim_player[data-player_height="default"]
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px); clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 86px, 114px 86px, 0px 108px, -10px 108px);
} }
#arena.uslim_player[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.uslim_player[data-player_height="short"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.uslim_player[data-player_height='short']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.uslim_player[data-player_height="short"]
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px); clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px);
-webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px); -webkit-clip-path: polygon(-10px -10px, 124px -10px, 124px 76px, 114px 76px, 0px 98px, -10px 98px);
} }
#arena.lslim_player>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.lslim_player > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.lslim_player>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.lslim_player > .player.fullskin2:not(.minskin).unseen2[data-position="0"] > .avatar {
height: calc(50% + 16px) !important; height: calc(50% + 16px) !important;
clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px); clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 94px, 110px 94px, 0px 116px, -10px 116px);
} }
#arena.lslim_player[data-player_height='default']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.lslim_player[data-player_height="default"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.lslim_player[data-player_height='default']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.lslim_player[data-player_height="default"]
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px); clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 84px, 110px 84px, 0px 106px, -10px 106px);
} }
#arena.lslim_player[data-player_height='short']>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #arena.lslim_player[data-player_height="short"] > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#arena.lslim_player[data-player_height='short']>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #arena.lslim_player[data-player_height="short"]
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px); clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px);
-webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px); -webkit-clip-path: polygon(-10px -10px, 120px -10px, 120px 74px, 110px 74px, 0px 96px, -10px 96px);
} }
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #window[data-radius_size="reduce"] #arena > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #window[data-radius_size="reduce"]
#arena
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
border-radius: 4px 4px 0 0 !important; border-radius: 4px 4px 0 0 !important;
} }
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #window[data-radius_size="off"] #arena > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #window[data-radius_size="off"]
#arena
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
border-radius: 0 0 0 0 !important; border-radius: 0 0 0 0 !important;
} }
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin):not(.unseen2)>.avatar, #window[data-radius_size="increase"] #arena > .player.fullskin2:not(.minskin):not(.unseen2) > .avatar,
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin).unseen2[data-position='0']>.avatar{ #window[data-radius_size="increase"]
#arena
> .player.fullskin2:not(.minskin).unseen2[data-position="0"]
> .avatar {
border-radius: 16px 16px 0 0 !important; border-radius: 16px 16px 0 0 !important;
} }
#arena>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #arena > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#arena>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #arena > .player.fullskin2:not(.minskin).unseen[data-position="0"] > .avatar2 {
border-radius: 0 0 8px 8px !important; border-radius: 0 0 8px 8px !important;
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 14px) !important; height: calc(50% + 14px) !important;
@ -387,115 +403,228 @@
clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px); clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 106px 10px, 116px 10px, 116px 134px, -10px 134px);
} }
#arena.uslim_player>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #arena.uslim_player > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#arena.uslim_player>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #arena.uslim_player > .player.fullskin2:not(.minskin).unseen[data-position="0"] > .avatar2 {
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 18px) !important; height: calc(50% + 18px) !important;
clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px); clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 114px 10px, 124px 10px, 124px 138px, -10px 138px);
} }
#arena.lslim_player>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #arena.lslim_player > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#arena.lslim_player>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #arena.lslim_player > .player.fullskin2:not(.minskin).unseen[data-position="0"] > .avatar2 {
top: calc(50% - 21px) !important; top: calc(50% - 21px) !important;
height: calc(50% + 16px) !important; height: calc(50% + 16px) !important;
clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px); clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px);
-webkit-clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px); -webkit-clip-path: polygon(-10px 32px, 0 32px, 110px 10px, 120px 10px, 120px 136px, -10px 136px);
} }
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #window[data-radius_size="reduce"] #arena > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#window[data-radius_size='reduce'] #arena>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #window[data-radius_size="reduce"]
#arena
> .player.fullskin2:not(.minskin).unseen[data-position="0"]
> .avatar2 {
border-radius: 0 0 4px 4px !important; border-radius: 0 0 4px 4px !important;
} }
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #window[data-radius_size="off"] #arena > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#window[data-radius_size='off'] #arena>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #window[data-radius_size="off"]
#arena
> .player.fullskin2:not(.minskin).unseen[data-position="0"]
> .avatar2 {
border-radius: 0 0 0 0 !important; border-radius: 0 0 0 0 !important;
} }
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin):not(.unseen)>.avatar2, #window[data-radius_size="increase"] #arena > .player.fullskin2:not(.minskin):not(.unseen) > .avatar2,
#window[data-radius_size='increase'] #arena>.player.fullskin2:not(.minskin).unseen[data-position='0']>.avatar2{ #window[data-radius_size="increase"]
#arena
> .player.fullskin2:not(.minskin).unseen[data-position="0"]
> .avatar2 {
border-radius: 0 0 16px 16px !important; border-radius: 0 0 16px 16px !important;
} }
#arena>.player.fullskin2:not(.minskin)>.avatar2{ #arena > .player.fullskin2:not(.minskin) > .avatar2 {
top: calc(50% - 7px) !important; top: calc(50% - 7px) !important;
} }
#arena>.player:not(.minskin)>.identity{ #arena > .player:not(.minskin) > .identity {
left: 102px; left: 102px;
} }
#arena>.player:not(.minskin)>.hp:not(.actcount){ #arena > .player:not(.minskin) > .hp:not(.actcount) {
left: 93px; left: 93px;
} }
/*#arena>.player:not(.minskin)>.hp:not(.actcount).text{ /*#arena>.player:not(.minskin)>.hp:not(.actcount).text{
left: 89px; left: 89px;
}*/ }*/
#arena>.player.fullskin2 .avatar2{ #arena > .player.fullskin2 .avatar2 {
z-index: 2; z-index: 2;
} }
#arena>.player.unseen:not(.unseen2) .count{ #arena > .player.unseen:not(.unseen2) .count {
text-align: left; text-align: left;
border-radius:3px 0 0 3px; border-radius: 3px 0 0 3px;
} }
#arena>.player.unseen2 .count{ #arena > .player.unseen2 .count {
border-radius: 3px; border-radius: 3px;
text-align: center; text-align: center;
} }
#arena .timerbar>div{ #arena .timerbar > div {
top: 205px; top: 205px;
width: 96px; width: 96px;
left: 12px; left: 12px;
} }
#arena[data-player_height='default'] .timerbar>div{ #arena[data-player_height="default"] .timerbar > div {
top: 185px; top: 185px;
} }
#arena[data-player_height='short'] .timerbar>div{ #arena[data-player_height="short"] .timerbar > div {
top: 165px; top: 165px;
} }
#arena .player[data-position='0']>.damage.dieidentity{ #arena .player[data-position="0"] > .damage.dieidentity {
opacity: 1 !important; opacity: 1 !important;
} }
/*--------位置(8人)------*/ /*--------位置(8人)------*/
#arena[data-number='8']>.player[data-position='1']{top:calc(30% - 128px);left:calc(-300% / 94 + 4375% / 47 - 735px + 720px);} #arena[data-number="8"] > .player[data-position="1"] {
#arena[data-number='8']>.player[data-position='2']{top:calc(8% - 34px);left:calc(-300% / 94 + 3750% / 47 - 630px + 600px);} top: calc(30% - 128px);
#arena[data-number='8']>.player[data-position='3']{top:0;left:calc(-300% / 94 + 3125% / 47 - 525px + 480px);} left: calc(-300% / 94 + 4375% / 47 - 735px + 720px);
#arena[data-number='8']>.player[data-position='4']{top:0;left:calc(-300% / 94 + 2500% / 47 - 420px + 360px);} }
#arena[data-number='8']>.player[data-position='5']{top:0;left:calc(-300% / 94 + 1875% / 47 - 315px + 240px);} #arena[data-number="8"] > .player[data-position="2"] {
#arena[data-number='8']>.player[data-position='6']{top:calc(8% - 34px);left:calc(-300% / 94 + 1250% / 47 - 210px + 120px);} top: calc(8% - 34px);
#arena[data-number='8']>.player[data-position='7']{top:calc(30% - 128px);left:calc(-300% / 94 + 625% / 47 - 105px);} left: calc(-300% / 94 + 3750% / 47 - 630px + 600px);
#arena[data-number='8']>.player[data-position='0']{left:calc(-300% / 94 + 625% / 47 - 105px);} }
#arena>.player[data-position='0']{left:0;} #arena[data-number="8"] > .player[data-position="3"] {
@media screen and (min-width: 1105px){ top: 0;
#arena[data-number='8']>.player[data-position='1']{left:calc(100% - 120px);} left: calc(-300% / 94 + 3125% / 47 - 525px + 480px);
#arena[data-number='8']>.player[data-position='2']{left:calc(500% / 6 - 100px);} }
#arena[data-number='8']>.player[data-position='3']{left:calc(400% / 6 - 80px);} #arena[data-number="8"] > .player[data-position="4"] {
#arena[data-number='8']>.player[data-position='4']{left:calc(300% / 6 - 60px);} top: 0;
#arena[data-number='8']>.player[data-position='5']{left:calc(200% / 6 - 40px);} left: calc(-300% / 94 + 2500% / 47 - 420px + 360px);
#arena[data-number='8']>.player[data-position='6']{left:calc(100% / 6 - 20px);} }
#arena[data-number='8']>.player[data-position='7']{left:0;} #arena[data-number="8"] > .player[data-position="5"] {
#arena[data-number='8']>.player[data-position='0']{left:0;} top: 0;
left: calc(-300% / 94 + 1875% / 47 - 315px + 240px);
}
#arena[data-number="8"] > .player[data-position="6"] {
top: calc(8% - 34px);
left: calc(-300% / 94 + 1250% / 47 - 210px + 120px);
}
#arena[data-number="8"] > .player[data-position="7"] {
top: calc(30% - 128px);
left: calc(-300% / 94 + 625% / 47 - 105px);
}
#arena[data-number="8"] > .player[data-position="0"] {
left: calc(-300% / 94 + 625% / 47 - 105px);
}
#arena > .player[data-position="0"] {
left: 0;
}
@media screen and (min-width: 1105px) {
#arena[data-number="8"] > .player[data-position="1"] {
left: calc(100% - 120px);
}
#arena[data-number="8"] > .player[data-position="2"] {
left: calc(500% / 6 - 100px);
}
#arena[data-number="8"] > .player[data-position="3"] {
left: calc(400% / 6 - 80px);
}
#arena[data-number="8"] > .player[data-position="4"] {
left: calc(300% / 6 - 60px);
}
#arena[data-number="8"] > .player[data-position="5"] {
left: calc(200% / 6 - 40px);
}
#arena[data-number="8"] > .player[data-position="6"] {
left: calc(100% / 6 - 20px);
}
#arena[data-number="8"] > .player[data-position="7"] {
left: 0;
}
#arena[data-number="8"] > .player[data-position="0"] {
left: 0;
}
} }
/*--------位置(7人)------*/ /*--------位置(7人)------*/
#arena[data-number='7']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="7"] > .player[data-position="1"] {
#arena[data-number='7']>.player[data-position='2']{top:calc(8% - 34px);left:calc(80% - 96px);} top: calc(30% - 128px);
#arena[data-number='7']>.player[data-position='3']{top:0;left:calc(60% - 72px);} left: calc(100% - 120px);
#arena[data-number='7']>.player[data-position='4']{top:0;left:calc(40% - 48px);} }
#arena[data-number='7']>.player[data-position='5']{top:calc(8% - 34px);left:calc(20% - 24px);} #arena[data-number="7"] > .player[data-position="2"] {
#arena[data-number='7']>.player[data-position='6']{top:calc(30% - 128px);left:0;} top: calc(8% - 34px);
left: calc(80% - 96px);
}
#arena[data-number="7"] > .player[data-position="3"] {
top: 0;
left: calc(60% - 72px);
}
#arena[data-number="7"] > .player[data-position="4"] {
top: 0;
left: calc(40% - 48px);
}
#arena[data-number="7"] > .player[data-position="5"] {
top: calc(8% - 34px);
left: calc(20% - 24px);
}
#arena[data-number="7"] > .player[data-position="6"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(6人)------*/ /*--------位置(6人)------*/
#arena[data-number='6']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="6"] > .player[data-position="1"] {
#arena[data-number='6']>.player[data-position='2']{top:0px;left:calc(75% - 90px);} top: calc(30% - 128px);
#arena[data-number='6']>.player[data-position='3']{top:0;left:calc(50% - 60px);} left: calc(100% - 120px);
#arena[data-number='6']>.player[data-position='4']{top:0px;left:calc(25% - 30px);} }
#arena[data-number='6']>.player[data-position='5']{top:calc(30% - 128px);left:0;} #arena[data-number="6"] > .player[data-position="2"] {
top: 0px;
left: calc(75% - 90px);
}
#arena[data-number="6"] > .player[data-position="3"] {
top: 0;
left: calc(50% - 60px);
}
#arena[data-number="6"] > .player[data-position="4"] {
top: 0px;
left: calc(25% - 30px);
}
#arena[data-number="6"] > .player[data-position="5"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(5人)------*/ /*--------位置(5人)------*/
#arena[data-number='5']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="5"] > .player[data-position="1"] {
#arena[data-number='5']>.player[data-position='2']{top:0;left:calc(200% / 3 - 80px);} top: calc(30% - 128px);
#arena[data-number='5']>.player[data-position='3']{top:0;left:calc(100% / 3 - 40px);} left: calc(100% - 120px);
#arena[data-number='5']>.player[data-position='4']{top:calc(30% - 128px);left:0;} }
#arena[data-number="5"] > .player[data-position="2"] {
top: 0;
left: calc(200% / 3 - 80px);
}
#arena[data-number="5"] > .player[data-position="3"] {
top: 0;
left: calc(100% / 3 - 40px);
}
#arena[data-number="5"] > .player[data-position="4"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(4人)------*/ /*--------位置(4人)------*/
#arena[data-number='4']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="4"] > .player[data-position="1"] {
#arena[data-number='4']>.player[data-position='2']{top:0;left:calc(50% - 60px);} top: calc(30% - 128px);
#arena[data-number='4']>.player[data-position='3']{top:calc(30% - 128px);left:0;} left: calc(100% - 120px);
}
#arena[data-number="4"] > .player[data-position="2"] {
top: 0;
left: calc(50% - 60px);
}
#arena[data-number="4"] > .player[data-position="3"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(3人)------*/ /*--------位置(3人)------*/
#arena[data-number='3']>.player[data-position='1']{top:calc(60% / 3 - 88px);left:calc(75% + 80px);} #arena[data-number="3"] > .player[data-position="1"] {
#arena[data-number='3']>.player[data-position='2']{top:calc(60% / 3 - 88px);left:calc(25% - 200px);} top: calc(60% / 3 - 88px);
left: calc(75% + 80px);
}
#arena[data-number="3"] > .player[data-position="2"] {
top: calc(60% / 3 - 88px);
left: calc(25% - 200px);
}
/*--------位置(2人)------*/ /*--------位置(2人)------*/
#arena[data-number='2']>.player[data-position='1']{top:0;left:calc(50% - 60px);} #arena[data-number="2"] > .player[data-position="1"] {
top: 0;
left: calc(50% - 60px);
}

306
layout/mobile/equip.css
View File

@ -1,82 +1,81 @@
#arena:not(.chess).textequip .player[data-position='0'] .equips, #arena:not(.chess).textequip .player[data-position="0"] .equips,
.player:not([data-position='0']) .equips, .player:not([data-position="0"]) .equips,
#arena.chess .player .equips{ #arena.chess .player .equips {
width:120px; width: 120px;
height:auto; height: auto;
top:auto; top: auto;
right:auto; right: auto;
bottom:18px; bottom: 18px;
left:10px; left: 10px;
text-align:left; text-align: left;
} }
#arena.slim_player .player:not([data-position='0']) .equips, #arena.slim_player .player:not([data-position="0"]) .equips,
#arena.chess.slim_player .player .equips{ #arena.chess.slim_player .player .equips {
left:7px; left: 7px;
} }
#arena.chess.lslim_player.slim_player .player .equips{ #arena.chess.lslim_player.slim_player .player .equips {
left:5px; left: 5px;
bottom: 17px; bottom: 17px;
} }
#arena.chess.lslim_player.slim_player .player.minskin.linked .equips{ #arena.chess.lslim_player.slim_player .player.minskin.linked .equips {
transform: rotate(90deg) translate(-98px,-5px) scale(0.73) transform: rotate(90deg) translate(-98px, -5px) scale(0.73);
} }
#arena.uslim_player .player:not([data-position='0']) .equips, #arena.uslim_player .player:not([data-position="0"]) .equips,
#arena.chess.uslim_player .player .equips{ #arena.chess.uslim_player .player .equips {
left:3px; left: 3px;
} }
#arena.mslim_player .player:not([data-position='0']) .equips, #arena.mslim_player .player:not([data-position="0"]) .equips,
#arena.chess.mslim_player .player .equips{ #arena.chess.mslim_player .player .equips {
left:5px; left: 5px;
} }
.player:not([data-position='0']).minskin .equips, .player:not([data-position="0"]).minskin .equips,
#arena.chess .player.minskin .equips{ #arena.chess .player.minskin .equips {
transform:scale(0.73); transform: scale(0.73);
transform-origin:bottom left; transform-origin: bottom left;
} }
#arena:not(.chess).textequip .player[data-position="0"] .equips > .card::after,
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card::after, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card::before,
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card::before, .player:not([data-position="0"]) .equips > .card::after,
.player:not([data-position='0']) .equips>.card::after, .player:not([data-position="0"]) .equips > .card::before,
.player:not([data-position='0']) .equips>.card::before, #arena.chess .player .equips > .card::after,
#arena.chess .player .equips>.card::after, #arena.chess .player .equips > .card::before {
#arena.chess .player .equips>.card::before{
visibility: hidden; visibility: hidden;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card,
.player:not([data-position='0']) .equips>.card, .player:not([data-position="0"]) .equips > .card,
#arena.chess .player .equips>.card{ #arena.chess .player .equips > .card {
position:relative; position: relative;
width:100%; width: 100%;
height:22px; height: 22px;
line-height:22px; line-height: 22px;
margin-top:0; margin-top: 0;
margin-bottom:0; margin-bottom: 0;
animation: card_start2x 0.5s; animation: card_start2x 0.5s;
-webkit-animation: card_start2x 0.5s; -webkit-animation: card_start2x 0.5s;
display:block; display: block;
left:0; left: 0;
top:0; top: 0;
transition:all 0.5s; transition: all 0.5s;
color:white; color: white;
border-radius:0; border-radius: 0;
text-shadow:black 0 0 2px; text-shadow: black 0 0 2px;
} }
.player:not([data-position='0']) .equips>.card, .player:not([data-position="0"]) .equips > .card,
#arena.chess .player .equips>.card{ #arena.chess .player .equips > .card {
border-width: 1px 0 0; border-width: 1px 0 0;
border-style:solid; border-style: solid;
border-image:linear-gradient(to right, rgba(0, 0, 0,0.4) 70%,transparent) 100% 0 0; border-image: linear-gradient(to right, rgba(0, 0, 0, 0.4) 70%, transparent) 100% 0 0;
background:linear-gradient(to right,rgba(0,0,0,0.3),transparent), background: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent),
linear-gradient(135deg,rgba(0,0,0,0.5) ,transparent 80%,transparent) !important; linear-gradient(135deg, rgba(0, 0, 0, 0.5), transparent 80%, transparent) !important;
box-shadow:none; box-shadow: none;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.image, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .image,
.player:not([data-position='0']) .equips>.card>.image, .player:not([data-position="0"]) .equips > .card > .image,
#arena.chess .player .equips>.card>.image{ #arena.chess .player .equips > .card > .image {
display:none; display: none;
} }
/*#arena:not(.chess).textequip .player[data-position='0'].unseen .equips>.card, /*#arena:not(.chess).textequip .player[data-position='0'].unseen .equips>.card,
@ -95,133 +94,132 @@
#arena.chess .player.unseen .equips>.card:first-child{ #arena.chess .player.unseen .equips>.card:first-child{
border-image:linear-gradient(transparent,transparent); border-image:linear-gradient(transparent,transparent);
}*/ }*/
.player:not([data-position='0']) .equips>.card.selected, .player:not([data-position="0"]) .equips > .card.selected,
#arena.chess .player .equips>.card.selected{ #arena.chess .player .equips > .card.selected {
background:linear-gradient(to right,rgba(0, 133, 255,0.3),transparent), background: linear-gradient(to right, rgba(0, 133, 255, 0.3), transparent),
linear-gradient(135deg,rgba(0, 133, 255,0.5) ,transparent 80%,transparent) !important; linear-gradient(135deg, rgba(0, 133, 255, 0.5), transparent 80%, transparent) !important;
box-shadow:none !important; box-shadow: none !important;
border-width: 1px 0 0; border-width: 1px 0 0;
border-style:solid; border-style: solid;
border-image:linear-gradient(to right, rgba(0, 103, 205,0.4) 70%,transparent) 100% 0 0; border-image: linear-gradient(to right, rgba(0, 103, 205, 0.4) 70%, transparent) 100% 0 0;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.selected{ #arena:not(.chess).textequip .player[data-position="0"] .equips > .card.selected {
background:linear-gradient(rgba(0, 133, 255,0.6),rgba(0, 133, 255,0.5)) !important; background: linear-gradient(rgba(0, 133, 255, 0.6), rgba(0, 133, 255, 0.5)) !important;
box-shadow: rgba(0,0,0,0.4) 0 1px 0 0 !important; box-shadow: rgba(0, 0, 0, 0.4) 0 1px 0 0 !important;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.fire, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card.fire,
.player:not([data-position='0']) .equips>.card.fire, .player:not([data-position="0"]) .equips > .card.fire,
#arena.chess .player .equips>.card.fire{ #arena.chess .player .equips > .card.fire {
color: rgb(255,119,63); color: rgb(255, 119, 63);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.thunder, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card.thunder,
.player:not([data-position='0']) .equips>.card.thunder, .player:not([data-position="0"]) .equips > .card.thunder,
#arena.chess .player .equips>.card.thunder{ #arena.chess .player .equips > .card.thunder {
color: rgb(117,186,255); color: rgb(117, 186, 255);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.poison, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card.poison,
.player:not([data-position='0']) .equips>.card.poison, .player:not([data-position="0"]) .equips > .card.poison,
#arena.chess .player .equips>.card.poison{ #arena.chess .player .equips > .card.poison {
color: rgb(104,221,127); color: rgb(104, 221, 127);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.brown, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card.brown,
.player:not([data-position='0']) .equips>.card.brown, .player:not([data-position="0"]) .equips > .card.brown,
#arena.chess .player .equips>.card.brown{ #arena.chess .player .equips > .card.brown {
color: rgb(195,161,223); color: rgb(195, 161, 223);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.background, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .background,
.player:not([data-position='0']) .equips>.card>.background, .player:not([data-position="0"]) .equips > .card > .background,
#arena.chess .player .equips>.card>.background{ #arena.chess .player .equips > .card > .background {
display:none !important; display: none !important;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.name2, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .name2,
.player:not([data-position='0']) .equips>.card>.name2, .player:not([data-position="0"]) .equips > .card > .name2,
#arena.chess .player .equips>.card>.name2{ #arena.chess .player .equips > .card > .name2 {
display:block; display: block;
margin-left:5px; margin-left: 5px;
white-space: nowrap; white-space: nowrap;
} }
#arena.oblongcard:not(.chess).textequip .player[data-position='0'] .equips>.card>.name2{ #arena.oblongcard:not(.chess).textequip .player[data-position="0"] .equips > .card > .name2 {
line-height: 29px; line-height: 29px;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>div, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > div,
.player:not([data-position='0']) .equips>.card>div, .player:not([data-position="0"]) .equips > .card > div,
#arena.chess .player .equips>.card>div{ #arena.chess .player .equips > .card > div {
animation:none !important; animation: none !important;
-webkit-animation:none !important; -webkit-animation: none !important;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.name, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .name,
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.info, #arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .info,
.player:not([data-position='0']) .equips>.card>.name, .player:not([data-position="0"]) .equips > .card > .name,
.player:not([data-position='0']) .equips>.card>.info, .player:not([data-position="0"]) .equips > .card > .info,
#arena.chess .player .equips>.card>.name, #arena.chess .player .equips > .card > .name,
#arena.chess .player .equips>.card>.info{ #arena.chess .player .equips > .card > .info {
display:none !important; display: none !important;
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.removing, #arena:not(.chess).textequip .player[data-position="0"] .equips > .removing,
.player:not([data-position='0']) .equips>.removing, .player:not([data-position="0"]) .equips > .removing,
#arena.chess .player .equips>.removing{ #arena.chess .player .equips > .removing {
margin-top:-12px !important; margin-top: -12px !important;
margin-bottom:-11px !important; margin-bottom: -11px !important;
transform:scale(1); transform: scale(1);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.removing+.removing, #arena:not(.chess).textequip .player[data-position="0"] .equips > .removing + .removing,
.player:not([data-position='0']) .equips>.removing+.removing, .player:not([data-position="0"]) .equips > .removing + .removing,
#arena.chess .player .equips>.removing+.removing{ #arena.chess .player .equips > .removing + .removing {
margin-top:-23px !important; margin-top: -23px !important;
} }
#arena:not(.textequip):not(.chess).textequip .player[data-position="0"].linked .equips,
#arena:not(.textequip):not(.chess).textequip .player[data-position='0'].linked .equips, .player:not([data-position="0"]).linked .equips,
.player:not([data-position='0']).linked .equips, #arena.chess .player.linked .equips {
#arena.chess .player.linked .equips{ transform: rotate(90deg) translate(-152px, -6px);
transform:rotate(90deg) translate(-152px,-6px); transform-origin: bottom left;
transform-origin:bottom left;
} }
#arena.slim_player .player:not([data-position='0']).linked .equips, #arena.slim_player .player:not([data-position="0"]).linked .equips,
#arena.chess.slim_player .player.linked .equips{ #arena.chess.slim_player .player.linked .equips {
transform:rotate(90deg) translate(-155px,-6px); transform: rotate(90deg) translate(-155px, -6px);
} }
#arena.uslim_player .player:not([data-position='0']).linked .equips, #arena.uslim_player .player:not([data-position="0"]).linked .equips,
#arena.chess.uslim_player .player.linked .equips{ #arena.chess.uslim_player .player.linked .equips {
transform:rotate(90deg) translate(-159px,-6px); transform: rotate(90deg) translate(-159px, -6px);
} }
#arena.mslim_player .player:not([data-position='0']).linked .equips, #arena.mslim_player .player:not([data-position="0"]).linked .equips,
#arena.chess.mslim_player .player.linked .equips{ #arena.chess.mslim_player .player.linked .equips {
transform:rotate(90deg) translate(-157px,-6px); transform: rotate(90deg) translate(-157px, -6px);
} }
.player:not([data-position='0']).minskin.linked .equips, .player:not([data-position="0"]).minskin.linked .equips,
#arena.chess .player.minskin.linked .equips{ #arena.chess .player.minskin.linked .equips {
transform:rotate(90deg) translate(-92px,-6px) scale(0.73); transform: rotate(90deg) translate(-92px, -6px) scale(0.73);
} }
#arena.slim_player .player:not([data-position='0']).minskin.linked .equips, #arena.slim_player .player:not([data-position="0"]).minskin.linked .equips,
#arena.chess.slim_player .player.minskin.linked .equips{ #arena.chess.slim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-95px,-6px) scale(0.73); transform: rotate(90deg) translate(-95px, -6px) scale(0.73);
} }
#arena.uslim_player .player:not([data-position='0']).minskin.linked .equips, #arena.uslim_player .player:not([data-position="0"]).minskin.linked .equips,
#arena.chess.uslim_player .player.minskin.linked .equips{ #arena.chess.uslim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-99px,-6px) scale(0.73); transform: rotate(90deg) translate(-99px, -6px) scale(0.73);
} }
#arena.mslim_player .player:not([data-position='0']).minskin.linked .equips, #arena.mslim_player .player:not([data-position="0"]).minskin.linked .equips,
#arena.chess.mslim_player .player.minskin.linked .equips{ #arena.chess.mslim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-97px,-6px) scale(0.73); transform: rotate(90deg) translate(-97px, -6px) scale(0.73);
} }
.player:not([data-position='0']).linked .identity, .player:not([data-position="0"]).linked .identity,
#arena.chess .player.linked .identity{ #arena.chess .player.linked .identity {
transform:rotate(90deg); transform: rotate(90deg);
} }
#arena:not(.chess).textequip .player[data-position='0'] .equips>.card{ #arena:not(.chess).textequip .player[data-position="0"] .equips > .card {
border-radius: 0px !important; border-radius: 0px !important;
left:0 !important; left: 0 !important;
right: auto !important; right: auto !important;
top:0 !important; top: 0 !important;
bottom: auto !important; bottom: auto !important;
position: relative !important; position: relative !important;
height: 20% !important; height: 20% !important;
background:none !important; background: none !important;
box-shadow: rgba(0,0,0,0.4) 0 1px 0 0; box-shadow: rgba(0, 0, 0, 0.4) 0 1px 0 0;
} }

345
layout/mobile/layout.css
View File

@ -1,129 +1,129 @@
@import "../newlayout/global.css"; @import "../newlayout/global.css";
@import "equip.css"; @import "equip.css";
#arena{ #arena {
height: calc(95% + 20px); height: calc(95% + 20px);
} }
#arena.oblongcard:not(.chess):not(.nome){ #arena.oblongcard:not(.chess):not(.nome) {
height: 95%; height: 95%;
} }
#arena.oblongcard:not(.chess):not(.nome) #me, #arena.oblongcard:not(.chess):not(.nome) #me,
#arena.oblongcard:not(.chess):not(.nome) #mebg{ #arena.oblongcard:not(.chess):not(.nome) #mebg {
height: 140px; height: 140px;
bottom: 10px; bottom: 10px;
} }
#historybar{ #historybar {
height: calc(95% - 160px); height: calc(95% - 160px);
} }
#window.oblongcard #historybar{ #window.oblongcard #historybar {
height: calc(95% - 180px); height: calc(95% - 180px);
} }
#control{ #control {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
bottom:150px; bottom: 150px;
height: 40px; height: 40px;
} }
#arena.choose-to-move>#control, #arena.choose-to-move > #control,
#arena.discard-player-card>#control, #arena.discard-player-card > #control,
#arena.gain-player-card>#control, #arena.gain-player-card > #control,
#arena.choose-player-card>#control{ #arena.choose-player-card > #control {
bottom: 30px; bottom: 30px;
transition: all 0s; transition: all 0s;
} }
#arena.phone.discard-player-card>#control, #arena.phone.discard-player-card > #control,
#arena.phone.gain-player-card>#control, #arena.phone.gain-player-card > #control,
#arena.phone.choose-player-card>#control, #arena.phone.choose-player-card > #control,
#arena.phone.choose-to-move>#control{ #arena.phone.choose-to-move > #control {
bottom: 43px; bottom: 43px;
} }
#arena.ipad.discard-player-card>#control, #arena.ipad.discard-player-card > #control,
#arena.ipad.gain-player-card>#control, #arena.ipad.gain-player-card > #control,
#arena.ipad.choose-player-card>#control, #arena.ipad.choose-player-card > #control,
#arena.ipad.choose-to-move>#control{ #arena.ipad.choose-to-move > #control {
bottom: 45px; bottom: 45px;
} }
#arena:not(.chess)>#me, #arena:not(.chess) > #me,
#arena:not(.chess)>#mebg, #arena:not(.chess) > #mebg,
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
bottom:30px; bottom: 30px;
width: calc(5000% / 47); width: calc(5000% / 47);
left:calc(-150% / 47); left: calc(-150% / 47);
top:auto; top: auto;
border-radius:0 !important; border-radius: 0 !important;
height:120px; height: 120px;
} }
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
} }
#window.leftbar #arena:not(.chess)>#me, #window.leftbar #arena:not(.chess) > #me,
#window.leftbar #arena:not(.chess)>#mebg, #window.leftbar #arena:not(.chess) > #mebg,
#window.leftbar #arena:not(.chess)>#autonode, #window.leftbar #arena:not(.chess) > #autonode,
#window.leftbar #arena:not(.chess) .player[data-position='0']{ #window.leftbar #arena:not(.chess) .player[data-position="0"] {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 50px - 75px / 47); left: calc(-150% / 47 - 50px - 75px / 47);
} }
#window.leftbar #arena:not(.chess)>#autonode{ #window.leftbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 50px - 75px / 47 + 120px); left: calc(-150% / 47 - 50px - 75px / 47 + 120px);
} }
#window.rightbar #arena:not(.chess)>#me, #window.rightbar #arena:not(.chess) > #me,
#window.rightbar #arena:not(.chess)>#mebg, #window.rightbar #arena:not(.chess) > #mebg,
#window.rightbar #arena:not(.chess)>#autonode, #window.rightbar #arena:not(.chess) > #autonode,
#window.rightbar #arena:not(.chess) .player[data-position='0']{ #window.rightbar #arena:not(.chess) .player[data-position="0"] {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 75px / 47); left: calc(-150% / 47 - 75px / 47);
} }
#window.rightbar #arena:not(.chess)>#autonode{ #window.rightbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 75px / 47 + 120px); left: calc(-150% / 47 - 75px / 47 + 120px);
} }
#arena:not(.chess) #handcards1{ #arena:not(.chess) #handcards1 {
height:120px; height: 120px;
padding:0; padding: 0;
top:calc(100% - 120px); top: calc(100% - 120px);
} }
#arena:not(.chess):not(.single-handcard) #handcards1{ #arena:not(.chess):not(.single-handcard) #handcards1 {
width:calc(100% - 240px); width: calc(100% - 240px);
left:120px; left: 120px;
} }
#handcards2{ #handcards2 {
display:none; display: none;
} }
/*#arena:not(.chess) .player[data-position='0']>.playerjiu{ /*#arena:not(.chess) .player[data-position='0']>.playerjiu{
width: 120px; width: 120px;
border-radius: 0px; border-radius: 0px;
}*/ }*/
#arena:not(.chess) .player[data-position='0'].playerfocus{ #arena:not(.chess) .player[data-position="0"].playerfocus {
transform: scale(1); transform: scale(1);
} }
#arena:not(.chess) .player[data-position='0']>.equips>div:not(.equip5){ #arena:not(.chess) .player[data-position="0"] > .equips > div:not(.equip5) {
width: 45px; width: 45px;
height: 45px; height: 45px;
margin: 0; margin: 0;
border-radius: 4px; border-radius: 4px;
position: absolute; position: absolute;
} }
#arena:not(.chess) .player[data-position='0']>.equips>div:not(.equip5)>.image{ #arena:not(.chess) .player[data-position="0"] > .equips > div:not(.equip5) > .image {
width: 100%; width: 100%;
height: 100%; height: 100%;
left: 0; left: 0;
top: 0; top: 0;
} }
#arena:not(.chess) .player[data-position='0']>.equips>div:not(.equip5)>.name{ #arena:not(.chess) .player[data-position="0"] > .equips > div:not(.equip5) > .name {
display: block; display: block;
transform: scale(0.43) !important; transform: scale(0.43) !important;
transform-origin: left top; transform-origin: left top;
left: 2px; left: 2px;
top: 3px; top: 3px;
} }
#arena:not(.chess) .player[data-position='0']>.equips>div:not(.equip5)>.name.long{ #arena:not(.chess) .player[data-position="0"] > .equips > div:not(.equip5) > .name.long {
top: 2px; top: 2px;
} }
#arena:not(.chess) .player[data-position='0']>.equips>div:not(.equip5)>.info{ #arena:not(.chess) .player[data-position="0"] > .equips > div:not(.equip5) > .info {
display: block; display: block;
transform: scale(0.43) !important; transform: scale(0.43) !important;
transform-origin: right top; transform-origin: right top;
@ -139,53 +139,53 @@
left: -20%; left: -20%;
top: 0%; top: 0%;
}*/ }*/
#arena:not(.chess):not(.textequip) .player[data-position='0']>.equips>div.legend{ #arena:not(.chess):not(.textequip) .player[data-position="0"] > .equips > div.legend {
border: 1px solid rgb(192, 90, 255); border: 1px solid rgb(192, 90, 255);
} }
#arena:not(.chess):not(.textequip) .player[data-position='0']>.equips>div.epic{ #arena:not(.chess):not(.textequip) .player[data-position="0"] > .equips > div.epic {
border: 1px solid rgb(90, 171, 255); border: 1px solid rgb(90, 171, 255);
} }
#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5{ #arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
border-radius: 100%; border-radius: 100%;
} }
#arena:not(.chess) .player[data-position='0']{ #arena:not(.chess) .player[data-position="0"] {
width: calc(5000% / 47); width: calc(5000% / 47);
left:calc(-150% / 47); left: calc(-150% / 47);
height: 120px; height: 120px;
top: calc(100% - 150px); top: calc(100% - 150px);
background: none !important; background: none !important;
border:none !important; border: none !important;
border-radius: 0 !important; border-radius: 0 !important;
pointer-events: none; pointer-events: none;
} }
#arena:not(.chess) .player[data-position='0']>.turned{ #arena:not(.chess) .player[data-position="0"] > .turned {
width: 120px; width: 120px;
} }
#arena:not(.chess) .player[data-position='0']>.chain{ #arena:not(.chess) .player[data-position="0"] > .chain {
width: 120px width: 120px;
} }
#arena.oblongcard:not(.chess) .player[data-position='0']{ #arena.oblongcard:not(.chess) .player[data-position="0"] {
height: 140px; height: 140px;
} }
#arena:not(.chess) .player[data-position='0'].linked>.damage{ #arena:not(.chess) .player[data-position="0"].linked > .damage {
transform:scale(0.7) rotate(0); transform: scale(0.7) rotate(0);
} }
#arena:not(.chess) .player[data-position='0'].linked>.damage.damageadded{ #arena:not(.chess) .player[data-position="0"].linked > .damage.damageadded {
transform:scale(1) rotate(0); transform: scale(1) rotate(0);
} }
#arena:not(.chess) .player[data-position='0']:not(.selected):not(.selectedx):not(.selectable):not(.glow){ #arena:not(.chess) .player[data-position="0"]:not(.selected):not(.selectedx):not(.selectable):not(.glow) {
box-shadow: none !important; box-shadow: none !important;
} }
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.avatar, #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .avatar,
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.avatar2, #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .avatar2,
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.equips{ #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .equips {
width:120px; width: 120px;
height:100%; height: 100%;
border-radius:0px !important; border-radius: 0px !important;
top:0; top: 0;
left:0; left: 0;
transition-property: opacity,transform; transition-property: opacity, transform;
transition-duration: 0.5s; transition-duration: 0.5s;
pointer-events: auto; pointer-events: auto;
/*-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 180px, -10px 180px);*/ /*-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 180px, -10px 180px);*/
@ -195,168 +195,179 @@
#window.compatiblemode #arena:not(.chess) .player[data-position='0']:not(.minskin)>.equips{ #window.compatiblemode #arena:not(.chess) .player[data-position='0']:not(.minskin)>.equips{
-webkit-clip-path: none; -webkit-clip-path: none;
}*/ }*/
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.identity{ #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .identity {
pointer-events: auto; pointer-events: auto;
} }
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.judges, #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .judges,
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.marks{ #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .marks {
pointer-events: auto; pointer-events: auto;
} }
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.equips{ #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .equips {
left:calc(100% - 120px); left: calc(100% - 120px);
}
#arena:not(.chess) .player[data-position="0"] > .equips > .equip1 {
top: 10px;
left: 10px;
}
#arena:not(.chess) .player[data-position="0"] > .equips > .equip2 {
top: 10px;
right: 10px;
}
#arena:not(.chess) .player[data-position="0"] > .equips > .equip3 {
bottom: 10px;
left: 10px;
}
#arena:not(.chess) .player[data-position="0"] > .equips > .equip4 {
bottom: 10px;
right: 10px;
}
#arena:not(.chess) .player[data-position="0"] > .equips > .equip6 {
bottom: 10px;
right: 10px;
} }
#arena:not(.chess) .player[data-position='0']>.equips>.equip1{top: 10px;left: 10px;}
#arena:not(.chess) .player[data-position='0']>.equips>.equip2{top: 10px;right: 10px;}
#arena:not(.chess) .player[data-position='0']>.equips>.equip3{bottom: 10px;left: 10px;}
#arena:not(.chess) .player[data-position='0']>.equips>.equip4{bottom: 10px;right: 10px;}
#arena:not(.chess) .player[data-position='0']>.equips>.equip6{bottom: 10px;right: 10px;}
#arena:not(.chess) .player[data-position='0']>.name, #arena:not(.chess) .player[data-position="0"] > .name,
#arena:not(.chess) .player[data-position='0'].linked>.name{ #arena:not(.chess) .player[data-position="0"].linked > .name {
left:4px; left: 4px;
top:10px; top: 10px;
transform: none; transform: none;
} }
#arena:not(.chess) .player[data-position='0']>.nameol{ #arena:not(.chess) .player[data-position="0"] > .nameol {
display: none; display: none;
} }
#arena:not(.chess) .player[data-position='0']>.name.name2, #arena:not(.chess) .player[data-position="0"] > .name.name2,
#arena:not(.chess) .player[data-position='0'].linked>.name.name2{ #arena:not(.chess) .player[data-position="0"].linked > .name.name2 {
left:69px; left: 69px;
} }
#arena:not(.chess):not(.stone) .player[data-position='0']>.identity{ #arena:not(.chess):not(.stone) .player[data-position="0"] > .identity {
left: 0; left: 0;
width: 130px; width: 130px;
} }
#arena:not(.chess) .player[data-position='0']>.damage{ #arena:not(.chess) .player[data-position="0"] > .damage {
width: 120px; width: 120px;
} }
#arena:not(.chess) .player[data-position='0'].target{ #arena:not(.chess) .player[data-position="0"].target {
transform:none !important; transform: none !important;
} }
#arena:not(.chess) .player[data-position='0']>.hp:not(.actcount){ #arena:not(.chess) .player[data-position="0"] > .hp:not(.actcount) {
bottom: 5px; bottom: 5px;
left: 100px; left: 100px;
} }
#arena:not(.chess) .player[data-position='0']:not(.minskin)>.count{ #arena:not(.chess) .player[data-position="0"]:not(.minskin) > .count {
bottom:10px; bottom: 10px;
border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0;
left:-1px; left: -1px;
z-index: 3; z-index: 3;
text-align: right; text-align: right;
} }
#arena:not(.chess).slim_player .player[data-position='0']:not(.minskin)>.count{ #arena:not(.chess).slim_player .player[data-position="0"]:not(.minskin) > .count {
border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0;
left:-1px; left: -1px;
z-index: 3; z-index: 3;
text-align: right; text-align: right;
} }
#arena:not(.chess) .player[data-position='0']>.hp.actcount{ #arena:not(.chess) .player[data-position="0"] > .hp.actcount {
top:10px; top: 10px;
left:2px; left: 2px;
} }
#arena:not(.chess) .player.fullskin2[data-position='0']:not(.minskin)>.avatar, #arena:not(.chess) .player.fullskin2[data-position="0"]:not(.minskin) > .avatar,
#arena:not(.chess) .player.fullskin2[data-position='0']:not(.minskin)>.avatar2{ #arena:not(.chess) .player.fullskin2[data-position="0"]:not(.minskin) > .avatar2 {
width:60px; width: 60px;
background-position:50%; background-position: 50%;
} }
#arena:not(.chess) .player.fullskin2[data-position='0']:not(.minskin)>.avatar2{ #arena:not(.chess) .player.fullskin2[data-position="0"]:not(.minskin) > .avatar2 {
left:60px; left: 60px;
top:0; top: 0;
z-index:1; z-index: 1;
} }
.popup[data-position='0']{ .popup[data-position="0"] {
top:calc(100% - 187px); top: calc(100% - 187px);
left:calc(-150% / 47 + 15px); left: calc(-150% / 47 + 15px);
} }
#arena:not(.chess) .player[data-position='0']>.judges{ #arena:not(.chess) .player[data-position="0"] > .judges {
left: 6px; left: 6px;
top: -16px; top: -16px;
transform: none; transform: none;
} }
#arena:not(.chess) .player[data-position='0']>.marks { #arena:not(.chess) .player[data-position="0"] > .marks {
right: -6px; right: -6px;
left:auto; left: auto;
top: -16px; top: -16px;
transform: none; transform: none;
} }
#arena:not(.chess) .player[data-position='0'].linked{ #arena:not(.chess) .player[data-position="0"].linked {
transform: none; transform: none;
} }
#arena:not(.chess) .player[data-position='0'].linked .avatar, #arena:not(.chess) .player[data-position="0"].linked .avatar,
#arena:not(.chess) .player[data-position='0'].linked .avatar2{ #arena:not(.chess) .player[data-position="0"].linked .avatar2 {
transform: rotate(-90deg); transform: rotate(-90deg);
} }
#arena:not(.chess) .player[data-position='0'].fullskin2 .avatar{ #arena:not(.chess) .player[data-position="0"].fullskin2 .avatar {
transform-origin: right center; transform-origin: right center;
} }
#arena:not(.chess) .player[data-position='0'].fullskin2 .avatar2{ #arena:not(.chess) .player[data-position="0"].fullskin2 .avatar2 {
transform-origin: left center; transform-origin: left center;
} }
.dialog{ .dialog {
height:calc(100% - 370px); height: calc(100% - 370px);
bottom:170px; bottom: 170px;
} }
.dialog.fullheight { .dialog.fullheight {
height: calc(100% - 123px) !important; height: calc(100% - 123px) !important;
top: 40px !important; top: 40px !important;
} }
#me>.fakeme.avatar{ #me > .fakeme.avatar {
width:120px; width: 120px;
height:100%; height: 100%;
border-radius:0px; border-radius: 0px;
top:0; top: 0;
left:0; left: 0;
background-size:cover; background-size: cover;
clip-path: polygon(-10px 0, 130px 0, 130px 150px, -10px 150px); clip-path: polygon(-10px 0, 130px 0, 130px 150px, -10px 150px);
-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 150px, -10px 150px); -webkit-clip-path: polygon(-10px 0, 130px 0, 130px 150px, -10px 150px);
} }
#window[data-radius_size='increase'] #me>.fakeme.avatar, #window[data-radius_size="increase"] #me > .fakeme.avatar,
#window[data-radius_size='reduce'] #me>.fakeme.avatar{ #window[data-radius_size="reduce"] #me > .fakeme.avatar {
border-radius:0px; border-radius: 0px;
} }
#arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position='0']>.equips>.equip1, #arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position="0"] > .equips > .equip1,
#arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position='0']>.equips>.equip2{ #arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position="0"] > .equips > .equip2 {
top:20px; top: 20px;
} }
#arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position='0']>.equips>.equip3, #arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position="0"] > .equips > .equip3,
#arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position='0']>.equips>.equip4, #arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position="0"] > .equips > .equip4,
#arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position='0']>.equips>.equip6{ #arena.mobile.oblongcard:not(.chess):not(.textequip) .player[data-position="0"] > .equips > .equip6 {
bottom:20px; bottom: 20px;
} }
#arena.mobile.oblongcard.textequip:not(.chess) .player[data-position="0"] .equips > .removing {
#arena.mobile.oblongcard.textequip:not(.chess) .player[data-position='0'] .equips>.removing{ margin-top: -14px !important;
margin-top:-14px !important; margin-bottom: -14px !important;
margin-bottom:-14px !important; transform: scale(1);
transform:scale(1);
} }
#arena.mobile.oblongcard:not(.chess) #handcards1 {
#arena.mobile.oblongcard:not(.chess) #handcards1{
height: 100%; height: 100%;
top: 2px; top: 2px;
} }
#arena.mobile.oblongcard:not(.chess)>.card, #arena.mobile.oblongcard:not(.chess) > .card,
#arena.mobile.oblongcard:not(.chess) .handcards>.card{ #arena.mobile.oblongcard:not(.chess) .handcards > .card {
height: 120px; height: 120px;
} }
#arena.mobile.oblongcard:not(.chess)>.card>.image, #arena.mobile.oblongcard:not(.chess) > .card > .image,
#arena.mobile.oblongcard:not(.chess) .handcards>.card>.image{ #arena.mobile.oblongcard:not(.chess) .handcards > .card > .image {
height: 110px; height: 110px;
top: 8px; top: 8px;
background-position-x: -3px; background-position-x: -3px;
} }
#arena.phone.oblongcard:not(.chess):not(.nome) {
#arena.phone.oblongcard:not(.chess):not(.nome){
height: calc(97% + 10px); height: calc(97% + 10px);
} }

48
layout/mode/boss.css
View File

@ -9,63 +9,63 @@
overflow-x: scroll; overflow-x: scroll;
} }
#window[data-radius_size='reduce'] #bosslist>.player { #window[data-radius_size="reduce"] #bosslist > .player {
border-radius: 4px; border-radius: 4px;
} }
#window[data-radius_size='off'] #bosslist>.player { #window[data-radius_size="off"] #bosslist > .player {
border-radius: 0px; border-radius: 0px;
} }
#window[data-radius_size='increase'] #bosslist>.player { #window[data-radius_size="increase"] #bosslist > .player {
border-radius: 20px; border-radius: 20px;
} }
#window #bosslist>.player { #window #bosslist > .player {
border-radius: 10px; border-radius: 10px;
} }
#window[data-player_border='normal'] #bosslist>.player>.avatar { #window[data-player_border="normal"] #bosslist > .player > .avatar {
left: 8px; left: 8px;
top: 8px; top: 8px;
width: 164px; width: 164px;
height: 200px; height: 200px;
} }
#window[data-player_border='slim'] #bosslist>.player>.avatar { #window[data-player_border="slim"] #bosslist > .player > .avatar {
left: 4px; left: 4px;
top: 4px; top: 4px;
width: 172px; width: 172px;
height: 208px; height: 208px;
} }
.bosspaused>#bosslist, .bosspaused > #bosslist,
.bosspaused>#control, .bosspaused > #control,
.bosspaused>.dialog.bosscharacter { .bosspaused > .dialog.bosscharacter {
opacity: 0.2 !important; opacity: 0.2 !important;
} }
#bosslist.hidden>.player { #bosslist.hidden > .player {
transition: all 0s; transition: all 0s;
} }
#bosslist>div:first-child, #bosslist > div:first-child,
#bosslist>div:last-child { #bosslist > div:last-child {
width: 20px; width: 20px;
position: relative; position: relative;
} }
#bosslist>.player .identity { #bosslist > .player .identity {
align-items: flex-start; align-items: flex-start;
width: min-content; width: min-content;
} }
#bosslist>.player .identity>div { #bosslist > .player .identity > div {
writing-mode: vertical-rl; writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl;
} }
#window:not(.nopointer) #bosslist>.player { #window:not(.nopointer) #bosslist > .player {
cursor: pointer; cursor: pointer;
} }
@ -74,7 +74,7 @@
} }
.dialog.bosscharacter .buttons .button:not(.selectable) { .dialog.bosscharacter .buttons .button:not(.selectable) {
opacity: 0.6 opacity: 0.6;
} }
.player.bossplayer.bossing { .player.bossplayer.bossing {
@ -90,7 +90,7 @@
opacity: 1; opacity: 1;
} }
#bosslist.removing>.player.bossplayer.highlight { #bosslist.removing > .player.bossplayer.highlight {
transition: all 0s; transition: all 0s;
opacity: 0; opacity: 0;
} }
@ -108,23 +108,23 @@
-webkit-animation: game_start 0.5s; -webkit-animation: game_start 0.5s;
} }
.player.bossplayer>div:not(.hp):not(.identity):not(.avatar):not(.framebg) { .player.bossplayer > div:not(.hp):not(.identity):not(.avatar):not(.framebg) {
display: none !important; display: none !important;
} }
.player.bossplayer>.identity { .player.bossplayer > .identity {
left: 16px; left: 16px;
top: 18px; top: 18px;
line-height: 24px; line-height: 24px;
white-space: normal; white-space: normal;
} }
.player.bossplayer>.hp { .player.bossplayer > .hp {
top: 22px; top: 22px;
left: 144px; left: 144px;
} }
.player.bossplayer>.avatar { .player.bossplayer > .avatar {
width: 160px; width: 160px;
height: 196px; height: 196px;
} }
@ -152,18 +152,18 @@
position: relative; position: relative;
} }
.bosschongzheng>div { .bosschongzheng > div {
width: 100%; width: 100%;
display: block; display: block;
margin-bottom: 5px; margin-bottom: 5px;
} }
.bosschongzheng>div>div:first-child { .bosschongzheng > div > div:first-child {
text-align: left; text-align: left;
width: 30%; width: 30%;
} }
.bosschongzheng>div>div:last-child { .bosschongzheng > div > div:last-child {
text-align: right; text-align: right;
width: 70%; width: 70%;
} }

323
layout/mode/chess.css
View File

@ -1,22 +1,22 @@
#arena.chess{ #arena.chess {
width:100% !important; width: 100% !important;
height:100% !important; height: 100% !important;
left:0 !important; left: 0 !important;
top:0 !important; top: 0 !important;
transition:all 0s !important; transition: all 0s !important;
} }
#arena.chess>#me, #arena.chess > #me,
#arena.chess>#mebg, #arena.chess > #mebg,
#arena.chess>#autonode{ #arena.chess > #autonode {
bottom:0; bottom: 0;
top:auto; top: auto;
border-radius:0; border-radius: 0;
} }
#arena.chess>#autonode{ #arena.chess > #autonode {
width: calc(100% - 240px); width: calc(100% - 240px);
left: 120px; left: 120px;
} }
#me>.fakeme.avatar { #me > .fakeme.avatar {
width: 120px; width: 120px;
height: 120px; height: 120px;
border-radius: 0px; border-radius: 0px;
@ -26,119 +26,121 @@
clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); -webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
} }
#window:not(.nopointer) .dialog.fullheight .buttons .button.character:not(.squarebutton):not(.selectable){ #window:not(.nopointer) .dialog.fullheight .buttons .button.character:not(.squarebutton):not(.selectable) {
cursor: default; cursor: default;
} }
#window:not(.nopointer) .obstacle.glow, #window:not(.nopointer) .obstacle.glow,
#window:not(.nopointer) .player.playerblank.glow{ #window:not(.nopointer) .player.playerblank.glow {
cursor: pointer; cursor: pointer;
} }
#chess-container{ #chess-container {
width:100%; width: 100%;
height :calc(100% - 121px); height: calc(100% - 121px);
left:0; left: 0;
top:0; top: 0;
overflow:hidden; overflow: hidden;
text-align:center; text-align: center;
position: absolute; position: absolute;
} }
#chess{ #chess {
margin-top:36px; margin-top: 36px;
margin-bottom:36px; margin-bottom: 36px;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
transition: all 0s; transition: all 0s;
} }
#arena .card.thrown{ #arena .card.thrown {
z-index:4; z-index: 4;
} }
#canvas2{ #canvas2 {
position: absolute; position: absolute;
z-index: 10; z-index: 10;
pointer-events: none; pointer-events: none;
} }
#handcards1{ #handcards1 {
height:120px; height: 120px;
padding:0; padding: 0;
top:calc(100% - 120px); top: calc(100% - 120px);
width:calc(100% - 240px); width: calc(100% - 240px);
left:120px; left: 120px;
} }
#handcards2{ #handcards2 {
display:none; display: none;
} }
#mebg,#me,#autonode{ #mebg,
height:120px; #me,
#autonode {
height: 120px;
} }
#window:not(.nopointer) .dialog.pointerbutton .buttons .button:not(.unselectable){ #window:not(.nopointer) .dialog.pointerbutton .buttons .button:not(.unselectable) {
cursor: pointer !important; cursor: pointer !important;
} }
#system{ #system {
z-index:5; z-index: 5;
} }
#arena>.dialog{ #arena > .dialog {
width:400px; width: 400px;
height:240px; height: 240px;
left:calc(50% - 200px); left: calc(50% - 200px);
top:calc(50% - 120px); top: calc(50% - 120px);
background: rgba(0,0,0,0.2); background: rgba(0, 0, 0, 0.2);
box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px; box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px;
border-radius:8px; border-radius: 8px;
} }
#arena.chess>.dialog{ #arena.chess > .dialog {
height: calc(50% - 20px); height: calc(50% - 20px);
max-height: 240px; max-height: 240px;
} }
#window[data-radius_size='reduce']>.dialog{ #window[data-radius_size="reduce"] > .dialog {
border-radius:4px; border-radius: 4px;
} }
#window[data-radius_size='off']>.dialog{ #window[data-radius_size="off"] > .dialog {
border-radius:0px; border-radius: 0px;
} }
#window[data-radius_size='increase']>.dialog{ #window[data-radius_size="increase"] > .dialog {
border-radius:16px; border-radius: 16px;
} }
#arena>.dialog.slim:not(.center){ #arena > .dialog.slim:not(.center) {
top:40px; top: 40px;
pointer-events: none; pointer-events: none;
} }
#control{ #control {
top:calc(100% - 155px); top: calc(100% - 155px);
} }
#arena.ipad #control{ #arena.ipad #control {
top:calc(100% - 165px); top: calc(100% - 165px);
} }
.fakeme{ .fakeme {
width:120px; width: 120px;
height:120px; height: 120px;
border-radius:0px !important; border-radius: 0px !important;
top:0; top: 0;
} }
#window[data-radius_size='increase'] .fakeme, #window[data-radius_size="increase"] .fakeme,
#window[data-radius_size='reduce'] .fakeme{ #window[data-radius_size="reduce"] .fakeme {
border-radius:0px; border-radius: 0px;
} }
.fakeme.avatar{ .fakeme.avatar {
left:0; left: 0;
background-size:cover; background-size: cover;
} }
.fakeme.player{ .fakeme.player {
left:calc(100% - 120px); left: calc(100% - 120px);
text-align:center; text-align: center;
transition: all 0s; transition: all 0s;
clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); -webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
} }
.fakeme.player.zoomed{ .fakeme.player.zoomed {
width: 240px; width: 240px;
height: 240px; height: 240px;
left:calc(100% - 240px); left: calc(100% - 240px);
top:calc(100% - 240px); top: calc(100% - 240px);
background-size:200%; background-size: 200%;
} }
.fakeme.player>div{ .fakeme.player > div {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0; margin: 0;
@ -147,7 +149,7 @@
left: 0; left: 0;
top: 0; top: 0;
} }
.fakeme.player.zoomed>div>div{ .fakeme.player.zoomed > div > div {
width: 90px; width: 90px;
height: 90px; height: 90px;
left: 0; left: 0;
@ -156,71 +158,72 @@
margin-right: 8px; margin-right: 8px;
margin-bottom: 16px; margin-bottom: 16px;
} }
.fakeme.player>div>div{ .fakeme.player > div > div {
width:45px; width: 45px;
height:45px; height: 45px;
background-size:cover; background-size: cover;
border-radius:4px; border-radius: 4px;
position:relative; position: relative;
left:0; left: 0;
top:8px; top: 8px;
margin-left: 4px; margin-left: 4px;
margin-right: 4px; margin-right: 4px;
margin-bottom: 8px; margin-bottom: 8px;
transition:box-shadow 0.5s; transition: box-shadow 0.5s;
} }
#window:not(.nopointer) .fakeme.player>div>div{ #window:not(.nopointer) .fakeme.player > div > div {
cursor: pointer; cursor: pointer;
} }
.fakeme.player>div>.selectable{ .fakeme.player > div > .selectable {
box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 1) 0 0 5px, rgba(0, 133, 255, 1) 0 0 10px; box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 1) 0 0 5px, rgba(0, 133, 255, 1) 0 0 10px;
} }
.fakeme.player>div>.selected{ .fakeme.player > div > .selected {
box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(255, 0, 0, 1) 0 0 5px, rgba(255, 0, 0, 1) 0 0 10px !important; box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(255, 0, 0, 1) 0 0 5px, rgba(255, 0, 0, 1) 0 0 10px !important;
} }
.fakeme.player>div>.dead{ .fakeme.player > div > .dead {
filter:grayscale(1); filter: grayscale(1);
-webkit-filter:grayscale(1); -webkit-filter: grayscale(1);
opacity:0.5; opacity: 0.5;
} }
.card.drawing{ .card.drawing {
animation: drawing2 1s; animation: drawing2 1s;
animation-fill-mode: forwards; animation-fill-mode: forwards;
-webkit-animation: drawing2 1s; -webkit-animation: drawing2 1s;
-webkit-animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards;
} }
.player.playergrid,.player.obstacle{ .player.playergrid,
background: rgba(0,0,0,0.2); .player.obstacle {
background: rgba(0, 0, 0, 0.2);
box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px; box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px;
border-radius:8px; border-radius: 8px;
} }
#window[data-radius_size='reduce'] .player.playergrid, #window[data-radius_size="reduce"] .player.playergrid,
#window[data-radius_size='reduce'] .player.obstacle{ #window[data-radius_size="reduce"] .player.obstacle {
border-radius:4px; border-radius: 4px;
} }
#window[data-radius_size='off'] .player.playergrid, #window[data-radius_size="off"] .player.playergrid,
#window[data-radius_size='off'] .player.obstacle{ #window[data-radius_size="off"] .player.obstacle {
border-radius:0px; border-radius: 0px;
} }
#window[data-radius_size='increase'] .player.playergrid, #window[data-radius_size="increase"] .player.playergrid,
#window[data-radius_size='increase'] .player.obstacle{ #window[data-radius_size="increase"] .player.obstacle {
border-radius:16px; border-radius: 16px;
} }
.player.playerblank{ .player.playerblank {
background: none; background: none;
} }
#window .player.obstacle{ #window .player.obstacle {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
rgba(0,0,0,0.2), rgba(0, 0, 0, 0.2),
rgba(0,0,0,0.2) 10px, rgba(0, 0, 0, 0.2) 10px,
rgba(0,0,0,0.1) 10px, rgba(0, 0, 0, 0.1) 10px,
rgba(0,0,0,0.1) 20px rgba(0, 0, 0, 0.1) 20px
); );
} }
#window .player.obstacle[data-obscolor='blue']{ #window .player.obstacle[data-obscolor="blue"] {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
rgba(0, 64, 162, 0.4), rgba(0, 64, 162, 0.4),
@ -231,71 +234,71 @@
box-shadow: rgba(0, 64, 162, 0.6) 0 0 0 1px; box-shadow: rgba(0, 64, 162, 0.6) 0 0 0 1px;
} }
.playergrid.temp{ .playergrid.temp {
opacity:0.3; opacity: 0.3;
} }
.chessscroll{ .chessscroll {
height:calc(100% - 162px); height: calc(100% - 162px);
width:20px; width: 20px;
top:42px; top: 42px;
z-index:1; z-index: 1;
position:fixed; position: fixed;
} }
.chessscroll.left{ .chessscroll.left {
left:0; left: 0;
} }
.chessscroll.right{ .chessscroll.right {
right:0; right: 0;
} }
.button.forbidden{ .button.forbidden {
opacity:0.6 opacity: 0.6;
} }
#arena.leaderhide>*:not(canvas){ #arena.leaderhide > *:not(canvas) {
opacity:0 !important; opacity: 0 !important;
transition: all 0.5s !important; transition: all 0.5s !important;
pointer-events: none; pointer-events: none;
} }
#arena.leadercontrol>#control{ #arena.leadercontrol > #control {
transition: all 0.5s !important; transition: all 0.5s !important;
} }
/* .player.treasure{ */ /* .player.treasure{ */
/*box-shadow: none;*/ /*box-shadow: none;*/
/* } */ /* } */
.player.treasure .count, .player.treasure .count,
.player.treasure .identity{ .player.treasure .identity {
display: none; display: none;
} }
.player.treasure .avatar{ .player.treasure .avatar {
width: 120px; width: 120px;
height: 120px; height: 120px;
left: 0; left: 0;
top: 0; top: 0;
} }
.player.minskin .action{ .player.minskin .action {
text-shadow: black 0 0 1px !important; text-shadow: black 0 0 1px !important;
font-size: 16px !important; font-size: 16px !important;
left:0; left: 0;
} }
.player .action.thunder{ .player .action.thunder {
color: rgb(117,186,255); color: rgb(117, 186, 255);
} }
#arena.selecting .player .action:not(.hidden){ #arena.selecting .player .action:not(.hidden) {
opacity: 1 !important; opacity: 1 !important;
} }
.button .intro.showintro.tafang{ .button .intro.showintro.tafang {
font-family: 'xinwei'; font-family: "xinwei";
font-size: 20px; font-size: 20px;
top: 66px; top: 66px;
right: 5px; right: 5px;
left:auto; left: auto;
} }
.button.newstyle .intro.showintro.tafang{ .button.newstyle .intro.showintro.tafang {
top: 6px; top: 6px;
} }
.dialog .buttons>.button.character.squarebutton{ .dialog .buttons > .button.character.squarebutton {
height:90px; height: 90px;
} }
.dialog .buttons>.button.character.squarebutton>.hp.text{ .dialog .buttons > .button.character.squarebutton > .hp.text {
/*left:22px;*/ /*left:22px;*/
right: 4px; right: 4px;
text-align: right; text-align: right;
@ -303,32 +306,30 @@
top: auto; top: auto;
left: auto; left: auto;
} }
.dialog .buttons>.button.character.squarebutton>.name{ .dialog .buttons > .button.character.squarebutton > .name {
top:8px; top: 8px;
} }
br.finish_game{ br.finish_game {
display: none; display: none;
} }
#arena.chess.slim_player.lslim_player .player.minskin:not(.fakeme) > .avatar:not(.fakeme) {
#arena.chess.slim_player.lslim_player .player.minskin:not(.fakeme)>.avatar:not(.fakeme){
left: 5px; left: 5px;
top: 5px; top: 5px;
width: calc(100% - 10px); width: calc(100% - 10px);
height: calc(100% - 10px); height: calc(100% - 10px);
} }
#arena.chess #chess>.player{ #arena.chess #chess > .player {
left: 14px; left: 14px;
top: 14px; top: 14px;
} }
#window.rightbar #system, #window.rightbar #system,
#window.leftbar #system{ #window.leftbar #system {
width: calc(100% - 62px); width: calc(100% - 62px);
} }
#window.leftbar #system{ #window.leftbar #system {
left: 50px; left: 50px;
} }
@ -337,9 +338,9 @@ br.finish_game{
top: 0; top: 0;
height: calc(100% - 121px); height: calc(100% - 121px);
} }
#window.rightbar #historybar{ #window.rightbar #historybar {
left: calc(100% - 50px); left: calc(100% - 50px);
} }
#window.leftbar #historybar{ #window.leftbar #historybar {
left: 0; left: 0;
} }

195
layout/mode/stone.css
View File

@ -1,148 +1,148 @@
#arena.stone>.player.minskin[data-position='4'] { #arena.stone > .player.minskin[data-position="4"] {
top: calc(100% - 305px); top: calc(100% - 305px);
left: calc(100% - 120px); left: calc(100% - 120px);
} }
#arena.stone>.card[data-position='4'] { #arena.stone > .card[data-position="4"] {
top: calc(100% - 297px); top: calc(100% - 297px);
left: calc(100% - 112px); left: calc(100% - 112px);
} }
#arena.stone>.popup[data-position='4'] { #arena.stone > .popup[data-position="4"] {
top: calc(100% - 340px); top: calc(100% - 340px);
left: calc(100% - 112px); left: calc(100% - 112px);
} }
#arena.stone>.player.minskin[data-position='6'] { #arena.stone > .player.minskin[data-position="6"] {
top: calc(100% - 305px); top: calc(100% - 305px);
left: calc(100% - 260px); left: calc(100% - 260px);
} }
#arena.stone>.card[data-position='6'] { #arena.stone > .card[data-position="6"] {
top: calc(100% - 297px); top: calc(100% - 297px);
left: calc(100% - 252px); left: calc(100% - 252px);
} }
#arena.stone>.popup[data-position='6'] { #arena.stone > .popup[data-position="6"] {
top: calc(100% - 340px); top: calc(100% - 340px);
left: calc(100% - 252px); left: calc(100% - 252px);
} }
#arena.stone>.player.minskin[data-position='7'] { #arena.stone > .player.minskin[data-position="7"] {
top: calc(100% - 305px); top: calc(100% - 305px);
left: 140px; left: 140px;
} }
#arena.stone>.card[data-position='7'] { #arena.stone > .card[data-position="7"] {
top: calc(100% - 297px); top: calc(100% - 297px);
left: 148px; left: 148px;
} }
#arena.stone>.popup[data-position='7'] { #arena.stone > .popup[data-position="7"] {
top: calc(100% - 340px); top: calc(100% - 340px);
left: 148px; left: 148px;
} }
#arena.stone>.player.minskin[data-position='5'] { #arena.stone > .player.minskin[data-position="5"] {
top: calc(100% - 305px); top: calc(100% - 305px);
left: 0; left: 0;
} }
#arena.stone>.card[data-position='5'] { #arena.stone > .card[data-position="5"] {
top: calc(100% - 297px); top: calc(100% - 297px);
left: 8px; left: 8px;
} }
#arena.stone>.popup[data-position='5'] { #arena.stone > .popup[data-position="5"] {
top: calc(100% - 340px); top: calc(100% - 340px);
left: 8px; left: 8px;
} }
#arena.stone>.player.minskin[data-position='9'] { #arena.stone > .player.minskin[data-position="9"] {
top: 30px; top: 30px;
left: calc(100% - 120px); left: calc(100% - 120px);
} }
#arena.stone>.card[data-position='9'] { #arena.stone > .card[data-position="9"] {
top: 38px; top: 38px;
left: calc(100% - 112px); left: calc(100% - 112px);
} }
#arena.stone>.popup[data-position='9'] { #arena.stone > .popup[data-position="9"] {
top: 160px; top: 160px;
left: calc(100% - 112px); left: calc(100% - 112px);
} }
#arena.stone>.player.minskin[data-position='11'] { #arena.stone > .player.minskin[data-position="11"] {
top: 10px; top: 10px;
left: calc(100% - 260px); left: calc(100% - 260px);
} }
#arena.stone>.card[data-position='11'] { #arena.stone > .card[data-position="11"] {
top: 18px; top: 18px;
left: calc(100% - 252px); left: calc(100% - 252px);
} }
#arena.stone>.popup[data-position='11'] { #arena.stone > .popup[data-position="11"] {
top: 140px; top: 140px;
left: calc(100% - 252px); left: calc(100% - 252px);
} }
#arena.stone>.player.minskin[data-position='10'] { #arena.stone > .player.minskin[data-position="10"] {
top: 10px; top: 10px;
left: 140px; left: 140px;
} }
#arena.stone>.card[data-position='10'] { #arena.stone > .card[data-position="10"] {
top: 18px; top: 18px;
left: 148px; left: 148px;
} }
#arena.stone>.popup[data-position='10'] { #arena.stone > .popup[data-position="10"] {
top: 140px; top: 140px;
left: 148px; left: 148px;
} }
#arena.stone>.player.minskin[data-position='8'] { #arena.stone > .player.minskin[data-position="8"] {
top: 30px; top: 30px;
left: 0; left: 0;
} }
#arena.stone>.card[data-position='8'] { #arena.stone > .card[data-position="8"] {
top: 38px; top: 38px;
left: 8px; left: 8px;
} }
#arena.stone>.popup[data-position='8'] { #arena.stone > .popup[data-position="8"] {
top: 160px; top: 160px;
left: 8px; left: 8px;
} }
#arena:not(.chess).mobile>.player[data-position='0']>.name { #arena:not(.chess).mobile > .player[data-position="0"] > .name {
top: 30px; top: 30px;
} }
#arena .player>.name { #arena .player > .name {
top: 36px; top: 36px;
} }
#arena.slim_player .player>.name { #arena.slim_player .player > .name {
top: 33px; top: 33px;
} }
#arena .player.linked>.name { #arena .player.linked > .name {
transform: rotate(90deg) translate(120px, -96px); transform: rotate(90deg) translate(120px, -96px);
} }
#arena .player.linked>.name.name2 { #arena .player.linked > .name.name2 {
transform: rotate(90deg) translate(98px, -31px); transform: rotate(90deg) translate(98px, -31px);
} }
#arena.oldlayout .player.linked>.name { #arena.oldlayout .player.linked > .name {
transform: none !important; transform: none !important;
} }
#arena.oldlayout .player.linked>.name.name2 { #arena.oldlayout .player.linked > .name.name2 {
transform: none !important; transform: none !important;
} }
@ -150,7 +150,7 @@
top: 14px; top: 14px;
} }
.player>.identity.menubutton.round { .player > .identity.menubutton.round {
padding: 0; padding: 0;
transform: scale(1.2) translate(-2px, 2px); transform: scale(1.2) translate(-2px, 2px);
} }
@ -165,7 +165,7 @@
/*z-index: 4;*/ /*z-index: 4;*/
/* } */ /* } */
#arena:not(.chess).mobile .player[data-position='0']:not(.minskin)>.identity { #arena:not(.chess).mobile .player[data-position="0"]:not(.minskin) > .identity {
left: 100px; left: 100px;
top: -7px; top: -7px;
} }
@ -174,7 +174,7 @@
overflow: hidden; overflow: hidden;
} }
#deck-builder>.shadowed.list { #deck-builder > .shadowed.list {
width: 200px; width: 200px;
height: 100%; height: 100%;
right: 0; right: 0;
@ -184,12 +184,12 @@
opacity: 0; opacity: 0;
} }
#deck-builder.shown>.shadowed.list { #deck-builder.shown > .shadowed.list {
transform: none; transform: none;
opacity: 1; opacity: 1;
} }
#deck-builder>.shadowed.list>.menubutton.large.create { #deck-builder > .shadowed.list > .menubutton.large.create {
position: absolute; position: absolute;
bottom: 10px; bottom: 10px;
left: auto; left: auto;
@ -203,7 +203,7 @@
z-index: 2; z-index: 2;
} }
#deck-builder>.shadowed.list>.list-container { #deck-builder > .shadowed.list > .list-container {
width: 100%; width: 100%;
left: 0; left: 0;
height: calc(100% - 60px); height: calc(100% - 60px);
@ -212,37 +212,37 @@
text-align: left; text-align: left;
} }
#deck-builder>.shadowed.list>.list-container:not(.deck) { #deck-builder > .shadowed.list > .list-container:not(.deck) {
z-index: 1; z-index: 1;
} }
#deck-builder>.shadowed.list>.list-container.deck { #deck-builder > .shadowed.list > .list-container.deck {
pointer-events: none; pointer-events: none;
opacity: 0; opacity: 0;
} }
#deck-builder>.shadowed.list>.list-container.deck.shown { #deck-builder > .shadowed.list > .list-container.deck.shown {
pointer-events: auto; pointer-events: auto;
opacity: 1; opacity: 1;
} }
#deck-builder>.shadowed.list>.list-container.deck>.card { #deck-builder > .shadowed.list > .list-container.deck > .card {
zoom: 0.8; zoom: 0.8;
margin-bottom: 15px; margin-bottom: 15px;
margin-top: 0; margin-top: 0;
transition: all 0s; transition: all 0s;
} }
#deck-builder>.shadowed.list>.list-container.deck>.card:nth-child(2n+1) { #deck-builder > .shadowed.list > .list-container.deck > .card:nth-child(2n + 1) {
margin-left: 15px; margin-left: 15px;
} }
#deck-builder>.shadowed.list>.list-container.deck>.card:nth-child(2n) { #deck-builder > .shadowed.list > .list-container.deck > .card:nth-child(2n) {
margin-left: 7px; margin-left: 7px;
} }
#deck-builder>.shadowed.list>.list-container.deck>.card:first-child, #deck-builder > .shadowed.list > .list-container.deck > .card:first-child,
#deck-builder>.shadowed.list>.list-container.deck>.card:first-child+div { #deck-builder > .shadowed.list > .list-container.deck > .card:first-child + div {
margin-top: 15px; margin-top: 15px;
} }
@ -260,7 +260,7 @@
text-align: left; text-align: left;
font-size: 24px; font-size: 24px;
line-height: 30px; line-height: 30px;
font-family: 'xinwei'; font-family: "xinwei";
border-radius: 40px 4px 4px 40px; border-radius: 40px 4px 4px 40px;
background-size: cover; background-size: cover;
white-space: nowrap; white-space: nowrap;
@ -268,8 +268,8 @@
} }
#window:not(.nopointer) .deckitem, #window:not(.nopointer) .deckitem,
#window:not(.nopointer) #deck-builder>.shadowed.list>.menubutton.large.create, #window:not(.nopointer) #deck-builder > .shadowed.list > .menubutton.large.create,
#window:not(.nopointer) #deck-builder>.controls>div:not(*:last-child) { #window:not(.nopointer) #deck-builder > .controls > div:not(*:last-child) {
cursor: pointer; cursor: pointer;
} }
@ -283,7 +283,7 @@
text-align: center; text-align: center;
} }
.deckitem.random>span { .deckitem.random > span {
margin-left: 0; margin-left: 0;
} }
@ -291,11 +291,11 @@
margin-bottom: 15px; margin-bottom: 15px;
} }
.deckitem>span { .deckitem > span {
margin-left: 46px; margin-left: 46px;
} }
.deckitem>.menubutton.round { .deckitem > .menubutton.round {
position: absolute; position: absolute;
left: -1px; left: -1px;
top: -2px; top: -2px;
@ -303,7 +303,7 @@
height: 34px; height: 34px;
} }
#deck-builder>.shadowed.career { #deck-builder > .shadowed.career {
width: 240px; width: 240px;
height: 240px; height: 240px;
right: 220px; right: 220px;
@ -315,12 +315,12 @@
z-index: 8; z-index: 8;
} }
#deck-builder>.shadowed.career.shown { #deck-builder > .shadowed.career.shown {
transform: scale(1) translateX(0); transform: scale(1) translateX(0);
opacity: 1; opacity: 1;
} }
#deck-builder>.shadowed.career>div { #deck-builder > .shadowed.career > div {
width: 80px; width: 80px;
height: 80px; height: 80px;
margin: 0; margin: 0;
@ -329,19 +329,19 @@
display: inline-block; display: inline-block;
} }
#deck-builder>.shadowed.career>div>.menubutton.round { #deck-builder > .shadowed.career > div > .menubutton.round {
left: 15px; left: 15px;
top: 5px; top: 5px;
} }
#deck-builder>.shadowed.career>div>.text { #deck-builder > .shadowed.career > div > .text {
font-size: 12px; font-size: 12px;
width: 100%; width: 100%;
text-align: center; text-align: center;
top: 58px; top: 58px;
} }
#deck-builder>.dialog.fixed { #deck-builder > .dialog.fixed {
left: auto; left: auto;
right: 240px; right: 240px;
width: calc(100% - 280px); width: calc(100% - 280px);
@ -354,19 +354,19 @@
transition: all 0.5s; transition: all 0.5s;
} }
#deck-builder:not(.shown)>.dialog.fixed { #deck-builder:not(.shown) > .dialog.fixed {
opacity: 0; opacity: 0;
transform: scale(0.8); transform: scale(0.8);
pointer-events: none; pointer-events: none;
} }
#deck-builder>.dialog.fixed.shown { #deck-builder > .dialog.fixed.shown {
opacity: 1; opacity: 1;
transform: scale(1); transform: scale(1);
pointer-events: auto; pointer-events: auto;
} }
#deck-builder>.controls { #deck-builder > .controls {
opacity: 0; opacity: 0;
height: 50px; height: 50px;
width: calc(100% - 200px); width: calc(100% - 200px);
@ -377,38 +377,38 @@
pointer-events: none; pointer-events: none;
} }
#deck-builder>.controls>div { #deck-builder > .controls > div {
position: relative; position: relative;
margin-top: 5px; margin-top: 5px;
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
} }
#deck-builder>.controls>.card-count { #deck-builder > .controls > .card-count {
position: absolute; position: absolute;
width: 100px; width: 100px;
height: 100%; height: 100%;
left: calc(50% - 50px); left: calc(50% - 50px);
text-align: center; text-align: center;
font-family: 'xinwei'; font-family: "xinwei";
font-size: 24px; font-size: 24px;
line-height: 50px; line-height: 50px;
margin: 0; margin: 0;
} }
#deck-builder>.controls>div:last-child { #deck-builder > .controls > div:last-child {
margin-right: 40px; margin-right: 40px;
white-space: nowrap; white-space: nowrap;
user-select: text; user-select: text;
-webkit-user-select: text; -webkit-user-select: text;
} }
#deck-builder>.controls.shown { #deck-builder > .controls.shown {
opacity: 1; opacity: 1;
pointer-events: auto; pointer-events: auto;
} }
#arena>.player.stone_deck { #arena > .player.stone_deck {
transform: scale(1) translateX(100px); transform: scale(1) translateX(100px);
opacity: 0; opacity: 0;
transition: all 0.5s; transition: all 0.5s;
@ -416,99 +416,98 @@
top: calc(50% - 90px); top: calc(50% - 90px);
} }
#arena>.player.stone_deck.shown { #arena > .player.stone_deck.shown {
transform: scale(0.8); transform: scale(0.8);
opacity: 1; opacity: 1;
} }
#arena>.player.stone_deck.shown.removing { #arena > .player.stone_deck.shown.removing {
transform: scale(0.6) translateX(-100px); transform: scale(0.6) translateX(-100px);
} }
#arena>.player.stone_deck>div:not(.avatar):not(.avatar2) { #arena > .player.stone_deck > div:not(.avatar):not(.avatar2) {
display: none !important; display: none !important;
} }
/*#arena>.skillbar>.skillbartext:hover{ /*#arena>.skillbar>.skillbartext:hover{
opacity: 1; opacity: 1;
}*/ }*/
@keyframes skillbarglow { @keyframes skillbarglow {
0% { 0% {
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px;
} }
50% { 50% {
box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px, box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px, rgba(255, 0, 0, 0.4) 0 0 12px,
rgba(255, 0, 0, 0.4) 0 0 12px, rgba(255, 0, 0, 1) 0 0 30px, rgba(255, 0, 0, 0.2) 0 0 30px rgba(255, 0, 0, 1) 0 0 30px, rgba(255, 0, 0, 0.2) 0 0 30px;
} }
100% { 100% {
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px;
} }
} }
@-webkit-keyframes skillbarglow { @-webkit-keyframes skillbarglow {
0% { 0% {
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px;
} }
50% { 50% {
box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px, box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px, rgba(255, 0, 0, 0.4) 0 0 12px,
rgba(255, 0, 0, 0.4) 0 0 12px, rgba(255, 0, 0, 1) 0 0 30px, rgba(255, 0, 0, 0.2) 0 0 30px rgba(255, 0, 0, 1) 0 0 30px, rgba(255, 0, 0, 0.2) 0 0 30px;
} }
100% { 100% {
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px;
} }
} }
div[data-career='mage'] { div[data-career="mage"] {
background-image: url('../../image/mode/stone/career/mage.png'); background-image: url("../../image/mode/stone/career/mage.png");
background-size: cover; background-size: cover;
} }
div[data-career='druid'] { div[data-career="druid"] {
background-image: url('../../image/mode/stone/career/druid.png'); background-image: url("../../image/mode/stone/career/druid.png");
background-size: cover; background-size: cover;
} }
div[data-career='hunter'] { div[data-career="hunter"] {
background-image: url('../../image/mode/stone/career/hunter.png'); background-image: url("../../image/mode/stone/career/hunter.png");
background-size: cover; background-size: cover;
} }
div[data-career='shaman'] { div[data-career="shaman"] {
background-image: url('../../image/mode/stone/career/shaman.png'); background-image: url("../../image/mode/stone/career/shaman.png");
background-size: cover; background-size: cover;
} }
div[data-career='paladin'] { div[data-career="paladin"] {
background-image: url('../../image/mode/stone/career/paladin.png'); background-image: url("../../image/mode/stone/career/paladin.png");
background-size: cover; background-size: cover;
} }
div[data-career='rogue'] { div[data-career="rogue"] {
background-image: url('../../image/mode/stone/career/rogue.png'); background-image: url("../../image/mode/stone/career/rogue.png");
background-size: cover; background-size: cover;
} }
div[data-career='priest'] { div[data-career="priest"] {
background-image: url('../../image/mode/stone/career/priest.png'); background-image: url("../../image/mode/stone/career/priest.png");
background-size: cover; background-size: cover;
} }
div[data-career='warrior'] { div[data-career="warrior"] {
background-image: url('../../image/mode/stone/career/warrior.png'); background-image: url("../../image/mode/stone/career/warrior.png");
background-size: cover; background-size: cover;
} }
div[data-career='warlock'] { div[data-career="warlock"] {
background-image: url('../../image/mode/stone/career/warlock.png'); background-image: url("../../image/mode/stone/career/warlock.png");
background-size: cover; background-size: cover;
} }
div[data-career='knight'] { div[data-career="knight"] {
background-image: url('../../image/mode/stone/career/knight.png'); background-image: url("../../image/mode/stone/career/knight.png");
background-size: cover; background-size: cover;
} }

103
layout/mode/story.css
View File

@ -1,6 +1,6 @@
.storyscene{ .storyscene {
height: 500px; height: 500px;
top:calc(50% - 250px); top: calc(50% - 250px);
width: 100%; width: 100%;
position: absolute; position: absolute;
left: 0; left: 0;
@ -9,19 +9,19 @@
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
} }
.storyscene.removing{ .storyscene.removing {
pointer-events: none; pointer-events: none;
transform: translateY(500px); transform: translateY(500px);
} }
.storyscene.lockscroll{ .storyscene.lockscroll {
overflow-x: hidden; overflow-x: hidden;
} }
.storyscene>.scene{ .storyscene > .scene {
width: 350px; width: 350px;
height: 420px; height: 420px;
position: relative; position: relative;
left: 0; left: 0;
top:40px; top: 40px;
margin-left: -40px; margin-left: -40px;
margin-right: -40px; margin-right: -40px;
z-index: 1; z-index: 1;
@ -29,7 +29,7 @@
overflow: hidden; overflow: hidden;
box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
} }
.storyscene>.scene>.background.player{ .storyscene > .scene > .background.player {
border-radius: 0 !important; border-radius: 0 !important;
box-shadow: none !important; box-shadow: none !important;
width: 100%; width: 100%;
@ -38,20 +38,20 @@
top: 0; top: 0;
z-index: 1; z-index: 1;
} }
.storyscene>.scene.unselectable{ .storyscene > .scene.unselectable {
opacity: 1 !important; opacity: 1 !important;
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.225) 0 3px 10px; box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.225) 0 3px 10px;
} }
.storyscene>.scene.unselectable>.background{ .storyscene > .scene.unselectable > .background {
opacity: 0.3; opacity: 0.3;
} }
.storyscene>.scene.unselectable>.name{ .storyscene > .scene.unselectable > .name {
opacity: 0.6; opacity: 0.6;
} }
.storyscene>.scene.unselectable>div:not(.mask).background{ .storyscene > .scene.unselectable > div:not(.mask).background {
/*opacity: 0.25;*/ /*opacity: 0.25;*/
} }
.storyscene>.scene>.mask{ .storyscene > .scene > .mask {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
@ -59,40 +59,41 @@
top: 0; top: 0;
z-index: 3; z-index: 3;
} }
.storyscene>.scene>.mask>div{ .storyscene > .scene > .mask > div {
width: 100%; width: 100%;
height: 240px; height: 240px;
top:calc(50% - 120px); top: calc(50% - 120px);
position: absolute; position: absolute;
left: 0; left: 0;
text-align: center; text-align: center;
font-size: 80px; font-size: 80px;
line-height: 80px; line-height: 80px;
font-family: 'xinwei'; font-family: "xinwei";
opacity: 0.8; opacity: 0.8;
} }
.storyscene>.scene:not(.unselectable)>.mask{ .storyscene > .scene:not(.unselectable) > .mask {
display: none; display: none;
}.storyscene>.scene.unselectable>.name{ }
.storyscene > .scene.unselectable > .name {
/*display: none;*/ /*display: none;*/
} }
.storyscene>.scene.flipped{ .storyscene > .scene.flipped {
z-index: 2; z-index: 2;
border-radius: 12px !important; border-radius: 12px !important;
} }
.storyscene>.scene.flipped>div:not(.menu){ .storyscene > .scene.flipped > div:not(.menu) {
display: none !important; display: none !important;
} }
.storyscene>.scene:not(.flipped)>.menu{ .storyscene > .scene:not(.flipped) > .menu {
display: none; display: none;
} }
.storyscene>.scene:first-child{ .storyscene > .scene:first-child {
margin-left: 50px; margin-left: 50px;
} }
.storyscene>.scene:last-child{ .storyscene > .scene:last-child {
margin-right: 50px; margin-right: 50px;
} }
.storyscene>.scene>.name{ .storyscene > .scene > .name {
font-size: 48px; font-size: 48px;
left: 25px; left: 25px;
top: auto; top: auto;
@ -100,9 +101,9 @@
/*transform: rotateY(-180deg);*/ /*transform: rotateY(-180deg);*/
border-radius: 16px !important; border-radius: 16px !important;
z-index: 2; z-index: 2;
font-family: 'xinwei' font-family: "xinwei";
} }
.storyscene>.scene>.menu{ .storyscene > .scene > .menu {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
@ -111,27 +112,27 @@
box-shadow: none; box-shadow: none;
overflow: scroll; overflow: scroll;
} }
.storyscene>.scene>.background>.avatar{ .storyscene > .scene > .background > .avatar {
width: calc(100% - 26px); width: calc(100% - 26px);
height: calc(100% - 26px); height: calc(100% - 26px);
left: 13px; left: 13px;
top: 13px; top: 13px;
z-index: 2; z-index: 2;
} }
.storyscene>.scene>.menu{ .storyscene > .scene > .menu {
transform: rotateY(-180deg); transform: rotateY(-180deg);
} }
.storyscene>.scene.startscene{ .storyscene > .scene.startscene {
-webkit-animation: scene_start 0.5s; -webkit-animation: scene_start 0.5s;
} }
.scene>.menu>.menubutton.enter{ .scene > .menu > .menubutton.enter {
position: absolute; position: absolute;
top:auto; top: auto;
bottom: 10px; bottom: 10px;
width: 70px; width: 70px;
left: calc(50% - 35px); left: calc(50% - 35px);
} }
.scene>.menu>.conversation{ .scene > .menu > .conversation {
display: table; display: table;
position: absolute; position: absolute;
left: 16px; left: 16px;
@ -139,15 +140,15 @@
width: calc(100% - 32px); width: calc(100% - 32px);
height: 100%; height: 100%;
font-size: 24px; font-size: 24px;
font-family: 'xinwei'; font-family: "xinwei";
white-space: normal; white-space: normal;
text-align: left; text-align: left;
} }
.scene>.menu>.conversation.center{ .scene > .menu > .conversation.center {
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
} }
.scene>.menu>.avatarconversation{ .scene > .menu > .avatarconversation {
position: relative; position: relative;
display: block; display: block;
width: 100%; width: 100%;
@ -155,24 +156,24 @@
left: 0; left: 0;
margin-top: 10px; margin-top: 10px;
} }
.scene>.menu>.avatarconversation:last-child{ .scene > .menu > .avatarconversation:last-child {
margin-bottom: 10px; margin-bottom: 10px;
} }
.scene>.menu>.avatarconversation>div{ .scene > .menu > .avatarconversation > div {
height: 100%; height: 100%;
top:0; top: 0;
} }
.scene>.menu>.avatarconversation>.avatar{ .scene > .menu > .avatarconversation > .avatar {
width: 100px; width: 100px;
height: 100px; height: 100px;
left: 10px; left: 10px;
background-size: cover; background-size: cover;
} }
.scene>.menu>.avatarconversation.swap>.avatar{ .scene > .menu > .avatarconversation.swap > .avatar {
left: auto; left: auto;
right: 10px; right: 10px;
} }
.scene>.menu>.avatarconversation>div:not(.avatar){ .scene > .menu > .avatarconversation > div:not(.avatar) {
width: calc(100% - 120px); width: calc(100% - 120px);
left: 120px; left: 120px;
top: 5px; top: 5px;
@ -181,46 +182,46 @@
white-space: normal; white-space: normal;
line-height: 18px; line-height: 18px;
} }
.scene>.menu>.avatarconversation.swap>div:not(.avatar){ .scene > .menu > .avatarconversation.swap > div:not(.avatar) {
left: auto; left: auto;
right: 120px; right: 120px;
text-align: right; text-align: right;
} }
.scene>.menu>.conversation>div{ .scene > .menu > .conversation > div {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
position: relative; position: relative;
} }
#create-player{ #create-player {
width: 400px; width: 400px;
height: 300px; height: 300px;
left: calc(50% - 200px); left: calc(50% - 200px);
top: calc(50% - 150px); top: calc(50% - 150px);
position: absolute; position: absolute;
-webkit-animation:dialog_start2 0.5s; -webkit-animation: dialog_start2 0.5s;
} }
#create-player>div{ #create-player > div {
position: absolute; position: absolute;
} }
#create-player>.caption{ #create-player > .caption {
width: 100%; width: 100%;
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
left: 0; left: 0;
top: 0; top: 0;
font-family: 'xinwei'; font-family: "xinwei";
font-size: 24px; font-size: 24px;
text-align: center; text-align: center;
} }
@-webkit-keyframes scene_start{ @-webkit-keyframes scene_start {
from{ from {
opacity: 0; opacity: 0;
transform:scale(0.5); transform: scale(0.5);
margin-left: -175px; margin-left: -175px;
margin-right: -175px; margin-right: -175px;
} }
to{ to {
opacity: 1; opacity: 1;
transform: scale(1); transform: scale(1);
margin-left: 16px; margin-left: 16px;

112
layout/mode/tafang.css
View File

@ -1,6 +1,6 @@
.storyscene{ .storyscene {
height: 500px; height: 500px;
top:calc(50% - 250px); top: calc(50% - 250px);
width: 100%; width: 100%;
position: absolute; position: absolute;
left: 0; left: 0;
@ -9,19 +9,19 @@
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
} }
.storyscene.removing{ .storyscene.removing {
pointer-events: none; pointer-events: none;
transform: translateY(500px); transform: translateY(500px);
} }
.storyscene.lockscroll{ .storyscene.lockscroll {
overflow-x: hidden; overflow-x: hidden;
} }
.storyscene>.scene{ .storyscene > .scene {
width: 350px; width: 350px;
height: 420px; height: 420px;
position: relative; position: relative;
left: 0; left: 0;
top:40px; top: 40px;
margin-left: -40px; margin-left: -40px;
margin-right: -40px; margin-right: -40px;
z-index: 1; z-index: 1;
@ -29,7 +29,7 @@
overflow: hidden; overflow: hidden;
box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
} }
.storyscene>.scene>.background.player{ .storyscene > .scene > .background.player {
border-radius: 0 !important; border-radius: 0 !important;
box-shadow: none !important; box-shadow: none !important;
width: 100%; width: 100%;
@ -38,20 +38,20 @@
top: 0; top: 0;
z-index: 1; z-index: 1;
} }
.storyscene>.scene.unselectable{ .storyscene > .scene.unselectable {
opacity: 1 !important; opacity: 1 !important;
box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.225) 0 3px 10px; box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.225) 0 3px 10px;
} }
.storyscene>.scene.unselectable>.background{ .storyscene > .scene.unselectable > .background {
opacity: 0.3; opacity: 0.3;
} }
.storyscene>.scene.unselectable>.name{ .storyscene > .scene.unselectable > .name {
opacity: 0.6; opacity: 0.6;
} }
/* .storyscene>.scene.unselectable>div:not(.mask).background{ */ /* .storyscene>.scene.unselectable>div:not(.mask).background{ */
/*opacity: 0.25;*/ /*opacity: 0.25;*/
/* } */ /* } */
.storyscene>.scene>.mask{ .storyscene > .scene > .mask {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
@ -59,41 +59,41 @@
top: 0; top: 0;
z-index: 3; z-index: 3;
} }
.storyscene>.scene>.mask>div{ .storyscene > .scene > .mask > div {
width: 100%; width: 100%;
height: 240px; height: 240px;
top:calc(50% - 120px); top: calc(50% - 120px);
position: absolute; position: absolute;
left: 0; left: 0;
text-align: center; text-align: center;
font-size: 80px; font-size: 80px;
line-height: 80px; line-height: 80px;
font-family: 'xinwei'; font-family: "xinwei";
opacity: 0.8; opacity: 0.8;
} }
.storyscene>.scene:not(.unselectable)>.mask{ .storyscene > .scene:not(.unselectable) > .mask {
display: none; display: none;
} }
/* .storyscene>.scene.unselectable>.name{ */ /* .storyscene>.scene.unselectable>.name{ */
/*display: none;*/ /*display: none;*/
/* } */ /* } */
.storyscene>.scene.flipped{ .storyscene > .scene.flipped {
z-index: 2; z-index: 2;
border-radius: 12px !important; border-radius: 12px !important;
} }
.storyscene>.scene.flipped>div:not(.menu){ .storyscene > .scene.flipped > div:not(.menu) {
display: none !important; display: none !important;
} }
.storyscene>.scene:not(.flipped)>.menu{ .storyscene > .scene:not(.flipped) > .menu {
display: none; display: none;
} }
.storyscene>.scene:first-child{ .storyscene > .scene:first-child {
margin-left: 50px; margin-left: 50px;
} }
.storyscene>.scene:last-child{ .storyscene > .scene:last-child {
margin-right: 50px; margin-right: 50px;
} }
.storyscene>.scene>.name{ .storyscene > .scene > .name {
font-size: 48px; font-size: 48px;
left: 25px; left: 25px;
/*top: auto;*/ /*top: auto;*/
@ -101,9 +101,9 @@
/*transform: rotateY(-180deg);*/ /*transform: rotateY(-180deg);*/
border-radius: 16px !important; border-radius: 16px !important;
z-index: 2; z-index: 2;
font-family: 'xinwei' font-family: "xinwei";
} }
.storyscene>.scene>.menu{ .storyscene > .scene > .menu {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
@ -112,28 +112,28 @@
box-shadow: none; box-shadow: none;
overflow: scroll; overflow: scroll;
} }
.storyscene>.scene>.background>.avatar{ .storyscene > .scene > .background > .avatar {
width: calc(100% - 26px); width: calc(100% - 26px);
height: calc(100% - 26px); height: calc(100% - 26px);
left: 13px; left: 13px;
top: 13px; top: 13px;
z-index: 2; z-index: 2;
} }
.storyscene>.scene>.menu{ .storyscene > .scene > .menu {
transform: rotateY(-180deg); transform: rotateY(-180deg);
} }
.storyscene>.scene.startscene{ .storyscene > .scene.startscene {
animation: scene_start 0.5s; animation: scene_start 0.5s;
-webkit-animation: scene_start 0.5s; -webkit-animation: scene_start 0.5s;
} }
.scene>.menu>.menubutton.enter{ .scene > .menu > .menubutton.enter {
position: absolute; position: absolute;
top:auto; top: auto;
bottom: 10px; bottom: 10px;
width: 70px; width: 70px;
left: calc(50% - 35px); left: calc(50% - 35px);
} }
.scene>.menu>.conversation{ .scene > .menu > .conversation {
display: table; display: table;
position: absolute; position: absolute;
left: 16px; left: 16px;
@ -141,15 +141,15 @@
width: calc(100% - 32px); width: calc(100% - 32px);
height: 100%; height: 100%;
font-size: 24px; font-size: 24px;
font-family: 'xinwei'; font-family: "xinwei";
white-space: normal; white-space: normal;
text-align: left; text-align: left;
} }
.scene>.menu>.conversation.center{ .scene > .menu > .conversation.center {
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
} }
.scene>.menu>.avatarconversation{ .scene > .menu > .avatarconversation {
position: relative; position: relative;
display: block; display: block;
width: 100%; width: 100%;
@ -157,24 +157,24 @@
left: 0; left: 0;
margin-top: 10px; margin-top: 10px;
} }
.scene>.menu>.avatarconversation:last-child{ .scene > .menu > .avatarconversation:last-child {
margin-bottom: 10px; margin-bottom: 10px;
} }
.scene>.menu>.avatarconversation>div{ .scene > .menu > .avatarconversation > div {
height: 100%; height: 100%;
top:0; top: 0;
} }
.scene>.menu>.avatarconversation>.avatar{ .scene > .menu > .avatarconversation > .avatar {
width: 100px; width: 100px;
height: 100px; height: 100px;
left: 10px; left: 10px;
background-size: cover; background-size: cover;
} }
.scene>.menu>.avatarconversation.swap>.avatar{ .scene > .menu > .avatarconversation.swap > .avatar {
left: auto; left: auto;
right: 10px; right: 10px;
} }
.scene>.menu>.avatarconversation>div:not(.avatar){ .scene > .menu > .avatarconversation > div:not(.avatar) {
width: calc(100% - 120px); width: calc(100% - 120px);
left: 120px; left: 120px;
top: 5px; top: 5px;
@ -183,47 +183,47 @@
white-space: normal; white-space: normal;
line-height: 18px; line-height: 18px;
} }
.scene>.menu>.avatarconversation.swap>div:not(.avatar){ .scene > .menu > .avatarconversation.swap > div:not(.avatar) {
left: auto; left: auto;
right: 120px; right: 120px;
text-align: right; text-align: right;
} }
.scene>.menu>.conversation>div{ .scene > .menu > .conversation > div {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
position: relative; position: relative;
} }
#create-player{ #create-player {
width: 400px; width: 400px;
height: 300px; height: 300px;
left: calc(50% - 200px); left: calc(50% - 200px);
top: calc(50% - 150px); top: calc(50% - 150px);
position: absolute; position: absolute;
animation:dialog_start2 0.5s; animation: dialog_start2 0.5s;
-webkit-animation:dialog_start2 0.5s; -webkit-animation: dialog_start2 0.5s;
} }
#create-player>div{ #create-player > div {
position: absolute; position: absolute;
} }
#create-player>.caption{ #create-player > .caption {
width: 100%; width: 100%;
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
left: 0; left: 0;
top: 0; top: 0;
font-family: 'xinwei'; font-family: "xinwei";
font-size: 24px; font-size: 24px;
text-align: center; text-align: center;
} }
@keyframes scene_start{ @keyframes scene_start {
from{ from {
opacity: 0; opacity: 0;
transform:scale(0.5); transform: scale(0.5);
margin-left: -175px; margin-left: -175px;
margin-right: -175px; margin-right: -175px;
} }
to{ to {
opacity: 1; opacity: 1;
transform: scale(1); transform: scale(1);
margin-left: 16px; margin-left: 16px;
@ -231,14 +231,14 @@
} }
} }
@-webkit-keyframes scene_start{ @-webkit-keyframes scene_start {
from{ from {
opacity: 0; opacity: 0;
transform:scale(0.5); transform: scale(0.5);
margin-left: -175px; margin-left: -175px;
margin-right: -175px; margin-right: -175px;
} }
to{ to {
opacity: 1; opacity: 1;
transform: scale(1); transform: scale(1);
margin-left: 16px; margin-left: 16px;

197
layout/newlayout/equip.css
View File

@ -1,143 +1,146 @@
.player .equips{ .player .equips {
width:120px; width: 120px;
height:auto; height: auto;
top:auto; top: auto;
right:auto; right: auto;
bottom:18px; bottom: 18px;
left:10px; left: 10px;
text-align:left; text-align: left;
} }
#arena.slim_player .player .equips{ #arena.slim_player .player .equips {
left: 7px; left: 7px;
} }
#arena.uslim_player .player .equips{ #arena.uslim_player .player .equips {
left: 3px; left: 3px;
} }
#arena.mslim_player .player .equips{ #arena.mslim_player .player .equips {
left: 3px; left: 3px;
} }
.player.minskin .equips{ .player.minskin .equips {
transform:scale(0.73); transform: scale(0.73);
transform-origin:bottom left; transform-origin: bottom left;
} }
.player .equips>.card::after, .player .equips > .card::after,
.player .equips>.card::before{ .player .equips > .card::before {
visibility: hidden; visibility: hidden;
} }
.player .equips>.card{ .player .equips > .card {
position:relative; position: relative;
width:100%; width: 100%;
height:22px; height: 22px;
line-height:22px; line-height: 22px;
margin-top:0; margin-top: 0;
margin-bottom:0; margin-bottom: 0;
background:linear-gradient(to right,rgba(0,0,0,0.3),transparent), background: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent),
linear-gradient(135deg,rgba(0,0,0,0.5) ,transparent 80%,transparent) !important; linear-gradient(135deg, rgba(0, 0, 0, 0.5), transparent 80%, transparent) !important;
box-shadow:none; box-shadow: none;
color:white; color: white;
text-shadow:black 0 0 2px; text-shadow: black 0 0 2px;
animation: card_start2x 0.5s; animation: card_start2x 0.5s;
-webkit-animation: card_start2x 0.5s; -webkit-animation: card_start2x 0.5s;
display:block; display: block;
left:0; left: 0;
top:0; top: 0;
transition:all 0.5s; transition: all 0.5s;
border-radius:0; border-radius: 0;
border-width: 1px 0 0; border-width: 1px 0 0;
border-style:solid; border-style: solid;
border-image:linear-gradient(to right, rgba(0, 0, 0,0.4) 70%,transparent) 100% 0 0; border-image: linear-gradient(to right, rgba(0, 0, 0, 0.4) 70%, transparent) 100% 0 0;
} }
.player .equips>.card>.image{ .player .equips > .card > .image {
display:none; display: none;
} }
.player.unseen .equips > .card {
.player.unseen .equips>.card{ background: none;
background:none;
/*border-image:linear-gradient(to right, transparent,rgba(0,0,0,0.4) 10%,rgba(0, 0, 0,0.4) 70%,transparent) 100% 0 0;*/ /*border-image:linear-gradient(to right, transparent,rgba(0,0,0,0.4) 10%,rgba(0, 0, 0,0.4) 70%,transparent) 100% 0 0;*/
} }
.player.unseen .equips>.card{ .player.unseen .equips > .card {
border-image:linear-gradient(to right, transparent,rgba(0,0,0,0.4) 10%,rgba(0, 0, 0,0.4) 70%,transparent) 100% 0 0; border-image: linear-gradient(
to right,
transparent,
rgba(0, 0, 0, 0.4) 10%,
rgba(0, 0, 0, 0.4) 70%,
transparent
)
100% 0 0;
} }
.player.unseen .equips>.card:first-child{ .player.unseen .equips > .card:first-child {
border-image:linear-gradient(transparent,transparent); border-image: linear-gradient(transparent, transparent);
} }
.player .equips>.card.selected{ .player .equips > .card.selected {
background:linear-gradient(to right,rgba(0, 133, 255,0.3),transparent), background: linear-gradient(to right, rgba(0, 133, 255, 0.3), transparent),
linear-gradient(135deg,rgba(0, 133, 255,0.5) ,transparent 80%,transparent) !important; linear-gradient(135deg, rgba(0, 133, 255, 0.5), transparent 80%, transparent) !important;
box-shadow:none !important; box-shadow: none !important;
border-width: 1px 0 0; border-width: 1px 0 0;
border-style:solid; border-style: solid;
border-image:linear-gradient(to right, rgba(0, 103, 205,0.4) 70%,transparent) 100% 0 0; border-image: linear-gradient(to right, rgba(0, 103, 205, 0.4) 70%, transparent) 100% 0 0;
} }
.player .equips>.card.fire{ .player .equips > .card.fire {
color: rgb(255,119,63); color: rgb(255, 119, 63);
} }
.player .equips>.card.thunder{ .player .equips > .card.thunder {
color: rgb(117,186,255); color: rgb(117, 186, 255);
} }
.player .equips>.card.poison{ .player .equips > .card.poison {
color: rgb(104,221,127); color: rgb(104, 221, 127);
} }
.player .equips>.card.brown{ .player .equips > .card.brown {
color: rgb(195,161,223); color: rgb(195, 161, 223);
} }
.equips > .card > .background {
.equips>.card>.background{ display: none !important;
display:none !important;
} }
.equips>.card>.name2{ .equips > .card > .name2 {
display:block; display: block;
margin-left:5px; margin-left: 5px;
white-space: nowrap; white-space: nowrap;
} }
.equips>.card>div{ .equips > .card > div {
animation:none !important; animation: none !important;
-webkit-animation:none !important; -webkit-animation: none !important;
} }
.equips>.card>.name, .equips > .card > .name,
.equips>.card>.info{ .equips > .card > .info {
display:none !important; display: none !important;
} }
.equips > .removing {
.equips>.removing{ margin-top: -12px !important;
margin-top:-12px !important; margin-bottom: -11px !important;
margin-bottom:-11px !important; transform: scale(1);
transform:scale(1);
} }
.equips>.removing+.removing{ .equips > .removing + .removing {
margin-top:-23px !important; margin-top: -23px !important;
} }
.player.linked .equips {
.player.linked .equips{ transform: rotate(90deg) translate(-152px, -6px);
transform:rotate(90deg) translate(-152px,-6px); transform-origin: bottom left;
transform-origin:bottom left;
} }
#arena.slim_player .player.linked .equips{ #arena.slim_player .player.linked .equips {
transform:rotate(90deg) translate(-155px,-6px); transform: rotate(90deg) translate(-155px, -6px);
} }
#arena.uslim_player .player.linked .equips{ #arena.uslim_player .player.linked .equips {
transform:rotate(90deg) translate(-159px,-6px); transform: rotate(90deg) translate(-159px, -6px);
} }
#arena.mslim_player .player.linked .equips{ #arena.mslim_player .player.linked .equips {
transform:rotate(90deg) translate(-157px,-6px); transform: rotate(90deg) translate(-157px, -6px);
} }
.player.minskin.linked .equips{ .player.minskin.linked .equips {
transform:rotate(90deg) translate(-92px,-6px) scale(0.73); transform: rotate(90deg) translate(-92px, -6px) scale(0.73);
} }
#arena.slim_player .player.minskin.linked .equips{ #arena.slim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-95px,-6px) scale(0.73); transform: rotate(90deg) translate(-95px, -6px) scale(0.73);
} }
#arena.uslim_player .player.minskin.linked .equips{ #arena.uslim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-99px,-6px) scale(0.73); transform: rotate(90deg) translate(-99px, -6px) scale(0.73);
} }
#arena.mslim_player .player.minskin.linked .equips{ #arena.mslim_player .player.minskin.linked .equips {
transform:rotate(90deg) translate(-97px,-6px) scale(0.73); transform: rotate(90deg) translate(-97px, -6px) scale(0.73);
} }
.player.linked .identity{ .player.linked .identity {
transform:rotate(90deg); transform: rotate(90deg);
} }

1083
layout/newlayout/global.css
View File

File diff suppressed because it is too large Load Diff

4
layout/newlayout/layout.css
View File

@ -1,2 +1,2 @@
@import 'global.css'; @import "global.css";
@import 'equip.css'; @import "equip.css";

459
layout/nova/layout.css
View File

@ -1,212 +1,212 @@
@import "../newlayout/layout.css"; @import "../newlayout/layout.css";
#arena{ #arena {
height: calc(95% + 20px); height: calc(95% + 20px);
} }
#control{ #control {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
bottom:150px; bottom: 150px;
height: 40px; height: 40px;
} }
#arena.phone #control{ #arena.phone #control {
bottom:160px; bottom: 160px;
} }
#arena.ipad #control{ #arena.ipad #control {
bottom:155px; bottom: 155px;
} }
#arena:not(.chess)>#me, #arena:not(.chess) > #me,
#arena:not(.chess)>#mebg, #arena:not(.chess) > #mebg,
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
bottom:30px; bottom: 30px;
width: calc(5000% / 47); width: calc(5000% / 47);
left:calc(-150% / 47); left: calc(-150% / 47);
top:auto; top: auto;
border-radius:0 !important; border-radius: 0 !important;
height:120px;
}
#arena.oblongcard:not(.chess)>#me,
#arena.oblongcard:not(.chess)>#mebg,
#arena.oblongcard:not(.chess)>#autonode{
height: 140px;
}
#arena.oblongcard:not(.chess)>.card,
#arena.oblongcard:not(.chess) .handcards>.card{
height: 120px; height: 120px;
} }
#arena.oblongcard:not(.chess)>.card>.image, #arena.oblongcard:not(.chess) > #me,
#arena.oblongcard:not(.chess) .handcards>.card>.image{ #arena.oblongcard:not(.chess) > #mebg,
#arena.oblongcard:not(.chess) > #autonode {
height: 140px;
}
#arena.oblongcard:not(.chess) > .card,
#arena.oblongcard:not(.chess) .handcards > .card {
height: 120px;
}
#arena.oblongcard:not(.chess) > .card > .image,
#arena.oblongcard:not(.chess) .handcards > .card > .image {
height: 110px; height: 110px;
top: 8px; top: 8px;
background-position-x: -3px; background-position-x: -3px;
} }
#arena.oblongcard:not(.chess) #handcards1{ #arena.oblongcard:not(.chess) #handcards1 {
height: 100%; height: 100%;
top: 2px; top: 2px;
} }
#arena.oblongcard:not(.chess):not(.choose-character) #control{ #arena.oblongcard:not(.chess):not(.choose-character) #control {
bottom:165px; bottom: 165px;
} }
#arena.phone.oblongcard:not(.chess):not(.choose-character) #control{ #arena.phone.oblongcard:not(.chess):not(.choose-character) #control {
bottom:180px; bottom: 180px;
} }
#arena:not(.chess)>#autonode{ #arena:not(.chess) > #autonode {
width: calc(5000% / 47 - 240px); width: calc(5000% / 47 - 240px);
left:calc(-150% / 47 + 120px); left: calc(-150% / 47 + 120px);
} }
#arena:not(.mobile).single-handcard #handcards1{ #arena:not(.mobile).single-handcard #handcards1 {
width: calc(100% - 120px); width: calc(100% - 120px);
} }
#window.rightbar #system, #window.rightbar #system,
#window.leftbar #system{ #window.leftbar #system {
width: calc(100% - 62px); width: calc(100% - 62px);
} }
#window.leftbar #system{ #window.leftbar #system {
left: 50px; left: 50px;
} }
#window.rightbar #historybar{ #window.rightbar #historybar {
left: calc(100% - 50px); left: calc(100% - 50px);
border-radius: 0; border-radius: 0;
top: 0; top: 0;
height: 100%; height: 100%;
} }
#window.leftbar #historybar{ #window.leftbar #historybar {
left: 0; left: 0;
border-radius: 0; border-radius: 0;
top: 0; top: 0;
height: 100%; height: 100%;
} }
#window.single-handcard #historybar{ #window.single-handcard #historybar {
height: calc(100% - 121px); height: calc(100% - 121px);
} }
#window.oblongcard.single-handcard #historybar{ #window.oblongcard.single-handcard #historybar {
height: calc(100% - 141px); height: calc(100% - 141px);
} }
#window.leftbar #arena:not(.chess)>#me, #window.leftbar #arena:not(.chess) > #me,
#window.leftbar #arena:not(.chess)>#mebg, #window.leftbar #arena:not(.chess) > #mebg,
#window.leftbar #arena:not(.chess)>#autonode{ #window.leftbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 50px - 75px / 47); left: calc(-150% / 47 - 50px - 75px / 47);
} }
#window.leftbar #arena:not(.chess)>#autonode{ #window.leftbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 50px - 75px / 47 + 120px); left: calc(-150% / 47 - 50px - 75px / 47 + 120px);
} }
#window.rightbar #arena:not(.chess)>#me, #window.rightbar #arena:not(.chess) > #me,
#window.rightbar #arena:not(.chess)>#mebg, #window.rightbar #arena:not(.chess) > #mebg,
#window.rightbar #arena:not(.chess)>#autonode{ #window.rightbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47); width: calc(5000% / 47 + 2500px / 47);
left:calc(-150% / 47 - 75px / 47); left: calc(-150% / 47 - 75px / 47);
} }
#window.rightbar #arena:not(.chess)>#autonode{ #window.rightbar #arena:not(.chess) > #autonode {
width: calc(5000% / 47 + 2500px / 47 - 240px); width: calc(5000% / 47 + 2500px / 47 - 240px);
left:calc(-150% / 47 - 75px / 47 + 120px); left: calc(-150% / 47 - 75px / 47 + 120px);
} }
#arena:not(.chess) #handcards1{ #arena:not(.chess) #handcards1 {
height:120px; height: 120px;
padding:0; padding: 0;
top:calc(100% - 120px); top: calc(100% - 120px);
} }
#arena:not(.chess) #handcards1.scrollh{ #arena:not(.chess) #handcards1.scrollh {
top: calc(100% - 180px); top: calc(100% - 180px);
height: 180px; height: 180px;
} }
#arena:not(.chess).oblongcard #handcards1.scrollh{ #arena:not(.chess).oblongcard #handcards1.scrollh {
top: calc(100% - 200px); top: calc(100% - 200px);
height: 200px; height: 200px;
} }
#arena:not(.chess) #handcards1.scrollh>div{ #arena:not(.chess) #handcards1.scrollh > div {
height: 120px; height: 120px;
top: 60px; top: 60px;
} }
#arena:not(.chess).oblongcard #handcards1.scrollh>div{ #arena:not(.chess).oblongcard #handcards1.scrollh > div {
top: 62px; top: 62px;
} }
#arena:not(.chess):not(.single-handcard) #handcards1{ #arena:not(.chess):not(.single-handcard) #handcards1 {
width:calc(100% - 240px); width: calc(100% - 240px);
left:calc(150% / 47 - 300% / 94 + 625% / 47 - 105px + 120px); left: calc(150% / 47 - 300% / 94 + 625% / 47 - 105px + 120px);
} }
#arena:not(.single-handcard):not(.chess)>#me, #arena:not(.single-handcard):not(.chess) > #me,
#arena:not(.single-handcard):not(.chess)>#mebg, #arena:not(.single-handcard):not(.chess) > #mebg,
#arena:not(.single-handcard):not(.chess)>#autonode{ #arena:not(.single-handcard):not(.chess) > #autonode {
left: 0 !important; left: 0 !important;
bottom: 38px !important; bottom: 38px !important;
width: calc(9700% / 94) !important; width: calc(9700% / 94) !important;
} }
#arena:not(.single-handcard):not(.chess)>#mebg{ #arena:not(.single-handcard):not(.chess) > #mebg {
visibility: hidden; visibility: hidden;
} }
#arena:not(.single-handcard):not(.chess)>#me #handcards1{ #arena:not(.single-handcard):not(.chess) > #me #handcards1 {
left: 150px !important; left: 150px !important;
width: calc(100% - 150px) !important; width: calc(100% - 150px) !important;
} }
#arena:not(.single-handcard):not(.chess)>#me #handcards1>.handcards{ #arena:not(.single-handcard):not(.chess) > #me #handcards1 > .handcards {
left: 0 !important; left: 0 !important;
} }
#autonode{ #autonode {
display: table !important; display: table !important;
} }
@media screen and (max-width: 1105px){ @media screen and (max-width: 1105px) {
#arena[data-number='8']:not(.single-handcard):not(.chess)>#me, #arena[data-number="8"]:not(.single-handcard):not(.chess) > #me,
#arena[data-number='8']:not(.single-handcard):not(.chess)>#mebg, #arena[data-number="8"]:not(.single-handcard):not(.chess) > #mebg,
#arena[data-number='8']:not(.single-handcard):not(.chess)>#autonode{ #arena[data-number="8"]:not(.single-handcard):not(.chess) > #autonode {
left: calc(-300% / 94 + 625% / 47 - 105px) !important; left: calc(-300% / 94 + 625% / 47 - 105px) !important;
width: calc(9700% / 94 + 300% / 94 - 625% / 47 + 105px) !important; width: calc(9700% / 94 + 300% / 94 - 625% / 47 + 105px) !important;
} }
} }
#handcards2{ #handcards2 {
display:none;
}
.dialog{
height:calc(100% - 370px);
bottom:170px;
}
#arena.choose-character>.dialog .placeholder+.placeholder{
display: none; display: none;
} }
#arena.choose-character>.dialog .placeholder{ .dialog {
height: calc(100% - 370px);
bottom: 170px;
}
#arena.choose-character > .dialog .placeholder + .placeholder {
display: none;
}
#arena.choose-character > .dialog .placeholder {
margin-bottom: 4px; margin-bottom: 4px;
height: 0px; height: 0px;
} }
#arena.choose-character>.dialog.noupdate .placeholder{ #arena.choose-character > .dialog.noupdate .placeholder {
margin-bottom: 0; margin-bottom: 0;
height: 0; height: 0;
} }
#arena.choose-character>.dialog{ #arena.choose-character > .dialog {
height:calc(100% - 280px); height: calc(100% - 280px);
bottom:80px; bottom: 80px;
} }
#arena.choose-character>.dialog.scroll3{ #arena.choose-character > .dialog.scroll3 {
height:calc(100% - 240px); height: calc(100% - 240px);
} }
#arena.phone.choose-character>.dialog{ #arena.phone.choose-character > .dialog {
bottom:93px; bottom: 93px;
} }
#arena.ipad.choose-character>.dialog{ #arena.ipad.choose-character > .dialog {
bottom:96px; bottom: 96px;
} }
#arena.discard-player-card>#control, #arena.discard-player-card > #control,
#arena.gain-player-card>#control, #arena.gain-player-card > #control,
#arena.choose-player-card>#control, #arena.choose-player-card > #control,
#arena.choose-to-move>#control, #arena.choose-to-move > #control,
#arena.choose-character>#control{ #arena.choose-character > #control {
bottom: 30px; bottom: 30px;
transition: all 0s; transition: all 0s;
} }
#arena.phone.discard-player-card>#control, #arena.phone.discard-player-card > #control,
#arena.phone.gain-player-card>#control, #arena.phone.gain-player-card > #control,
#arena.phone.choose-player-card>#control, #arena.phone.choose-player-card > #control,
#arena.phone.choose-to-move>#control, #arena.phone.choose-to-move > #control,
#arena.phone.choose-character>#control{ #arena.phone.choose-character > #control {
bottom: 43px; bottom: 43px;
} }
#arena.ipad.discard-player-card>#control, #arena.ipad.discard-player-card > #control,
#arena.ipad.gain-player-card>#control, #arena.ipad.gain-player-card > #control,
#arena.ipad.choose-player-card>#control, #arena.ipad.choose-player-card > #control,
#arena.ipad.choose-to-move>#control, #arena.ipad.choose-to-move > #control,
#arena.ipad.choose-character>#control{ #arena.ipad.choose-character > #control {
bottom: 45px; bottom: 45px;
} }
.dialog.fullheight { .dialog.fullheight {
@ -214,150 +214,235 @@
top: 40px !important; top: 40px !important;
} }
#me>.fakeme.avatar{ #me > .fakeme.avatar {
width:120px; width: 120px;
height:100%; height: 100%;
border-radius:0px; border-radius: 0px;
top:0; top: 0;
left:0; left: 0;
background-size:cover; background-size: cover;
clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
-webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px); -webkit-clip-path: polygon(-10px 0, 130px 0, 130px 130px, -10px 130px);
} }
#window[data-radius_size='increase'] #me>.fakeme.avatar, #window[data-radius_size="increase"] #me > .fakeme.avatar,
#window[data-radius_size='reduce'] #me>.fakeme.avatar{ #window[data-radius_size="reduce"] #me > .fakeme.avatar {
border-radius:0px; border-radius: 0px;
} }
/*--------位置(8人)------*/ /*--------位置(8人)------*/
[data-number='8']>.player[data-position='1']{top:calc(55% - 135px);left:calc(100% - 150px);} [data-number="8"] > .player[data-position="1"] {
[data-number='8']>.player[data-position='2']{top:calc(10% - 50px);left:calc(100% - 150px);} top: calc(55% - 135px);
[data-number='8']>.player[data-position='3']{top:0;left:calc(75% - 112.5px);} left: calc(100% - 150px);
[data-number='8']>.player[data-position='4']{top:0;left:calc(50% - 75px);} }
[data-number='8']>.player[data-position='5']{top:0;left:calc(25% - 37.5px);} [data-number="8"] > .player[data-position="2"] {
[data-number='8']>.player[data-position='6']{top:calc(10% - 50px);left:0;} top: calc(10% - 50px);
[data-number='8']>.player[data-position='7']{top:calc(55% - 135px);left:0;} left: calc(100% - 150px);
}
[data-number="8"] > .player[data-position="3"] {
top: 0;
left: calc(75% - 112.5px);
}
[data-number="8"] > .player[data-position="4"] {
top: 0;
left: calc(50% - 75px);
}
[data-number="8"] > .player[data-position="5"] {
top: 0;
left: calc(25% - 37.5px);
}
[data-number="8"] > .player[data-position="6"] {
top: calc(10% - 50px);
left: 0;
}
[data-number="8"] > .player[data-position="7"] {
top: calc(55% - 135px);
left: 0;
}
/*--------位置(7人)------*/ /*--------位置(7人)------*/
[data-number='7']>.player[data-position='1']{top:calc(55% - 135px);left:calc(100% - 150px);} [data-number="7"] > .player[data-position="1"] {
[data-number='7']>.player[data-position='2']{top:calc(10% - 50px);left:calc(100% - 150px);} top: calc(55% - 135px);
[data-number='7']>.player[data-position='3']{top:0;left:calc(62.5% - 75px);} left: calc(100% - 150px);
[data-number='7']>.player[data-position='4']{top:0;left:calc(37.5% - 75px);} }
[data-number='7']>.player[data-position='5']{top:calc(10% - 50px);left:0;} [data-number="7"] > .player[data-position="2"] {
[data-number='7']>.player[data-position='6']{top:calc(55% - 135px);left:0;} top: calc(10% - 50px);
left: calc(100% - 150px);
}
[data-number="7"] > .player[data-position="3"] {
top: 0;
left: calc(62.5% - 75px);
}
[data-number="7"] > .player[data-position="4"] {
top: 0;
left: calc(37.5% - 75px);
}
[data-number="7"] > .player[data-position="5"] {
top: calc(10% - 50px);
left: 0;
}
[data-number="7"] > .player[data-position="6"] {
top: calc(55% - 135px);
left: 0;
}
/*--------位置(6人)------*/ /*--------位置(6人)------*/
#arena[data-number='6']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="6"] > .player[data-position="1"] {
#arena[data-number='6']>.player[data-position='2']{top:0px;left:calc(75% - 90px);} top: calc(30% - 128px);
#arena[data-number='6']>.player[data-position='3']{top:0;left:calc(50% - 60px);} left: calc(100% - 120px);
#arena[data-number='6']>.player[data-position='4']{top:0px;left:calc(25% - 30px);} }
#arena[data-number='6']>.player[data-position='5']{top:calc(30% - 128px);left:0;} #arena[data-number="6"] > .player[data-position="2"] {
top: 0px;
left: calc(75% - 90px);
}
#arena[data-number="6"] > .player[data-position="3"] {
top: 0;
left: calc(50% - 60px);
}
#arena[data-number="6"] > .player[data-position="4"] {
top: 0px;
left: calc(25% - 30px);
}
#arena[data-number="6"] > .player[data-position="5"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(5人)------*/ /*--------位置(5人)------*/
#arena[data-number='5']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="5"] > .player[data-position="1"] {
#arena[data-number='5']>.player[data-position='2']{top:0;left:calc(200% / 3 - 80px);} top: calc(30% - 128px);
#arena[data-number='5']>.player[data-position='3']{top:0;left:calc(100% / 3 - 40px);} left: calc(100% - 120px);
#arena[data-number='5']>.player[data-position='4']{top:calc(30% - 128px);left:0;} }
#arena[data-number="5"] > .player[data-position="2"] {
top: 0;
left: calc(200% / 3 - 80px);
}
#arena[data-number="5"] > .player[data-position="3"] {
top: 0;
left: calc(100% / 3 - 40px);
}
#arena[data-number="5"] > .player[data-position="4"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(4人)------*/ /*--------位置(4人)------*/
#arena[data-number='4']>.player[data-position='1']{top:calc(30% - 128px);left:calc(100% - 120px);} #arena[data-number="4"] > .player[data-position="1"] {
#arena[data-number='4']>.player[data-position='2']{top:0;left:calc(50% - 60px);} top: calc(30% - 128px);
#arena[data-number='4']>.player[data-position='3']{top:calc(30% - 128px);left:0;} left: calc(100% - 120px);
}
#arena[data-number="4"] > .player[data-position="2"] {
top: 0;
left: calc(50% - 60px);
}
#arena[data-number="4"] > .player[data-position="3"] {
top: calc(30% - 128px);
left: 0;
}
/*--------位置(3人)------*/ /*--------位置(3人)------*/
#arena[data-number='3']>.player[data-position='1']{top:calc(60% / 3 - 88px);left:calc(75% + 80px);} #arena[data-number="3"] > .player[data-position="1"] {
#arena[data-number='3']>.player[data-position='2']{top:calc(60% / 3 - 88px);left:calc(25% - 200px);} top: calc(60% / 3 - 88px);
left: calc(75% + 80px);
}
#arena[data-number="3"] > .player[data-position="2"] {
top: calc(60% / 3 - 88px);
left: calc(25% - 200px);
}
/*--------位置(2人)------*/ /*--------位置(2人)------*/
#arena[data-number='2']>.player[data-position='1']{top:0;left:calc(50% - 60px);} #arena[data-number="2"] > .player[data-position="1"] {
top: 0;
left: calc(50% - 60px);
}
/*--------位置(1人)------*/ /*--------位置(1人)------*/
.player[data-position='0']{top:calc(100% - 220px);left:0;} .player[data-position="0"] {
top: calc(100% - 220px);
left: 0;
}
#arena[data-player_height_nova="default"] > .player[data-position="0"]:not(.minskin) {
#arena[data-player_height_nova="default"]>.player[data-position='0']:not(.minskin){
top: calc(100% - 236px); top: calc(100% - 236px);
} }
[data-number='8'][data-player_height_nova="default"]>.player[data-position='1'], [data-number="8"][data-player_height_nova="default"] > .player[data-position="1"],
[data-number='8'][data-player_height_nova="default"]>.player[data-position='7'], [data-number="8"][data-player_height_nova="default"] > .player[data-position="7"],
[data-number='7'][data-player_height_nova="default"]>.player[data-position='1'], [data-number="7"][data-player_height_nova="default"] > .player[data-position="1"],
[data-number='7'][data-player_height_nova="default"]>.player[data-position='6']{ [data-number="7"][data-player_height_nova="default"] > .player[data-position="6"] {
top:calc(55% - 143px); top: calc(55% - 143px);
} }
#arena[data-player_height_nova="default"]>.player:not(.minskin){ #arena[data-player_height_nova="default"] > .player:not(.minskin) {
height: 196px !important; height: 196px !important;
} }
#arena[data-player_height_nova="default"] .timerbar>div{ #arena[data-player_height_nova="default"] .timerbar > div {
top: 181px; top: 181px;
} }
#arena[data-player_height_nova="default"]>.player .avatar{ #arena[data-player_height_nova="default"] > .player .avatar {
height:176px; height: 176px;
} }
#arena.slim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.slim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar {
height: 182px; height: 182px;
} }
#arena.uslim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.uslim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar {
height: 190px; height: 190px;
} }
#arena.mslim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.mslim_player[data-player_height_nova="default"] .player:not(.minskin):not(.fakeme) .avatar {
height: 186px; height: 186px;
} }
#arena[data-player_height_nova="default"]>.player.fullskin2 .avatar2{ #arena[data-player_height_nova="default"] > .player.fullskin2 .avatar2 {
height:176px; height: 176px;
} }
#arena.slim_player[data-player_height_nova="default"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.slim_player[data-player_height_nova="default"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 182px; height: 182px;
} }
#arena.uslim_player[data-player_height_nova="default"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.uslim_player[data-player_height_nova="default"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 190px; height: 190px;
} }
#arena.mslim_player[data-player_height_nova="default"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.mslim_player[data-player_height_nova="default"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 186px; height: 186px;
} }
#arena[data-player_height_nova="long"] > .player[data-position="0"]:not(.minskin) {
#arena[data-player_height_nova="long"]>.player[data-position='0']:not(.minskin){
top: calc(100% - 250px); top: calc(100% - 250px);
} }
[data-number='8'][data-player_height_nova="long"]>.player[data-position='1'], [data-number="8"][data-player_height_nova="long"] > .player[data-position="1"],
[data-number='8'][data-player_height_nova="long"]>.player[data-position='7'], [data-number="8"][data-player_height_nova="long"] > .player[data-position="7"],
[data-number='7'][data-player_height_nova="long"]>.player[data-position='1'], [data-number="7"][data-player_height_nova="long"] > .player[data-position="1"],
[data-number='7'][data-player_height_nova="long"]>.player[data-position='6']{ [data-number="7"][data-player_height_nova="long"] > .player[data-position="6"] {
top:calc(55% - 150px); top: calc(55% - 150px);
} }
#arena[data-player_height_nova="long"]>.player:not(.minskin){ #arena[data-player_height_nova="long"] > .player:not(.minskin) {
height: 210px !important; height: 210px !important;
} }
#arena[data-player_height_nova="long"] .timerbar>div{ #arena[data-player_height_nova="long"] .timerbar > div {
top: 195px; top: 195px;
} }
#arena[data-player_height_nova="long"]>.player .avatar{ #arena[data-player_height_nova="long"] > .player .avatar {
height:190px; height: 190px;
} }
#arena.slim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.slim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar {
height: 196px; height: 196px;
} }
#arena.uslim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.uslim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar {
height: 204px; height: 204px;
} }
#arena.mslim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar{ #arena.mslim_player[data-player_height_nova="long"] .player:not(.minskin):not(.fakeme) .avatar {
height: 200px; height: 200px;
} }
#arena[data-player_height_nova="long"]>.player.fullskin2 .avatar2{ #arena[data-player_height_nova="long"] > .player.fullskin2 .avatar2 {
height:190px; height: 190px;
} }
#arena.slim_player[data-player_height_nova="long"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.slim_player[data-player_height_nova="long"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 196px; height: 196px;
} }
#arena.uslim_player[data-player_height_nova="long"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.uslim_player[data-player_height_nova="long"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 204px; height: 204px;
} }
#arena.mslim_player[data-player_height_nova="long"]> .player.fullskin2:not(.minskin) .avatar2{ #arena.mslim_player[data-player_height_nova="long"] > .player.fullskin2:not(.minskin) .avatar2 {
height: 200px; height: 200px;
} }
#arena>.player:not(.minskin)>.avatar, #arena > .player:not(.minskin) > .avatar,
#arena>.player:not(.minskin)>.avatar2{ #arena > .player:not(.minskin) > .avatar2 {
background-position: 50% 0 !important; background-position: 50% 0 !important;
} }