Skip to content
Snippets Groups Projects
Commit c4e72d66 authored by Anton Sarukhanov's avatar Anton Sarukhanov
Browse files

More embed ui tweaks. Still feature-incomplete.

parent 6f1a05be
No related branches found
No related tags found
1 merge request!1Implemented Embed-code generator interface
Hide whitespace changes
Inline Side-by-side
static/css/map.css
+ 6
− 0
View file @ c4e72d66
...@@ -203,6 +203,12 @@ fieldset legend ~ label { ...@@ -203,6 +203,12 @@ fieldset legend ~ label {
.modal h2 a { .modal h2 a {
text-decoration: underline; text-decoration: underline;
} }
.embed-only {
display: none;
}
body.embed .embed-only {
display: block;
}
#embed-form input { #embed-form input {
width: 5em; width: 5em;
} }
......
templates/base.html
+ 1
− 1
View file @ c4e72d66
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
{% block head %} {% block head %}
{% endblock %} {% endblock %}
</head> </head>
<body> <body class="{% if embed %}embed{% endif %}">
{% block body %}{% endblock %} {% block body %}{% endblock %}
{% block body_end %}{% endblock %} {% block body_end %}{% endblock %}
</body> </body>
......
templates/map.html
+ 1
− 1
View file @ c4e72d66
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<link href="static/css/map.css" rel="stylesheet" /> <link href="static/css/map.css" rel="stylesheet" />
{% endblock %} {% endblock %}
{% block body %} {% block body %}
<div id="map" class="{% if embed %}embed{% endif %}"></div> <div id="map"></div>
{# TODO: Generate these using JS, not here. #} {# TODO: Generate these using JS, not here. #}
<div id="msg"> <div id="msg">
<span id="msg-zoomForVehicles">Zoom in to see vehicles.</span> <span id="msg-zoomForVehicles">Zoom in to see vehicles.</span>
......
templates/modal-about.html
+ 5
− 1
View file @ c4e72d66
<h2>About PyBusMap</h2> <h2>About This Map</h2>
<p> <p>
This map displays real-time vehicle locations and arrival predictions This map displays real-time vehicle locations and arrival predictions
for public transit systems which are tracked by NextBus. for public transit systems which are tracked by NextBus.
</p> </p>
<p class="embed-only" style="text-align: center; font-size: 1.2em;">
<a href="{{ url_for('map', _external=True) }}" target="_blank">
Click to see the full map</a>
</p>
<p> <p>
Built by <a href="https://ant.sr">Anton Sarukhanov</a>. Open source Built by <a href="https://ant.sr">Anton Sarukhanov</a>. Open source
and MIT licensed. and MIT licensed.
......
templates/modal-embed.html
+ 3
− 3
View file @ c4e72d66
<h2>Embed This Map</h2> <h2>Embed This Map</h2>
<p> <p>
This map can be used in websites, displays, or digital signage solutions. This map can be used in websites, displays, or digital signage solutions. To embed a list of predictions instead, change the <strong>Mode</strong> selector.
</p> </p>
<h3>Embed Code</h3> <h3>Embed Code</h3>
<textarea id="embed-code" cols=100 rows=3 readonly=true></textarea> <textarea id="embed-code" cols=100 rows=3 readonly=true></textarea>
...@@ -25,12 +25,12 @@ ...@@ -25,12 +25,12 @@
<legend>Size</legend> <legend>Size</legend>
<label for="embed-width"> <label for="embed-width">
<span>Width:</span> <span>Width:</span>
<input id="embed-width" type="number" min=50 step=50 value=400> px <input id="embed-width" type="number" min=200 step=50 value=400> px
</label> </label>
<br> <br>
<label for="embed-height"> <label for="embed-height">
<span>Height:</span> <span>Height:</span>
<input id="embed-height" type="number" min=50 step=50 value=250> px <input id="embed-height" type="number" min=200 step=50 value=250> px
</label> </label>
</fieldset> </fieldset>
</p> </p>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment