mirror of
https://github.com/esx-framework/esx_core.git
synced 2026-08-30 01:38:52 +00:00
style(esx_multicharacter): run prettier
This commit is contained in:
MoskalykA
@@ -1,76 +1,76 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;600&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
|
||||
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@300;600&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Oswald&display=swap");
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
color: rgb(255, 255, 255);
|
||||
border-radius: 15px;
|
||||
font-weight: 300;
|
||||
font-size: 1.6vh;
|
||||
font-family: Calibri, "Helvetica", san-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
color: rgb(255, 255, 255);
|
||||
border-radius: 15px;
|
||||
font-weight: 300;
|
||||
font-size: 1.6vh;
|
||||
font-family: Calibri, "Helvetica", san-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
overflow: hidden;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
body {
|
||||
background: transparent;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
display:none;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 150;
|
||||
transform: translate(0, -50%);
|
||||
border-radius: 15px;
|
||||
background: rgba(15,15,15, 0.9);
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 150;
|
||||
transform: translate(0, -50%);
|
||||
border-radius: 15px;
|
||||
background: rgba(15, 15, 15, 0.9);
|
||||
}
|
||||
|
||||
.header {
|
||||
font-family: 'Oswald', sans-serif;
|
||||
position: absolute;
|
||||
background: rgba(10, 10, 10, 0.9);
|
||||
border-radius: 15px 15px 0px 0px;
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
left: 50%;
|
||||
text-align: center;
|
||||
transform: translate(-50%);
|
||||
font-weight: 700;
|
||||
padding-bottom: 5px;
|
||||
font-size: 1.6rem;
|
||||
font-family: "Oswald", sans-serif;
|
||||
position: absolute;
|
||||
background: rgba(10, 10, 10, 0.9);
|
||||
border-radius: 15px 15px 0px 0px;
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
left: 50%;
|
||||
text-align: center;
|
||||
transform: translate(-50%);
|
||||
font-weight: 700;
|
||||
padding-bottom: 5px;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
font-size: 0rem;
|
||||
position: absolute;
|
||||
font-size: 0rem;
|
||||
}
|
||||
|
||||
.character-box {
|
||||
display: flex;
|
||||
right: 0;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
line-height: 1.4rem;
|
||||
height: calc(30rem);
|
||||
width: 17rem;
|
||||
border: 1px rgba(10,10,10,0.7) solid;
|
||||
box-shadow: 2px 1px 9px 3px rgba(10,10,10,0.7);
|
||||
display: flex;
|
||||
right: 0;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
line-height: 1.4rem;
|
||||
height: calc(30rem);
|
||||
width: 17rem;
|
||||
border: 1px rgba(10, 10, 10, 0.7) solid;
|
||||
box-shadow: 2px 1px 9px 3px rgba(10, 10, 10, 0.7);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Oswald', sans-serif;
|
||||
font-size: 22px;
|
||||
padding-top: 1.3rem;
|
||||
display: block;
|
||||
font-weight: 0;
|
||||
font-family: "Oswald", sans-serif;
|
||||
font-size: 22px;
|
||||
padding-top: 1.3rem;
|
||||
display: block;
|
||||
font-weight: 0;
|
||||
}
|
||||
|
||||
@@ -1,35 +1,68 @@
|
||||
var money = Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: 'USD',
|
||||
minimumFractionDigits: 0
|
||||
var money = Intl.NumberFormat("en-US", {
|
||||
style: "currency",
|
||||
currency: "USD",
|
||||
minimumFractionDigits: 0,
|
||||
});
|
||||
|
||||
(() => {
|
||||
Kashacter = {};
|
||||
Kashacter = {};
|
||||
|
||||
Kashacter.ShowUI = function(data) {
|
||||
$('body').css({"display":"block"});
|
||||
$('.main-container').css({"display":"block"});
|
||||
$('[data-charid=1]').html('<div class="character-info"><p class="character-info-name"><h1>' + `${translate.name} ` + '</h1><span>' + data.firstname +' '+ data.lastname +'</span></p><p class="character-info-work"><h1>' + `${translate.job} ` + '</h1><span>'+ data.job +' '+ data.job_grade +'</span></p><p class="character-info-money"><h1>' + `${translate.money} ` + '</h1><span> '+ money.format(data.money) +'</span></p><p class="character-info-bank"><h1>' + `${translate.bank} ` + '</h1><span> '+ money.format(data.bank) +'</span></p> <p class="character-info-dateofbirth"><h1>' + `${translate.dob} ` + '</h1><span>'+ data.dateofbirth +'</span></p> <p class="character-info-gender"><h1>' + `${translate.gender} ` + '</h1><span>'+ data.sex +'</span></p></div>').attr("data-ischar", "true");
|
||||
};
|
||||
Kashacter.ShowUI = function (data) {
|
||||
$("body").css({ display: "block" });
|
||||
$(".main-container").css({ display: "block" });
|
||||
$("[data-charid=1]")
|
||||
.html(
|
||||
'<div class="character-info"><p class="character-info-name"><h1>' +
|
||||
`${translate.name} ` +
|
||||
"</h1><span>" +
|
||||
data.firstname +
|
||||
" " +
|
||||
data.lastname +
|
||||
'</span></p><p class="character-info-work"><h1>' +
|
||||
`${translate.job} ` +
|
||||
"</h1><span>" +
|
||||
data.job +
|
||||
" " +
|
||||
data.job_grade +
|
||||
'</span></p><p class="character-info-money"><h1>' +
|
||||
`${translate.money} ` +
|
||||
"</h1><span> " +
|
||||
money.format(data.money) +
|
||||
'</span></p><p class="character-info-bank"><h1>' +
|
||||
`${translate.bank} ` +
|
||||
"</h1><span> " +
|
||||
money.format(data.bank) +
|
||||
'</span></p> <p class="character-info-dateofbirth"><h1>' +
|
||||
`${translate.dob} ` +
|
||||
"</h1><span>" +
|
||||
data.dateofbirth +
|
||||
'</span></p> <p class="character-info-gender"><h1>' +
|
||||
`${translate.gender} ` +
|
||||
"</h1><span>" +
|
||||
data.sex +
|
||||
"</span></p></div>"
|
||||
)
|
||||
.attr("data-ischar", "true");
|
||||
};
|
||||
|
||||
Kashacter.CloseUI = function() {
|
||||
$('body').css({"display":"none"});
|
||||
$('.main-container').css({"display":"none"});
|
||||
$('[data-charid=1]').html('<h3 class="character-fullname"></h3><div class="character-info"><p class="character-info-new"></p></div>');
|
||||
};
|
||||
|
||||
window.onload = function(e) {
|
||||
window.addEventListener('message', function(event) {
|
||||
switch(event.data.action) {
|
||||
case 'openui':
|
||||
Kashacter.ShowUI(event.data.character);
|
||||
break;
|
||||
case 'closeui':
|
||||
Kashacter.CloseUI();
|
||||
break;
|
||||
}
|
||||
})
|
||||
}
|
||||
Kashacter.CloseUI = function () {
|
||||
$("body").css({ display: "none" });
|
||||
$(".main-container").css({ display: "none" });
|
||||
$("[data-charid=1]").html(
|
||||
'<h3 class="character-fullname"></h3><div class="character-info"><p class="character-info-new"></p></div>'
|
||||
);
|
||||
};
|
||||
|
||||
window.onload = function (e) {
|
||||
window.addEventListener("message", function (event) {
|
||||
switch (event.data.action) {
|
||||
case "openui":
|
||||
Kashacter.ShowUI(event.data.character);
|
||||
break;
|
||||
case "closeui":
|
||||
Kashacter.CloseUI();
|
||||
break;
|
||||
}
|
||||
});
|
||||
};
|
||||
})();
|
||||
|
||||
@@ -1,24 +1,29 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" type="text/css" href="css/main.css" />
|
||||
<!-- Locales -->
|
||||
<script src="locales/en.js"></script>
|
||||
</head>
|
||||
<body style="display: none;">
|
||||
<div class="main-container">
|
||||
<div class='header'>Character Info</div>
|
||||
<div class="character-box" data-charid="1">
|
||||
<h3 class="character-fullname"></h3>
|
||||
<div class="character-info"></div>
|
||||
</div>
|
||||
<div class='footer'>Multicharacter</div>
|
||||
</div>
|
||||
</div>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" type="text/css" href="css/main.css" />
|
||||
<!-- Locales -->
|
||||
<script src="locales/en.js"></script>
|
||||
</head>
|
||||
<body style="display: none">
|
||||
<div class="main-container">
|
||||
<div class="header">Character Info</div>
|
||||
<div class="character-box" data-charid="1">
|
||||
<h3 class="character-fullname"></h3>
|
||||
<div class="character-info"></div>
|
||||
</div>
|
||||
<div class="footer">Multicharacter</div>
|
||||
</div>
|
||||
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.3.1.min.js"
|
||||
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
<script src="js/app.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user