Skip to content

P
PHP-Chat
Commit 3a80964b authored by Nico Schallehn's avatar Nico Schallehn
Browse files
Options

Vorbereitungen für neuen Chat welcher Responsive ist. 

Hallo,
ich würde mich freuen, wenn mal noch jemand den Chat Modifiziert. Ich
finde ihn zu globig.
parent 8bfe1dab
Hide whitespace changes
Inline Side-by-side
Showing with 207 additions and 1 deletion
index.php
View file @ 3a80964b
......@@ -105,6 +105,7 @@ if(isset($_POST['ok']))
<ul class="nav navbar-nav navbar-right">
<li id="LoginBtn"><a href="#" id="showLogin"><span class="glyphicon glyphicon-log-in"></span> Anmelden</a></li>
<li id="RegisBtn"><a href="#" id="showRegis"><span class="glyphicon glyphicon-plus-sign"></span> Registieren</a></li>
</ul>
</div>
......
newChat.php 0 → 100644
View file @ 3a80964b
<!DOCTYPE html>
<html>
<head lang="de">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PHP-Chat</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!--custrom css-->
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mainnavbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">PHP-Chat</a> <!-- <?php echo $_SERVER[ 'SCRIPT_NAME']; ?> -->
</div>
<div class="collapse navbar-collapse" id="mainnavbar">
<ul class="nav navbar-nav">
<!-- <li <?php echo (!isset($_GET['action'])?'class="active"':''); ?>><a href="<?php echo $_SERVER['SCRIPT_NAME']; ?>"><span class="glyphicon glyphicon-home" /></a></li>
<li <?php echo ($_GET['action']=="impressum"?'class="active"':'');?>><a href="<?php echo $_SERVER['SCRIPT_NAME']; ?>?action=impressum">Impressum</a></li>
-->
<li><a href="#">Admin-Menü</a></li>
<!-- <li><a href="#"></a></li>
<li><a href="#">Link4</a></li> -->
</ul>
<div class="navbar-form navbar-left" role="search">
<div class="checkbox navbar-btn">
<input type="checkbox" class="form-control" id="autoscrolling" checked>
<label class="navbar-link" for="autoscrolling"> Auto-Scrollen</label>
</div>
</div>
<ul class="nav navbar-nav navbar-right">
<li id="LoginBtn"><a href="#" id="doLogoff"><span class="glyphicon glyphicon-log-out"></span> Abmelden</a></li>
<!-- <li id="RegisBtn"><a href="#" id="showRegis"><span class="glyphicon glyphicon-plus-sign"></span> Registieren</a></li> -->
</ul>
</div>
</div>
</nav>
<div class="row">
<div class="col-xs-0 col-sm-3 col-md-3 col-lg-2 hidden-xs" style="position:fixed;height:100%;overflow-y:auto;" id="UsersOnlineBox">
<div class="panel panel-default" id="UsersOnlinePanel">
<div class="panel-heading">Online-User</div>
<!-- <div class="panel-body" id="UsersOnline">
</div> -->
<table class="table">
<tr><th align="left">Name</th><th>Rang</th></tr>
<tr><td><font class="online"><b>James</b></font></td><td align="center" valign="middle">(4)</td></tr>
<tr><td><font class="online"><b>Nico</b></font></td><td align="center" valign="middle">(3)</td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td><font class="offline"><b>IchBinNico</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Marcel</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Markus</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>MarkusB</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Nathalie</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Phalt&ocirc;n</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Sarah</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>schtan</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Test</b></font></td><td align="center" valign="middle">(0)</td></tr>
<tr><td><font class="offline"><b>Tester</b></font></td><td align="center" valign="middle">(0)</td></tr>
</table>
</div>
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-10 col-xs-offset-0 col-sm-offset-3 col-md-offset-3 col-lg-offset-2">
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title pull-left"> James:</div>
<div class="panel-title pull-right hidden-xs">17.07.16 um 13:52:22</div>
<div class="clearfix"></div>
</div>
<div class="panel-body">
Hallo und Herzlich Willkommen!
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title pull-left"> Nico:</div>
<div class="panel-title pull-right hidden-xs">17.07.16 um 13:57:22</div>
<div class="clearfix"></div>
</div>
<div class="panel-body">
das ist ein Test
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title pull-left"> Nico:</div>
<div class="panel-title pull-right hidden-xs">17.07.16 um 13:57:22</div>
<div class="clearfix"></div>
</div>
<div class="panel-body">
und ein weiterer Test....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title pull-left"> James:</div>
<div class="panel-title pull-right hidden-xs">17.07.16 um 14:10:22</div>
<div class="clearfix"></div>
</div>
<div class="panel-body">
Test ;-)
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title pull-left"> James:</div>
<div class="panel-title pull-right hidden-xs">17.07.16 um 14:10:22</div>
<div class="clearfix"></div>
</div>
<div class="panel-body">
und noch eine Testnachricht...
</div>
</div>
</div>
</div>
<nav class="navbar navbar-default navbar-fixed-bottom chatnavbar">
<div class="container-fluid">
<div class="" id="chatbar">
<div class="input-group">
<span class="input-group-addon hidden-xs">Username:</span>
<input type="text" class="form-control" placeholder="Deine Nachricht..." autofocus>
<span class="input-group-btn">
<button class="btn btn-default" type="button"><span class="glyphicon glyphicon-send"></span> <span class="hidden-xs">Senden</span></button>
</span>
</div>
</div>
</div>
</nav>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="customJS.js"></script>
<!-- <script>
$(document).ready(function() {
<?php echo $JqueryDo;?>
});
</script> -->
</body>
</html>
\ No newline at end of file
style.css
View file @ 3a80964b
body { padding-top: 70px; }
\ No newline at end of file
body {
padding-top: 70px;
padding-bottom: 50px;
}
.online { color: green;}
.offline { color: red;}
#UsersOnlineBox{
padding-right:0px;
}
#UsersOnlinePanel{
margin-bottom: 125px;
}
.chatnavbar > .container-fluid{
padding-top: 7px;
}
.fixed {
position: fixed;
}
.scrollit {
float: left;
}
\ No newline at end of file
Markdown is supported
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