commit
a37b519ddf
2
main.py
2
main.py
@ -22,6 +22,8 @@ class Meshenger:
|
|||||||
os.chdir(os.path.dirname(__file__)) # change present working directory to the one where this file is
|
os.chdir(os.path.dirname(__file__)) # change present working directory to the one where this file is
|
||||||
|
|
||||||
self.own_ip = self.get_ip_adress().strip()
|
self.own_ip = self.get_ip_adress().strip()
|
||||||
|
# this hash is needed in clientserve, so client can generate color
|
||||||
|
self.own_hash = self.hasj(self.own_ip)
|
||||||
|
|
||||||
if not os.path.exists(self.msg_dir):
|
if not os.path.exists(self.msg_dir):
|
||||||
os.mkdir(self.msg_dir)
|
os.mkdir(self.msg_dir)
|
||||||
|
@ -24,6 +24,14 @@ Serve index and messages
|
|||||||
|
|
||||||
if self.path == '/index' or self.path.startswith( "/"+self.messageDir ):
|
if self.path == '/index' or self.path.startswith( "/"+self.messageDir ):
|
||||||
return SimpleHTTPServer.SimpleHTTPRequestHandler.do_GET(self)
|
return SimpleHTTPServer.SimpleHTTPRequestHandler.do_GET(self)
|
||||||
|
elif self.path == '/id':
|
||||||
|
if meshenger and meshenger.own_hash:
|
||||||
|
self.send_response(200)
|
||||||
|
self.send_header('Content-type', 'text-html')
|
||||||
|
self.end_headers()
|
||||||
|
self.wfile.write(meshenger.own_hash)
|
||||||
|
else:
|
||||||
|
self.send_error(404,'Id not yet available')
|
||||||
elif self.path == '/log':
|
elif self.path == '/log':
|
||||||
self.send_response(200)
|
self.send_response(200)
|
||||||
self.send_header('Content-type', 'text-html')
|
self.send_header('Content-type', 'text-html')
|
||||||
@ -31,7 +39,15 @@ Serve index and messages
|
|||||||
f = os.path.relpath('log/meshenger.log')
|
f = os.path.relpath('log/meshenger.log')
|
||||||
with open( f, 'r') as the_file:
|
with open( f, 'r') as the_file:
|
||||||
self.wfile.write(the_file.read())
|
self.wfile.write(the_file.read())
|
||||||
else:
|
elif self.path.startswith('/web'):
|
||||||
|
|
||||||
|
f = os.path.relpath(self.path[1:])
|
||||||
|
if not os.path.exists( f ) or os.path.isdir( f ):
|
||||||
|
f = os.path.join('web', 'index.html')
|
||||||
|
|
||||||
|
self.path = '/'+f
|
||||||
|
return SimpleHTTPServer.SimpleHTTPRequestHandler.do_GET(self)
|
||||||
|
elif self.path == '/old':
|
||||||
self.send_response(200) #serve the webapp on every url requested
|
self.send_response(200) #serve the webapp on every url requested
|
||||||
self.send_header('Content-type', 'text/html')
|
self.send_header('Content-type', 'text/html')
|
||||||
self.end_headers()
|
self.end_headers()
|
||||||
@ -39,6 +55,10 @@ Serve index and messages
|
|||||||
with open( f, 'r') as the_file:
|
with open( f, 'r') as the_file:
|
||||||
self.wfile.write(the_file.read())
|
self.wfile.write(the_file.read())
|
||||||
|
|
||||||
|
else:
|
||||||
|
self.path = '/' + os.path.join('web', 'index.html')
|
||||||
|
return SimpleHTTPServer.SimpleHTTPRequestHandler.do_GET(self)
|
||||||
|
|
||||||
|
|
||||||
def do_POST(self):
|
def do_POST(self):
|
||||||
"""
|
"""
|
||||||
|
BIN
web/.index.html.swo
Normal file
BIN
web/.index.html.swo
Normal file
Binary file not shown.
49
web/index.html
Normal file
49
web/index.html
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="cache-control" content="max-age=0" />
|
||||||
|
<meta http-equiv="cache-control" content="no-cache" />
|
||||||
|
<meta http-equiv="expires" content="0" />
|
||||||
|
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
|
||||||
|
<meta http-equiv="pragma" content="no-cache" />
|
||||||
|
<meta name="viewport" content="width=device-width, user-scalable=no">
|
||||||
|
<!-- <script src="/web/lib/jquery-2.1.1.min.js"></script> -->
|
||||||
|
<link href="/web/style.css" rel="stylesheet" type="text/css">
|
||||||
|
<title>meshed up</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="header">
|
||||||
|
<h2>Meshenger</h2>
|
||||||
|
</div>
|
||||||
|
<!--
|
||||||
|
<form id="message-form" action="">
|
||||||
|
<table width="100%" style="padding :10px;">
|
||||||
|
<tr>
|
||||||
|
<td width="100px">
|
||||||
|
<input style="width:100%" id="new-sender" type="text" placeholder="Your name">
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<input style="width:100%" id="new-message" type="text" placeholder="Your message">
|
||||||
|
</td>
|
||||||
|
<td width="50px">
|
||||||
|
<input class="send-button" style="width:50px" type="button" value="Send">
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</form>
|
||||||
|
-->
|
||||||
|
|
||||||
|
<form id="message-form" action="">
|
||||||
|
<textarea id="name" rows="1" placeholder="Your Name"></textarea>
|
||||||
|
<textarea id="message" rows="2" placeholder="Your Message"></textarea>
|
||||||
|
<input type="submit" class="send-button" value="Send">
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<div class="messages">
|
||||||
|
<ul id="inbox"></ul>
|
||||||
|
|
||||||
|
<ul id="outbox"></ul>
|
||||||
|
</div>
|
||||||
|
<script src="/web/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
4
web/lib/jquery-2.1.1.min.js
vendored
Normal file
4
web/lib/jquery-2.1.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
281
web/main.js
Normal file
281
web/main.js
Normal file
@ -0,0 +1,281 @@
|
|||||||
|
localStorage.clear();
|
||||||
|
|
||||||
|
|
||||||
|
//These need to be obtained from the node
|
||||||
|
var ownId, ownColor;
|
||||||
|
|
||||||
|
/*
|
||||||
|
* OUTBOX STUFF
|
||||||
|
*/
|
||||||
|
document.getElementById('message-form').onsubmit = function(){
|
||||||
|
var outStr = localStorage.getItem( 'outbox' ) || '';
|
||||||
|
|
||||||
|
if (document.getElementById('name').value == ""){
|
||||||
|
var namm = "anonymous";
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
var namm = document.getElementById('name').value;
|
||||||
|
}
|
||||||
|
var mess = document.getElementById('message').value.replace(/\r?\n/g, "<br />");
|
||||||
|
var newMsgs = {};
|
||||||
|
var ddata = new Date().getTime();
|
||||||
|
var contento = {
|
||||||
|
"time" : ddata,
|
||||||
|
"message" : mess,
|
||||||
|
"name" : namm,
|
||||||
|
"node" : "local",
|
||||||
|
"hops" : "0"
|
||||||
|
}
|
||||||
|
newMsgs.message = contento;
|
||||||
|
|
||||||
|
localStorage.setItem( 'outbox', JSON.stringify(newMsgs) );
|
||||||
|
updateOutboxView();
|
||||||
|
checkOutbox();
|
||||||
|
document.getElementById('message').value = '';
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function checkOutbox() {
|
||||||
|
var outStr = localStorage.getItem( 'outbox' );
|
||||||
|
if ( ! outStr ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var lines = outStr.split( /\n/ );
|
||||||
|
for ( var i in lines ) {
|
||||||
|
if ( lines[i].length === 0 ) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
var obj = JSON.parse(lines[i]);
|
||||||
|
var ts = obj.message.time;
|
||||||
|
delete obj.message.time;
|
||||||
|
var msg = JSON.stringify(obj.message);
|
||||||
|
sendMessage( ts, msg );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function sendMessage( timestamp, message ) {
|
||||||
|
var xhr = new XMLHttpRequest();
|
||||||
|
var data = 'time=' + encodeURIComponent( timestamp ) +
|
||||||
|
'&message=' + encodeURIComponent( message );
|
||||||
|
|
||||||
|
xhr.onreadystatechange = function(){
|
||||||
|
if ( xhr.readyState == 4){
|
||||||
|
if ( xhr.status == 200 ) {
|
||||||
|
removeOutboxItem( timestamp );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
xhr.open('POST', 'send', true);
|
||||||
|
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
|
||||||
|
xhr.setRequestHeader('If-Modified-Since', 'Sat, 1 Jan 2005 00:00:00 GMT');
|
||||||
|
xhr.send(data);
|
||||||
|
}
|
||||||
|
function removeOutboxItem( timestamp ) {
|
||||||
|
var outStr = localStorage.getItem( 'outbox' ) || '';
|
||||||
|
var lines = outStr.split( /\n/ );
|
||||||
|
for ( var i in lines ) {
|
||||||
|
var obj = JSON.parse(lines[i]);
|
||||||
|
var ts = obj.message.time;
|
||||||
|
if ( ts === timestamp ) {
|
||||||
|
lines.splice( i, 1 );
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var newOutStr = lines.join('\n');
|
||||||
|
localStorage.setItem('outbox', newOutStr);
|
||||||
|
updateOutboxView();
|
||||||
|
}
|
||||||
|
function updateOutboxView() {
|
||||||
|
var contentString = '';
|
||||||
|
var outStr = localStorage.getItem( 'outbox' ) || '';
|
||||||
|
var lines = outStr.split( /\n/ );
|
||||||
|
for ( var i in lines ) {
|
||||||
|
if ( lines[ i ].length === 0 ) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
var obj = JSON.parse(lines[i]);
|
||||||
|
var ts = obj.message.time;
|
||||||
|
delete obj.message.time;
|
||||||
|
var msg = JSON.stringify(obj.message);
|
||||||
|
|
||||||
|
contentString += '<li><b>' + ts + ' </b>' + msg + '</li>';
|
||||||
|
}
|
||||||
|
document.getElementById( 'outbox' ).innerHTML = contentString;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* INBOX STUFF
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
function updateInboxView() {
|
||||||
|
var localStorageArray = new Array();
|
||||||
|
var contentString = '';
|
||||||
|
|
||||||
|
if (localStorage.length>0) {
|
||||||
|
for (i=0;i<localStorage.length;i++){
|
||||||
|
|
||||||
|
element=localStorage.getItem(localStorage.key(i));
|
||||||
|
|
||||||
|
if ( localStorage.key(i).length < 10 || element === 'outbox' ) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
elementj = JSON.parse(element);
|
||||||
|
} catch (e) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
localStorageArray[i] = {
|
||||||
|
time:localStorage.key(i),
|
||||||
|
user:elementj.name,
|
||||||
|
message:elementj.message,
|
||||||
|
node:elementj.node,
|
||||||
|
hops:elementj.hops
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
orderStorage = localStorageArray.sort(function(a,b) { return b.time - a.time } );
|
||||||
|
|
||||||
|
for(var i in orderStorage) {
|
||||||
|
if ( i.length === 0 || i === 'outbox' ) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
var datereadable = getReadableDate( new Date(parseInt(orderStorage[i].time)) );
|
||||||
|
var color = getNodeColor( orderStorage[i].node );
|
||||||
|
contentString += '<li><div class="message-block" style="background-color:'+color+'">'+
|
||||||
|
'<div class="date-sender">On ' + datereadable +
|
||||||
|
' <b>' + orderStorage[i].user +'</b> wrote:</div>' +
|
||||||
|
'<div class="message-text">' + orderStorage[i].message + '</div>' +
|
||||||
|
' <span class="node '+orderStorage[i].node+'">from '+orderStorage[i].node + '</span>' +
|
||||||
|
' <span class="hops '+orderStorage[i].hops+'">via '+orderStorage[i].hops+' nodes</span></div></li>';
|
||||||
|
}
|
||||||
|
document.getElementById( 'inbox' ).innerHTML = contentString;
|
||||||
|
}
|
||||||
|
function getReadableDate( date ) {
|
||||||
|
var day = date.getDate();
|
||||||
|
if (day < 10) day = '0' + day;
|
||||||
|
var month = date.getMonth()+1;
|
||||||
|
if (month < 10) month = '0' + month;
|
||||||
|
var year = date.getFullYear();
|
||||||
|
var hrs = date.getHours();
|
||||||
|
if (hrs < 10) hrs = '0' + hrs;
|
||||||
|
var min = date.getMinutes();
|
||||||
|
if (min < 10) min = '0' + min;
|
||||||
|
|
||||||
|
return day + '/' + month + '/' + year + ' ' + hrs + ':' + min;
|
||||||
|
}
|
||||||
|
function getNodeColor( nodeId ) {
|
||||||
|
if( nodeId === 'local' ) {
|
||||||
|
return ownColor || '#fff';
|
||||||
|
}
|
||||||
|
return colorLuminance(nodeId.substr(0,6), 0.5);
|
||||||
|
}
|
||||||
|
function colorLuminance(hex, lum) {
|
||||||
|
|
||||||
|
// validate hex string
|
||||||
|
hex = String(hex).replace(/[^0-9a-f]/gi, '');
|
||||||
|
if (hex.length < 6) {
|
||||||
|
hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
|
||||||
|
}
|
||||||
|
lum = lum || 0;
|
||||||
|
|
||||||
|
// convert to decimal and change luminosity
|
||||||
|
var rgb = "#", c, i;
|
||||||
|
for (i = 0; i < 3; i++) {
|
||||||
|
c = parseInt(hex.substr(i*2,2), 16);
|
||||||
|
c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
|
||||||
|
rgb += ("00"+c).substr(c.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
return rgb;
|
||||||
|
}
|
||||||
|
|
||||||
|
function onMessageDownload( msg, filename ) {
|
||||||
|
if ( localStorage.getItem( filename ) === null ) {
|
||||||
|
localStorage.setItem( filename, msg );
|
||||||
|
}
|
||||||
|
updateInboxView();
|
||||||
|
}
|
||||||
|
function onIndex( index ) {
|
||||||
|
var lines = index.split( /\n/ );
|
||||||
|
|
||||||
|
for(var k in localStorage){
|
||||||
|
var l = 1;
|
||||||
|
for ( var i in lines ) {
|
||||||
|
var f = lines[i];
|
||||||
|
if (f == k){ l = 0; }
|
||||||
|
}
|
||||||
|
if (l == 1){
|
||||||
|
localStorage.removeItem(k);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
updateInboxView();
|
||||||
|
|
||||||
|
for ( var i in lines ) {
|
||||||
|
var fname = lines[i];
|
||||||
|
if ( localStorage.getItem( fname ) === null ) {
|
||||||
|
//localStorage.setItem( ts, lines[i].substr(lines[i].indexOf(' ')) );
|
||||||
|
downloadMessage( fname );
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
function downloadMessage(filename) {
|
||||||
|
var xhr = new XMLHttpRequest();
|
||||||
|
xhr.onreadystatechange = function(){
|
||||||
|
if (xhr.readyState == 4 && xhr.status == 200){
|
||||||
|
onMessageDownload( xhr.responseText, filename );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
xhr.open( "GET", 'msg/'+filename, true);
|
||||||
|
xhr.send();
|
||||||
|
|
||||||
|
}
|
||||||
|
function checkInbox() {
|
||||||
|
var xhr = new XMLHttpRequest();
|
||||||
|
xhr.onreadystatechange = function(){
|
||||||
|
if (xhr.readyState == 4 && xhr.status == 200){
|
||||||
|
onIndex( xhr.responseText );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
xhr.open( "GET", 'index', true);
|
||||||
|
xhr.send();
|
||||||
|
}
|
||||||
|
function getOwnId() {
|
||||||
|
var xhr = new XMLHttpRequest();
|
||||||
|
xhr.onreadystatechange = function(){
|
||||||
|
if (xhr.readyState == 4 && xhr.status == 200){
|
||||||
|
ownId = xhr.responseText;
|
||||||
|
ownColor = getNodeColor( ownId );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
xhr.open( "GET", 'id', true);
|
||||||
|
xhr.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
* INIT
|
||||||
|
*/
|
||||||
|
|
||||||
|
function update(){
|
||||||
|
if ( !ownId ){
|
||||||
|
getOwnId();
|
||||||
|
}
|
||||||
|
checkInbox();
|
||||||
|
// also check for outbox items on interval,
|
||||||
|
// necessary in case connection is lost and messages are not yet sent
|
||||||
|
checkOutbox();
|
||||||
|
}
|
||||||
|
|
||||||
|
//update everything to initialize
|
||||||
|
updateInboxView();
|
||||||
|
updateOutboxView();
|
||||||
|
update();
|
||||||
|
|
||||||
|
//check for new messages every 7 seconds
|
||||||
|
window.setInterval( update, 7000 );
|
||||||
|
|
135
web/style.css
Normal file
135
web/style.css
Normal file
@ -0,0 +1,135 @@
|
|||||||
|
body, html{
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
font-size:20px;
|
||||||
|
text-shadow: 1px 1px #ddd;
|
||||||
|
font-family: times, 'times new roman', helvetica,serif;
|
||||||
|
line-height:1.5em;
|
||||||
|
color:#444;
|
||||||
|
background:#fff;
|
||||||
|
padding:20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#message-form textarea{
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
|
||||||
|
display: block;
|
||||||
|
outline:none;
|
||||||
|
width: 98%;
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 40px;
|
||||||
|
border:none;
|
||||||
|
-webkit-border-radius: 13px;
|
||||||
|
-moz-border-radius: 13px;
|
||||||
|
border-radius: 13px;
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: 20px;
|
||||||
|
|
||||||
|
-moz-box-shadow:0 0 23px #bbb;
|
||||||
|
-webkit-box-shadow:0 0 23px #bbb;
|
||||||
|
box-shadow:0 0 23px #bbb;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#message-form .send-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
outline: none;
|
||||||
|
//border: 1px solid #bbb;
|
||||||
|
border:0;
|
||||||
|
-webkit-border-radius: 13px;
|
||||||
|
-moz-border-radius: 13px;
|
||||||
|
border-radius: 13px;
|
||||||
|
height:40px;
|
||||||
|
width:100%;
|
||||||
|
display: block;
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight:bold;
|
||||||
|
text-shadow: 0 0 23px #888;
|
||||||
|
background-color:#fff;
|
||||||
|
|
||||||
|
-moz-box-shadow:0 0 23px #bbb;
|
||||||
|
-webkit-box-shadow:0 0 23px #bbb;
|
||||||
|
box-shadow:0 0 23px #bbb;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
select{
|
||||||
|
width:100%;
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
margin: 1.5em 0;
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
font-size: 20px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
h2{
|
||||||
|
margin: 0 0 20px;
|
||||||
|
font-size: 40px;
|
||||||
|
text-shadow: 0px 0px 23px #bbb;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr{
|
||||||
|
height:10px;
|
||||||
|
border: 10;
|
||||||
|
width:87%;
|
||||||
|
background-image: url(css/bg1.gif);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.messages ul{
|
||||||
|
width:100%;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
.messages li{
|
||||||
|
list-style: none;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.messages .message-block {
|
||||||
|
padding:30px;
|
||||||
|
word-wrap:break-word;
|
||||||
|
overflow: visible;
|
||||||
|
-moz-box-shadow:0 0 23px #bbb;
|
||||||
|
-webkit-box-shadow:0 0 23px #bbb;
|
||||||
|
box-shadow:0 0 23px #bbb;
|
||||||
|
-webkit-border-top-left-radius:123px;
|
||||||
|
-webkit-border-top-right-radius:123px;
|
||||||
|
-webkit-border-bottom-right-radius:123px;
|
||||||
|
-webkit-border-bottom-left-radius:123px;
|
||||||
|
-moz-border-radius-bottomright:123px;
|
||||||
|
-moz-border-radius-bottomleft:123px;
|
||||||
|
-moz-border-top-left-radius:123px;
|
||||||
|
-moz-border-top-right-radius:123px;
|
||||||
|
border-top-left-radius:123px;
|
||||||
|
border-top-right-radius:123px;
|
||||||
|
border-bottom-right-radius:123px;
|
||||||
|
border-bottom-left-radius:123px;
|
||||||
|
background:#fff;
|
||||||
|
}
|
||||||
|
.node, .hops {
|
||||||
|
font-size:10px;
|
||||||
|
}
|
||||||
|
.message-text {
|
||||||
|
font-size: 25px;
|
||||||
|
}
|
||||||
|
.date-sender {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
#outbox{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
#header{
|
||||||
|
width:100%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user