DHBW/Projektmanagement-Game
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

Merge pull request #58 from H4CK3R-01/mobile_design

Browse Source 
Mobile design
This commit is contained in:
Florian Kaiser 2021-07-10 16:57:40 +02:00 committed by GitHub
commit 7010fb32c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 68 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
public/css/chat.css
View File

@ -15,6 +15,10 @@
padding: 5px; padding: 5px;
} }
#messages_received div:last-child {
margin-bottom: 5em;
}
#message_add { #message_add {
flex: 0 0 10%; flex: 0 0 10%;
} }
@ -97,4 +101,33 @@
.messageBody::before { .messageBody::before {
content: '\A'; content: '\A';
white-space: pre; white-space: pre;
}
@media only screen and (max-width: 980px) {
#chat {
flex-flow: column-reverse;
border-top: #7d7d7d solid 2px;
height: 100%;
margin-bottom: 10px;
}
.log_message {
font-size: 2em;
}
.chat_message .username {
font-size: 2em;
}
.chat_message .messageBody {
font-size: 2em;
}
#message_input {
font-size: 2em;
}
#message_send {
font-size: 2em;
}
} }

9
public/css/components.css
View File

@ -99,4 +99,13 @@ main {
#manual { #manual {
width: 100%; width: 100%;
height: calc(100% - 50px); height: calc(100% - 50px);
}
@media only screen and (max-width: 980px) {
#main {
display: grid;
grid-template-columns: unset;
grid-template-rows: 60% 40%;
height: 100%;
}
} }

7
public/css/game.css
View File

@ -10,4 +10,11 @@
-moz-background-size: cover; /* Mozilla*/ -moz-background-size: cover; /* Mozilla*/
-o-background-size: cover; /* Opera*/ -o-background-size: cover; /* Opera*/
background-size: cover; /* Generic*/ background-size: cover; /* Generic*/
}
@media only screen and (max-width: 980px) {
#game {
height: auto;
width: auto;
}
} }

18
public/css/header.css
View File

@ -44,3 +44,21 @@ header {
padding-right: 10px; padding-right: 10px;
flex-direction: column; flex-direction: column;
} }
@media only screen and (max-width: 980px) {
header {
height: 3em;
}
.title {
font-size: 2em;
}
.build {
font-size: 1em;
}
.spielanleitung {
font-size: 1.5em;
}
}

2
public/index.html
View File

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" content="user-scalable=no, autoRotate:disabled" name="viewport"/>
<title>Projektmanagement Game</title> <title>Projektmanagement Game</title>
<link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet">