Changed min/max sizes for mobile layout
Automatically refreshes the iFrame when the screen is rotated - this forces the layout to refresh to the correct one
This commit is contained in:
parent
b700c3eac5
commit
df051508e2
@ -11,6 +11,12 @@ session_start();
|
|||||||
<link rel="stylesheet" href="/styles/primary.css" />
|
<link rel="stylesheet" href="/styles/primary.css" />
|
||||||
<link rel="stylesheet" href="/styles/admin.css" />
|
<link rel="stylesheet" href="/styles/admin.css" />
|
||||||
<script src="/scripts/tools.js"></script>
|
<script src="/scripts/tools.js"></script>
|
||||||
|
<script>
|
||||||
|
// When the device is rotated, automatically refresh the frame
|
||||||
|
screen.orientation.addEventListener("change", (event) => {
|
||||||
|
document.getElementById("dataFrame").contentWindow.location.reload();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
<title>ADMIN PANEL - Trojan's Trophy Room</title>
|
<title>ADMIN PANEL - Trojan's Trophy Room</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
@ -10,6 +10,12 @@ session_start();
|
|||||||
<link rel="stylesheet" href="/styles/primary.css" />
|
<link rel="stylesheet" href="/styles/primary.css" />
|
||||||
<script src="/scripts/tools.js"></script>
|
<script src="/scripts/tools.js"></script>
|
||||||
<title>Trojan's Trophy Room</title>
|
<title>Trojan's Trophy Room</title>
|
||||||
|
<script>
|
||||||
|
// When the device is rotated, automatically refresh the frame
|
||||||
|
screen.orientation.addEventListener("change", (event) => {
|
||||||
|
document.getElementById("dataFrame").contentWindow.location.reload();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body id="body">
|
<body id="body">
|
||||||
|
@ -22,7 +22,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (min-width: 360px) and (max-width: 1024px) {
|
||||||
#generalBody {
|
#generalBody {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
}
|
}
|
||||||
|
@ -52,7 +52,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (min-width: 360px) and (max-width: 1024px) {
|
||||||
|
|
||||||
.sqlOutput {
|
.sqlOutput {
|
||||||
width: 275px;
|
width: 275px;
|
||||||
|
@ -137,7 +137,7 @@
|
|||||||
|
|
||||||
/* MOBILE */
|
/* MOBILE */
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (min-width: 360px) and (max-width: 1024px) {
|
||||||
|
|
||||||
#headerLeft {
|
#headerLeft {
|
||||||
display:none;
|
display:none;
|
||||||
|
@ -241,12 +241,12 @@ TEMPORARY
|
|||||||
|
|
||||||
/* MOBILE */
|
/* MOBILE */
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (min-width: 360px) and (max-width: 1024px) {
|
||||||
html,body {
|
html,body {
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
#body {
|
#body {
|
||||||
width: 370px;
|
width: 360px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -258,7 +258,7 @@ TEMPORARY
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
background-color: rgba(255, 255, 255, .2);
|
background-color: rgba(255, 255, 255, .2);
|
||||||
width: 98%;
|
width: 98%;
|
||||||
max-width: 370px;
|
max-width: 360px;
|
||||||
min-height: 0px;
|
min-height: 0px;
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
@ -313,7 +313,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width: 480px) {
|
@media only screen and (min-width: 360px) and (max-width: 1024px) {
|
||||||
|
|
||||||
#createAccountPanel {
|
#createAccountPanel {
|
||||||
width: 275px;
|
width: 275px;
|
||||||
|
@ -43,6 +43,12 @@ try { // Try opening the SQL database connection
|
|||||||
<link rel="stylesheet" href="/styles/primary.css" />
|
<link rel="stylesheet" href="/styles/primary.css" />
|
||||||
<link rel="stylesheet" href="/styles/user_management.css" />
|
<link rel="stylesheet" href="/styles/user_management.css" />
|
||||||
<script src="/scripts/tools.js"></script>
|
<script src="/scripts/tools.js"></script>
|
||||||
|
<script>
|
||||||
|
// When the device is rotated, automatically refresh the frame
|
||||||
|
screen.orientation.addEventListener("change", (event) => {
|
||||||
|
document.getElementById("dataFrame").contentWindow.location.reload();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
<title>My Account - Trojan's Trophy Room</title>
|
<title>My Account - Trojan's Trophy Room</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user