cinema/index.html
2022-04-01 23:57:59 +02:00

84 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<script src="main.riot" type="riot"></script>
<script src="search.riot" type="riot"></script>
<script src="film.riot" type="riot"></script>
<script src="sorting.riot" type="riot"></script>
<script src="kind.riot" type="riot"></script>
<script src="detail.riot" type="riot"></script>
<script src="service.js"></script>
<script src="https://cdn.jsdelivr.net/npm/riot@6.1.2/riot+compiler.min.js"></script>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="./style.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
body {
font-family: Arial, Helvetica, sans-serif;
}
/* Style the header */
.header {
background-color: #f1f1f1;
padding: 30px;
text-align: center;
font-size: 35px;
}
/* Container for flexboxes */
.row {
display: -webkit-flex;
display: flex;
}
/* Create three equal columns that sits next to each other */
.column {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
padding: 10px;
height: 300px; /* Should be removed. Only for demonstration */
}
/* Style the footer */
.footer {
background-color: #f1f1f1;
padding: 10px;
text-align: center;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 600px) {
.row {
-webkit-flex-direction: column;
flex-direction: column;
}
}
</style>
</head>
<body>
<main title="CINEMAMA"></main>
</body>
<script>
(async () => {
await riot.compile().then(()=>{
riot.install(function(component){
component.sa = sa
})
let sa = makeServiceajax();
console.log(sa);
console.log(riot.mount('main'));
});
})()
</script>
</html>