Adapted the web page to mobile devices.
1 files changed, 53 insertions(+), 13 deletions(-)

M jasm/website/site/index.html
M jasm/website/site/index.html +53 -13
@@ 6,9 6,19 @@ 
 		<meta name="description" content="This is the official home for the jAsm assembler.">
 		<meta name="keywords" content="jAsm,6502,65c02,65ce02,45gs04,mega65,z80,assembler,asm,cross-assembler">
 		<meta name="author" content="Jonas Hultén">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
 		<link rel="shortcut icon" href="images/favicon.ico">
 		
 		<style>
+			@viewport {
+				width: device-width;
+				zoom: 1.0;
+			}
+			img {
+				width: auto;
+				max-width: 100%;
+				height: auto;
+			}
 			body
 			{
 				background-color: #ffffff;

          
@@ 29,18 39,6 @@ 
 				font-size: 1.4em;
 				color: #606060;
 			}
-			div.section
-			{
-				width: 380px;
-				margin-right: 40px;
-				margin-top: 40px;
-				margin-bottom: 40px;
-				float: left;
-			}
-			div.section.even
-			{
-				margin-right: 0;
-			}
 			a
 			{
 				text-decoration:none;

          
@@ 56,10 54,52 @@ 
 				color: #933611;
 			}
 
+			div.page
+			{
+				margin: 0 auto;
+				width: 800px;
+				text-align: left;
+				margin-top: 40px;
+				margin-bottom: 40px;
+			}
+			div.section
+			{
+				width: 380px;
+				margin-right: 40px;
+				margin-top: 40px;
+				margin-bottom: 40px;
+				float: left;
+			}
+			div.section.even
+			{
+				margin-right: 0;
+			}
+
+			@media only screen and (max-width: 640px)
+			{
+				div.page
+				{
+					width: 100%;
+				}
+				div.section
+				{
+					width: 100%;
+					margin-left: auto;
+					margin-right: auto;
+					float: none;
+				}
+				div.section.even
+				{
+					width: 100%;
+					margin-left: auto;
+					margin-right: auto;
+					float: none;
+				}
+			}
 		</style>
 	</head>
 	<body>
-		<div style="margin: 0 auto; width: 800px; text-align: left; margin-top: 40px; margin-bottom: 40px;">
+		<div class="page">
 			<div style="text-align: center;">
 				<img src="images/logo_400.png" alt="jAsm Logo">
 			</div>