<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<p>Hi Troy,<br>
</p>
<p>Many web apps optimize for different screen sizes and have
several configurations in the CSS. Something you would consider
"responsive web design".<br>
</p>
<p>Based on filters like this in the CSS (example from Ezra Bible
App):<br>
<br>
Phone<br>
</p>
<div style="color: #d4d4d4;background-color: #1e1e1e;font-family: 'Droid Sans Mono', 'monospace', monospace, 'Droid Sans Fallback';font-weight: normal;font-size: 14px;line-height: 19px;white-space: pre;"><div><span style="color: #c586c0;">@media</span><span style="color: #d4d4d4;"> </span><span style="color: #ce9178;">screen</span><span style="color: #d4d4d4;"> and (</span><span style="color: #9cdcfe;">max-width</span><span style="color: #d4d4d4;">: </span><span style="color: #b5cea8;">450px</span><span style="color: #d4d4d4;">), (</span><span style="color: #9cdcfe;">max-height</span><span style="color: #d4d4d4;">: </span><span style="color: #b5cea8;">450px</span><span style="color: #d4d4d4;">) {</span></div></div>
<p><br>
Tablet / Large phone<br>
</p>
<div style="color: #d4d4d4;background-color: #1e1e1e;font-family: 'Droid Sans Mono', 'monospace', monospace, 'Droid Sans Fallback';font-weight: normal;font-size: 14px;line-height: 19px;white-space: pre;"><div><span style="color: #c586c0;">@media</span><span style="color: #d4d4d4;"> </span><span style="color: #ce9178;">screen</span><span style="color: #d4d4d4;"> and (</span><span style="color: #9cdcfe;">max-width</span><span style="color: #d4d4d4;">: </span><span style="color: #b5cea8;">600px</span><span style="color: #d4d4d4;">) {</span>
</div></div>
<p><br>
And then aside from this the standard CSS remains the one for
desktop / large screen.<br>
</p>
<p>Best regards,<br>
Tobias<br>
<br>
</p>
<div class="moz-cite-prefix">On 9/24/22 9:43 AM, Troy A. Griffitts
wrote:<br>
</div>
<blockquote type="cite"
cite="mid:775370E2-E2B0-44AC-A605-216BBD3D8C6A@crosswire.org">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
Hi Don,<br>
<br>
This morning I sent Psalm 139 to remind a friend that God who
created a 1000 galaxies formed her and wrote each of her days...
and then I realized that she will likely click on the link from
her phone and then I thought of you. 🙂 Any more thoughts on a
more mobile-friendly UI?<br>
<br>
A few years ago, to the main <a href="https://crosswire.org"
moz-do-not-send="true">https://crosswire.org</a> website, I
added per recommendation:<br>
<br>
<meta name="viewport" content="width=device-width,
initial-scale=1"><br>
<br>
and it really helped quite a bit. Maybe I'll try that with
SWORDWeb this afternoon and see if it makes things better or
worse.<br>
<br>
I use SWORDWeb from my phone regularly, and what I like is that if
I double-tap the center Bible text column, chrome zooms in exactly
on that column so it's pretty usable with that trick.<br>
<br>
Anyway, by the time you read this, I may have done some
experimenting with the header tag, above. Let me know if you have
ideas for an interface which adapts better to screen size.<br>
<br>
Thanks again for all your work,<br>
<br>
Troy<br>
<br>
<div class="gmail_quote">On August 17, 2021 3:40:56 AM GMT+02:00,
Don Elbourne <a class="moz-txt-link-rfc2396E" href="mailto:don2@elbourne.org"><don2@elbourne.org></a> wrote:
<blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
0.8ex; border-left: 1px solid rgb(204, 204, 204);
padding-left: 1ex;">
<p>Troy,</p>
<p>ok Great. Thanks.</p>
<p>I have not messed with Docker yet. I guess I need to get
with the times. lol This will give me a good excuse. No
promises, but I will check it out. <br>
</p>
<pre class="moz-signature" cols="72">--
by grace alone,
Pastor Don A. Elbourne Jr.
Lakeshore Baptist Church
<a class="moz-txt-link-freetext" href="http://lakeshorebaptist.net" moz-do-not-send="true">http://lakeshorebaptist.net</a>
<a class="moz-txt-link-freetext" href="http://rebuildlakeshore.com" moz-do-not-send="true">http://rebuildlakeshore.com</a></pre>
<div class="moz-cite-prefix">On 8/14/2021 5:31 AM, Troy A.
Griffitts wrote:<br>
</div>
<blockquote type="cite"
cite="mid:2771A7EA-CC0D-4856-8234-688C61552FB8@crosswire.org">
<meta http-equiv="content-type" content="text/html;
charset=UTF-8">
Hi Don! I don't know if anyone is running the site other
than CrossWire. We've helped a few people setup the software
over the years but not sure if they continue to run it.<br>
<br>
We've made an OCI container of the software to make it
scalable and to more easily spin up an image:<br>
<br>
<a href="https://hub.docker.com/r/crosswire/swordweb"
moz-do-not-send="true" class="moz-txt-link-freetext">https://hub.docker.com/r/crosswire/swordweb</a><br>
<br>
Not sure who might be pulling that as a base or a spinning
up an instance.<br>
<br>
It's great to hear from you! I've often reused your html and
style in other html UI apps which present SWORD
functionality. If you install Bishop, it should look a bit
familiar. 😀<br>
<br>
Apple: <a
href="https://apps.apple.com/us/app/the-sword-project/id1399921911"
moz-do-not-send="true" class="moz-txt-link-freetext">https://apps.apple.com/us/app/the-sword-project/id1399921911</a><br>
<br>
Android: <a
href="https://play.google.com/store/apps/details?id=org.crosswire.bishop"
moz-do-not-send="true" class="moz-txt-link-freetext">https://play.google.com/store/apps/details?id=org.crosswire.bishop</a><br>
<br>
We'd love to have you contribute to an improved user
experience in our new world of diverse screen sizes, if you
can find the time between pastoring.<br>
<br>
Hope you've been well!<br>
<br>
Troy<br>
<br>
<div class="gmail_quote">On August 14, 2021 5:36:47 AM
GMT+02:00, Don Elbourne <a class="moz-txt-link-rfc2396E"
href="mailto:don2@elbourne.org" moz-do-not-send="true"><don2@elbourne.org></a>
wrote:
<blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
0.8ex; border-left: 1px solid rgb(204, 204, 204);
padding-left: 1ex;">
<pre dir="auto" class="k9mail">Is anyone running SWORDWeb in the wild, other than
<a href="https://www.crosswire.org/study/" moz-do-not-send="true" class="moz-txt-link-freetext">https://www.crosswire.org/study/</a>
Just wondering. Its been a long time since we designed that. I have been
thinking about jumping back into the project and helping update it to be
mobile friendly, if there is any interest.
<div class="k9mail-signature">--
by grace alone,
Pastor Don A. Elbourne Jr.
Lakeshore Baptist Church
<a href="http://lakeshorebaptist.net" moz-do-not-send="true" class="moz-txt-link-freetext">http://lakeshorebaptist.net</a>
<a href="http://rebuildlakeshore.com" moz-do-not-send="true" class="moz-txt-link-freetext">http://rebuildlakeshore.com</a><hr>sword-devel mailing list: <a class="moz-txt-link-abbreviated" href="mailto:sword-devel@crosswire.org" moz-do-not-send="true">sword-devel@crosswire.org</a>
<a href="http://crosswire.org/mailman/listinfo/sword-devel" moz-do-not-send="true" class="moz-txt-link-freetext">http://crosswire.org/mailman/listinfo/sword-devel</a>
Instructions to unsubscribe/change your settings at above page
</div></pre>
</blockquote>
</div>
<div style="white-space: pre-wrap"><div class="k9mail-signature">--
Sent from my Android device with K-9 Mail. Please excuse my brevity.</div></div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<pre class="moz-quote-pre" wrap="">_______________________________________________
sword-devel mailing list: <a class="moz-txt-link-abbreviated" href="mailto:sword-devel@crosswire.org" moz-do-not-send="true">sword-devel@crosswire.org</a>
<a class="moz-txt-link-freetext" href="http://crosswire.org/mailman/listinfo/sword-devel" moz-do-not-send="true">http://crosswire.org/mailman/listinfo/sword-devel</a>
Instructions to unsubscribe/change your settings at above page</pre>
</blockquote>
</blockquote>
</div>
<div style="white-space: pre-wrap"><div class="k9mail-signature">--
Sent from my Android device with K-9 Mail. Please excuse my brevity.</div></div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<pre class="moz-quote-pre" wrap="">_______________________________________________
sword-devel mailing list: <a class="moz-txt-link-abbreviated" href="mailto:sword-devel@crosswire.org">sword-devel@crosswire.org</a>
<a class="moz-txt-link-freetext" href="http://crosswire.org/mailman/listinfo/sword-devel">http://crosswire.org/mailman/listinfo/sword-devel</a>
Instructions to unsubscribe/change your settings at above page
</pre>
</blockquote>
</body>
</html>