elm-mdl/elm-mdl-demo.html
2016-03-08 17:30:09 +01:00

33 lines
1,019 B
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>elm-mdl-demo</title>
<!-- MDL -->
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300,500|Roboto+Mono|Roboto+Condensed:400,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.min.css" />
</head>
<body>
<!-- elm -->
<script src="built/elm.js"></script>
<script>
var isSmallScreenQuery = window.matchMedia('(max-width: 1024px)');
app = Elm.fullscreen(Elm.Main,
{ isSmallScreenSignal : isSmallScreenQuery.matches
}
);
/* Connect Material/isSmallScreenSignal. */
isSmallScreenQuery.addListener(function () {
app.ports.isSmallScreenSignal.send(isSmallScreenQuery.matches);
});
</script>
</body>