mapcomplete/customGenerator.html

109 lines
2.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="index.css" rel="stylesheet"/>
<link href="css/tabbedComponent.css" rel="stylesheet"/>
<title>Custom Theme Generator for Mapcomplete</title>
<style type="text/css">
img {
min-width: 35px;
min-height: 35px;
}
input{
border: 0.5px solid #939393;
}
.icon-preview {
max-width: 2em;
max-height: 2em ;
}
.image-large-preview {
max-width: 100%;
max-height: 30vh;
}
.json{
width:100%;
box-sizing: border-box;
}
.bordered {
border: 1px solid black;
display:block;
padding: 0.5em;
border-radius: 0.5em;
box-sizing: border-box;
}
.tag-input-row {
display: block ruby;
box-sizing: border-box;
margin-right: 2em;
width: calc(100% - 3em);
padding-right: 0.5em;
height: min-content;
}
.min-height {
display: block;
height: min-content;
}
.main-tabs{
height: 100vh;
}
.tab-content {
padding-top: 0;
padding-bottom: 0;
padding-left: 0;
margin-left: 0.5em;
}
.main-tabs > .tabs-header-bar {
background: #eee;
}
.scrollable {
display: block;
overflow-y: scroll;
height: calc(100vh - 9em - 10px);
}
.main-tabs > .tab-content {
display: block;
height: 100%;
padding-bottom: 0 ;
padding-right: 0;
}
.main-tabs > .tab-content > span{
display: block;
height: 100%;
}
body {
height: 100%;
}
#maindiv {
height: calc(100% - 6em);
}
</style>
</head>
<body>
<div id="maindiv">
Loading the MapComplete custom theme builder...<br/>
If this message persists, make sure javascript is enabled and no script blocker is blocking this.
</div>
<script src="./customGenerator.ts"></script>
</body>
</html>