invites: migrate to bootstrap5
This commit is contained in:
Stefan Strigler
+1
-1
@@ -47,6 +47,6 @@ Mnesia.nonode@nohost/
|
||||
/ejabberd-*.rpm
|
||||
/ejabberd-*.run
|
||||
/ejabberd-*.tar.gz
|
||||
/priv/mod_invites/static/bootstrap4/
|
||||
/priv/mod_invites/static/bootstrap/
|
||||
/priv/mod_invites/static/jquery/
|
||||
/node_modules/
|
||||
|
||||
Generated
+16
-19
@@ -9,15 +9,25 @@
|
||||
"version": "1.0.0",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
"bootstrap": "4.6.2",
|
||||
"bootstrap": "^5.3.8",
|
||||
"jquery": "3.7.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@popperjs/core": {
|
||||
"version": "2.11.8",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
|
||||
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
},
|
||||
"node_modules/bootstrap": {
|
||||
"version": "4.6.2",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.2.tgz",
|
||||
"integrity": "sha512-51Bbp/Uxr9aTuy6ca/8FbFloBUJZLHwnhTcnjIeRn2suQWsWzcuJhGjKDB5eppVte/8oCdOL3VuwxvZDUggwGQ==",
|
||||
"deprecated": "This version of Bootstrap is no longer supported. Please upgrade to the latest version.",
|
||||
"version": "5.3.8",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.8.tgz",
|
||||
"integrity": "sha512-HP1SZDqaLDPwsNiqRqi5NcP0SSXciX2s9E+RyqJIIqGo+vJeN5AJVM98CXmW/Wux0nQ5L7jeWUdplCEf0Ee+tg==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
@@ -30,8 +40,7 @@
|
||||
],
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"jquery": "1.9.1 - 3",
|
||||
"popper.js": "^1.16.1"
|
||||
"@popperjs/core": "^2.11.8"
|
||||
}
|
||||
},
|
||||
"node_modules/jquery": {
|
||||
@@ -39,18 +48,6 @@
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz",
|
||||
"integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/popper.js": {
|
||||
"version": "1.16.1",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
|
||||
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
|
||||
"deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+7
-7
@@ -2,14 +2,14 @@
|
||||
"name": "ejabberd",
|
||||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"jquery": "3.7.1",
|
||||
"bootstrap": "4.6.2"
|
||||
"bootstrap": "^5.3.8",
|
||||
"jquery": "3.7.1"
|
||||
},
|
||||
"scripts": {
|
||||
"postinstall": "npm run -s clean && npm run -s mkdir-jquery && npm run -s cp-jquery && npm run -s cp-bootstrap",
|
||||
"clean": "rm -rf priv/mod_invites/static/{jquery,bootstrap4}",
|
||||
"mkdir-jquery": "mkdir -p priv/mod_invites/static/jquery",
|
||||
"cp-jquery": "cp node_modules/jquery/dist/jquery.min.js priv/mod_invites/static/jquery/jquery.min.js",
|
||||
"cp-bootstrap": "cp -r node_modules/bootstrap/dist priv/mod_invites/static/bootstrap4"
|
||||
"postinstall": "npm run -s clean && npm run -s mkdir-jquery && npm run -s cp-jquery && npm run -s cp-bootstrap",
|
||||
"clean": "rm -rf priv/mod_invites/static/{jquery,bootstrap}",
|
||||
"mkdir-jquery": "mkdir -p priv/mod_invites/static/jquery",
|
||||
"cp-jquery": "cp node_modules/jquery/dist/jquery.min.js priv/mod_invites/static/jquery/jquery.min.js",
|
||||
"cp-bootstrap": "cp -r node_modules/bootstrap/dist priv/mod_invites/static/bootstrap"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<div class="card-body d-flex flex-column h-100">
|
||||
<h3 class="card-title text-nowrap mb-1 h5">{{ item.name }}</h3>
|
||||
<div>
|
||||
{% for platform in item.platforms %}<span class="badge badge-info client-platform-badge client-platform-badge-{{ platform|lower }} mr-1 mb-3">{{ platform }}</span>{% endfor %}
|
||||
{% for platform in item.platforms %}<span class="badge text-bg-info client-platform-badge client-platform-badge-{{ platform|lower }} me-1 mb-3">{{ platform }}</span>{% endfor %}
|
||||
</div>
|
||||
<p class="card-text">{{ item.text }}</p>
|
||||
<a href="{{ item.proceed_url }}" class="btn btn-primary mt-md-auto">{% if item.select_text %}{{ item.select_text }}{% else %}{% trans "Select" %}{% endif %}</a>
|
||||
|
||||
@@ -3,10 +3,10 @@
|
||||
{% block rel_alternate %}<link rel="alternate" href="{{ uri }}">{% endblock %}
|
||||
|
||||
{% block qr_button %}
|
||||
<div id="qr-button-container" class="float-right w-25 border border-info p-3 d-none">
|
||||
<div id="qr-button-container" class="float-end w-25 border border-info p-3 d-none">
|
||||
{% trans "<strong>Tip:</strong> You can open this invite on your mobile device by scanning a barcode with your camera." %}
|
||||
<button id="qr-modal-show" class="mt-2 d-block btn btn-info" title="{% trans "Send this invite to your device" %}"
|
||||
data-toggle="modal" data-target="#qr-modal">
|
||||
data-bs-toggle="modal" data-bs-target="#qr-modal">
|
||||
{% trans "Scan with mobile device" %}
|
||||
</button>
|
||||
</div>
|
||||
@@ -17,10 +17,8 @@
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h2 class="modal-title h5">{% trans "Scan invite code" %}</h2>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<h1 class="modal-title h5">{% trans "Scan invite code" %}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{% trans "You can transfer this invite to your mobile device by scanning a code with your camera." %}</p>
|
||||
@@ -30,7 +28,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-dismiss="modal">{% trans "Close" %}</button>
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">{% trans "Close" %}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -40,5 +38,5 @@
|
||||
{% block extra_scripts %}
|
||||
<script src="{{ static }}/qrcode.min.js" integrity="sha384-XfbBihCQqSDyejklP5yun2CbVxqR+2eNfx0Fhx5pQAfN5ypWGhSBjXaXr5g6X4DE"></script>
|
||||
<script src="{{ static }}/platform.min.js" integrity="sha384-nziKWRrD67nso9WErLVLhgT7AobHh6aYfNgqgINmJrtZ92V9aNTaOpvDFkcneToL"></script>
|
||||
<script src="{{ static }}/invite.js" integrity="sha384-VDcwQaNoQOICI6fBdS75yBQDylgcTGJ2gDuq6uOcp92IwCpkIO8ik3Qllin/FKwX"></script>
|
||||
<script src="{{ static }}/invite.js" integrity="sha384-Gbay/kHKBWDl+ujPP2IvgkW1k0EEtCABOs5sZbovcjLyHZm0lumFMOIdTsWRxBLy"></script>
|
||||
{% endblock %}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}{% blocktrans %}Invite to {{ site_name }}{% endblocktrans %}{% endblock %}</title>
|
||||
{% block rel_alternate %}{% endblock %}
|
||||
<link rel="stylesheet" href="{{ static }}/bootstrap4/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N">
|
||||
<link rel="stylesheet" href="{{ static }}/bootstrap/css/bootstrap.min.css" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB">
|
||||
<!-- <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> -->
|
||||
<!-- <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> -->
|
||||
<!-- <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> -->
|
||||
@@ -39,8 +39,8 @@
|
||||
<body>
|
||||
<div id="background" class="fixed-top overflow-hidden"></div>
|
||||
<div id="form" class="{% block form_class %}container col-md-10 col-md-offset-1 col-sm-8 col-sm-offset-2 col-lg-10 col-lg-offset-1 mt-2 mt-md-5{% endblock %}">
|
||||
<div class="card rounded-lg shadow">
|
||||
<h1 class="card-header rounded-lg rounded-lg">{%block h1 %}{% blocktrans %}Invite to {{ site_name }}{% endblocktrans %}{% endblock %}</h1>
|
||||
<div class="card rounded-2 shadow">
|
||||
<h1 class="card-header">{%block h1 %}{% blocktrans %}Invite to {{ site_name }}{% endblocktrans %}{% endblock %}</h1>
|
||||
<div class="card-body">
|
||||
{% block qr_button %}{% endblock %}
|
||||
{% block content %}{% endblock %}
|
||||
@@ -50,6 +50,6 @@
|
||||
{% block qr_code %}{% endblock %}
|
||||
{% block extra_scripts %}{% endblock %}
|
||||
<script src="{{ static }}/jquery/jquery.min.js" integrity="sha384-1H217gwSVyLSIfaLxHbE7dRb3v4mYCKbpQvzx0cegeju1MVsGrX5xXxAvs/HgeFs"></script>
|
||||
<script src="{{ static }}/bootstrap4/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+"></script>
|
||||
<script src="{{ static }}/bootstrap/js/bootstrap.min.js" integrity="sha384-G/EV+4j2dNv+tEPo3++6LCgdCROaejBqfUeNjuKAiuXbjrxilcCdDz6ZAVfHWe1Y"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
<div class="card-body d-flex flex-column h-100">
|
||||
<h3 class="card-title text-nowrap mb-1 h5">{{ app.name }}</h3>
|
||||
<div>
|
||||
{% for item in app.platforms %}<span class="badge badge-info client-platform-badge client-platform-badge-{{ item|lower }} mr-1 mb-3">{{ item }}</span> {% endfor %}
|
||||
{% for item in app.platforms %}<span class="badge text-bg-info client-platform-badge client-platform-badge-{{ item|lower }} me-1 mb-3">{{ item }}</span> {% endfor %}
|
||||
</div>
|
||||
<p class="card-text">{{ app.text }}</p>
|
||||
</div>
|
||||
@@ -32,7 +32,7 @@
|
||||
|
||||
<p>{% if app.download.text %}{{ app.download.text }}{% else %}{% blocktrans with app_name=app.name %}Download and install {{ app_name }} below:{% endblocktrans %}{% endif %}</p>
|
||||
|
||||
<div class="ml-5">
|
||||
<div class="ms-5">
|
||||
{% for button in app.download.buttons %}
|
||||
{% if button.image %}
|
||||
<a href="{% if button.magic_link %}{{ button.magic_link }}{% else %}{{ button.url }}{% endif %}" {% if button.target %}target="{{ button.target }}"{% endif %} rel="noopener">
|
||||
@@ -54,7 +54,7 @@
|
||||
<p>{% trans "Installed ok? Great! <strong>Click or tap the button below</strong> to accept your invite and continue with your account setup:" %}</p>
|
||||
|
||||
<div>
|
||||
<a href="{{ uri }}" id="uri-cta" class="btn btn-primary ml-5 mt-1 mb-3">{% blocktrans with app_name=app.name %}Accept invite using {{ app_name }}{% endblocktrans %}</a><br/>
|
||||
<a href="{{ uri }}" id="uri-cta" class="btn btn-primary ms-5 mt-1 mb-3">{% blocktrans with app_name=app.name %}Accept invite using {{ app_name }}{% endblocktrans %}</a><br/>
|
||||
</div>
|
||||
|
||||
<p>{% blocktrans with app_name=app.name %}After clicking the button you will be taken to {{ app_name }} to finish setting up your new {{ site_name }} account.{% endblocktrans %}</p>
|
||||
|
||||
@@ -25,8 +25,8 @@
|
||||
<h2 class="card-title h5">{% trans "Create an account" %}</h2>
|
||||
{%if error and error.class == 'undefined' %}<div class="alert alert-danger" role="alert">{{ error.text }}</div>{% endif %}
|
||||
<form method="post" class="needs-validation" novalidate>
|
||||
<div class="form-group form-row">
|
||||
<label for="user" class="col-md-4 col-lg-12 col-form-label">{% trans "Username" %}:</label>
|
||||
<div class="input-group mb-3">
|
||||
<label for="user" class="col-md-4 col-lg-12 form-label">{% trans "Username" %}:</label>
|
||||
<div class="col-md-8 col-lg-12">
|
||||
<div class="input-group">
|
||||
<input
|
||||
@@ -43,8 +43,8 @@
|
||||
<small id="usernameHelp" class="d-block form-text text-muted">{% trans "Choose a username, this will become the first part of your new chat address." %}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group form-row">
|
||||
<label for="password" class="col-md-4 col-lg-12 col-form-label">{% trans "Password" %}:</label>
|
||||
<div class="input-group mb-3">
|
||||
<label for="password" class="col-md-4 col-lg-12 form-label col-form-label">{% trans "Password" %}:</label>
|
||||
<div class="col-md-8 col-lg-12">
|
||||
<input type="password" name="password" class="form-control {% if error.class == 'password' %}is-invalid{% endif %}" aria-describedby="passwordHelp" tabindex="2"
|
||||
autocomplete="new-password" required minlength="{{ password_min_length }}">
|
||||
@@ -55,7 +55,7 @@
|
||||
<small id="passwordHelp" class="form-text text-muted">{% trans "Enter a secure password that you do not use anywhere else." %}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group form-row">
|
||||
<div>
|
||||
<input type="hidden" name="token" value="{{ token }}">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
{% if app %}<input type="hidden" name="app_id" value="{{ app.id }}">{% endif %}
|
||||
@@ -63,7 +63,7 @@
|
||||
</div>
|
||||
</form>
|
||||
<nav aria-label="{% trans 'Page navigation' %}">
|
||||
<ul class="pagination">
|
||||
<ul class="pagination mt-3">
|
||||
<li class="page-item"><a tabindex="4" class="page-link" href="/{{ base }}/{{ token }}" aria-label="{% trans 'Previous' %}">
|
||||
<span aria-hidden="true">«</span>
|
||||
<span>{% trans "Previous" %}</span>
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
|
||||
<p>{% if app.download.text %}{{ app.download.text }}{% else %}{% blocktrans with app_name=app.name %}Download and install {{ app_name }} below:{% endblocktrans %}{% endif %}</p>
|
||||
|
||||
<div class="ml-5 mb-3">
|
||||
<div class="ms-5 mb-3">
|
||||
{% for item in app.download.buttons %}
|
||||
{% if item.image %}
|
||||
<a href="{{ item.url }}" {%if item.target %}target="{{ item.target }}"{% endif %} rel="noopener">
|
||||
@@ -74,20 +74,20 @@
|
||||
<p>{% trans "As a final reminder, your account details are shown below:" %}</p>
|
||||
|
||||
<form class="account-details col-12 col-lg-6 mx-auto">
|
||||
<div class="form-group form-row">
|
||||
<div class="input-group">
|
||||
<label for="user" class="col-md-4 col-lg-12 col-form-label">{% trans "Chat address (JID)" %}:</label>
|
||||
<div class="col-md-8 col-lg-12">
|
||||
<input type="text" class="form-control-plaintext" readonly value="{{ username }}@{{ domain }}">
|
||||
</div>
|
||||
</div>
|
||||
{% if password %}
|
||||
<div class="form-group form-row">
|
||||
<div class="input-group">
|
||||
<label for="password" class="col-md-4 col-lg-12 col-form-label">{% trans "Password" %}:</label>
|
||||
<div class="col-md-8 col-lg-12">
|
||||
<div class="input-group">
|
||||
<input type="password" readonly class="form-control" value="{{ password }}">
|
||||
<input type="password" readonly disabled aria-label="{% trans "Password" %}" class="form-control" value="{{ password }}">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-outline-secondary" type="button" onclick="toggle_password(event)">{% trans "Show" %}</button>
|
||||
<button class="btn btn-outline-secondary rounded-start-0" type="button" onclick="toggle_password(event)">{% trans "Show" %}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -96,6 +96,6 @@
|
||||
</form>
|
||||
|
||||
{% if password %}
|
||||
<p>{% trans "Your password is stored encrypted on the server and will not be accessible after you close this page. Keep it safe and never share it with anyone." %}</p>
|
||||
<p class="mt-3">{% trans "Your password is stored encrypted on the server and will not be accessible after you close this page. Keep it safe and never share it with anyone." %}</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
@@ -69,11 +69,11 @@
|
||||
const badges = card.querySelectorAll('.client-platform-badge');
|
||||
for (let badge of badges) {
|
||||
if (badge.classList.contains('client-platform-badge-'+platform_classname)) {
|
||||
badge.classList.add("badge-success");
|
||||
badge.classList.remove("badge-info");
|
||||
badge.classList.add("text-bg-success");
|
||||
badge.classList.remove("text-bg-info");
|
||||
} else {
|
||||
badge.classList.add("badge-secondary");
|
||||
badge.classList.remove("badge-info");
|
||||
badge.classList.add("text-bg-secondary");
|
||||
badge.classList.remove("text-bg-info");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
set -e
|
||||
|
||||
jquery_checksum='fc9a93dd241f6b045cbff0481cf4e1901becd0e12fb45166a8f17f95823f0b1a';
|
||||
bootstrap4_checksum='dc9b29fe7100e69d1a512860497bd2237eadccde6e813e588416429359832dce';
|
||||
bootstrap_checksum='3258c873cbcb1e2d81f4374afea2ea6437d9eee9077041073fd81dd579c5ba6b';
|
||||
|
||||
check() {
|
||||
echo "$1 $2" | sha256sum -c - || (echo "checksum failed: $2 (does not match $1)"; exit 1)
|
||||
@@ -21,12 +21,12 @@ curl -s -o $jquery https://code.jquery.com/jquery-3.7.1.min.js
|
||||
check $jquery_checksum $jquery
|
||||
mv $jquery "$install_dir/jquery/jquery.min.js"
|
||||
|
||||
bootstrap4="$(mktemp /tmp/bootstrap4.XXXXXXXXX)"
|
||||
curl -L -s -o $bootstrap4 https://github.com/twbs/bootstrap/releases/download/v4.6.2/bootstrap-4.6.2-dist.zip
|
||||
check $bootstrap4_checksum $bootstrap4
|
||||
bootstrap="$(mktemp /tmp/bootstrap.XXXXXXXXX)"
|
||||
curl -L -s -o $bootstrap https://github.com/twbs/bootstrap/releases/download/v5.3.8/bootstrap-5.3.8-dist.zip
|
||||
check $bootstrap_checksum $bootstrap
|
||||
|
||||
rm -rf "$install_dir/bootstrap4"
|
||||
unzip -q -d "$install_dir" $bootstrap4
|
||||
mv "$install_dir/bootstrap-4.6.2-dist" "$install_dir/bootstrap4"
|
||||
rm $bootstrap4
|
||||
rm -rf "$install_dir/bootstrap"
|
||||
unzip -q -d "$install_dir" $bootstrap
|
||||
mv "$install_dir/bootstrap-5.3.8-dist" "$install_dir/bootstrap"
|
||||
rm $bootstrap
|
||||
echo "landing page dependencies for mod_invites installed to $install_dir"
|
||||
|
||||
Reference in New Issue
Block a user