Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>nPage-Hilfe Filebase</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<script language="javascript" type="text/javascript" src="includes/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="includes/ajaxfileupload.js"></script>
<script language="javascript" type="text/javascript" src="includes/main.js"></script>
<link href="styles/main.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="header">
<h1><strong>files</strong>.npage-hilfe</h1>
</div>
<div id="note">
<?php echo $echo; ?>
</div>
<div id="page">
<div id="navi">
<ul>
<?php include("includes/navi.php"); ?>
</ul>
</div>
<div id="sidebar">
<?php if(isset($_SESSION['UserID'])){ ?>
<div class="sidebar_element">
<h2>Upload</h2>
<p>Jetzt eine Datei hochladen</p>
<img id="loading" src="images/loading.gif" style="display: none; float: right;" />
<form name="form" action="" method="POST" enctype="multipart/form-data">
<div id="divToUpload">
<input id="fileToUpload" onchange="ajaxFileUpload();" size="1" type="file" name="fileToUpload" class="input" />
<button class="button" id="buttonUpload" >Upload</button>
</div>
</form>
</div>
<div class="sidebar_element">
<h2>Kontrollzentrum</h2>
<p>
<ul class="nav">
<li><a href="#!/my_uploads.php" onclick="load_content('my_uploads.php');">Meine Uploads</a></li>
<li><a href="#!/my_data.php" onclick="load_content('my_data.php');">Einstellungen</a></li>
<li><a href="#!/my_downladlists.php" onclick="load_content('my_downloadlists.php');">Meine Downloadlisten</a></li>
<li><a href="#!/my_history.php" onclick="load_content('my_history.php');">Mein Verlauf</a></li>
<li><a href="?do=logout">Logout</a></li>
</ul>
</p>
</div>
<?php }
else{ ?>
<div class="sidebar_element">
<h2>Unsere Leistungen</h2>
<ul class="norm">
<li>300 MB Speicher für ihre Dateien</li>
<li>maximale Uploadgröße von 20 MB</li>
<li>unterstützung aller Dateitypen</li>
<li>bis zu 200 MB Downloads pro Stunde</li>
<li>Speicherung bis 60 Tage inaktivität</li>
<li>maximale Download geschwindigkeit</li>
</ul>
</div>
<div class="sidebar_element">
<h2>Regeln</h2>
<ol class="norm">
<li>Es ist verboten pornografische Inhalte hochzuladen. Erotikmaterial ist davon nicht betroffen</li>
<li>Es ist vorboten rassistisches, politisch unkorrektes oder urheberrechtlich geschütztes Material hochzuladen</li>
<li>Es darf nur ein Account pro IP-Adresse erstellt werden.</li>
</ol>
</div>
<?php }?>
</div>
<div id="content">
<?php if(!isset($_SESSION['UserID'])){ ?>
<div class="content_element">
<h1>Willkommen auf files.nPage-Hilfe.de</h1>
<p>Wir bieten dir eine sichere Speicherung deiner Daten, sowie Weltweiten uneingeschrenkten Zugriff darauf.
Außerdem kannst du alle deine Dateien auch anderen Usern zum Download anbieten.</p>
<p>Melde dich jetzt an, oder logge dich mit deinem bereits vorhandenen Account ein.</p>
<br />
<div class="two_column">
<div class="column_50">
<h4>Neu Registrieren</h4>
<form>
<label for="name">Benutzername:</label>
<input type="text" name="name" id="name" />
<label for="pw1">Passwort:</label>
<input type="password" name="pw1" id="pw1" />
<label for="pw2">Passwort bestätigen:</label>
<input type="password" name="pw2" id="pw2" />
<label for="mail">E-Mail:</label>
<input type="text" name="mail" id="mail" />
<input type="submit" name="submit" id="submit" class="submit" value="Registrieren" />
</form>
</div>
<div class="column_50">
<h4>Login</h4>
<form action="" method="post">
<label for="Lname">Benutzername:</label>
<input type="text" name="Lname" id="Lname" />
<label for="pw">Passwort:</label>
<input type="password" name="pw" id="pw" />
<input type="submit" name="login" id="login" class="submit" value="Einloggen" />
</form>
</div>
</div>
<button onclick="show_error('Sie müssen sich einloggen.');">Test</button>
</div>
<?php }
else { ?>
<div class="content_element">
<h1>Hallo <?php echo $_SESSION['Nickname']; ?></h1>
<p>Zum ersten mal hier?<br />
Dann sieh dir unsere <a href="#!/demo.php" onclick="load_content('demo.php');">Demotour</a> zu den wichtigsten Funktionen dieser Seite an.</p>
<p>Derzeit gibt es keine Neuigkeiten zu files.nPage-Hilfe.de</p>
</div>
<?php }?>
</div>
</div>
<div id="footer">
<p>
© files.npage-hilfe.de Alle Rechte vorbehalten
</p>
</div>
</body>
</html>
Code: Alles auswählen
*
{
margin: 0px;
padding: 0px;
}
html, body
{
background: url(images/html_background.jpg) repeat-x;
font-family: Calibri, Helvetica,Arial,sans-serif;
line-height: 1.3em;
font-size: 101%;
color: #333;
}
#header
{
width: 960px;
height: 49px;
margin: auto;
}
#page
{
margin: auto;
width: 960px;
}
#navi
{
width: 960px;
height: 46px;
}
#sidebar
{
height: 300px;
width: 280px;
float: left;
padding-top: 10px;
}
#content
{
width: 680px;
padding-top: 10px;
float: left;
}
#footer
{
height: 20px;
width: 100%;
position: fixed;
bottom: 0px;
border-top: solid 1px #676767;
background: #DDDDDD;
text-align: center;
color: black;
margin: auto;
}
#navi ul
{
list-style-type: none;
width: 100%;
border-bottom: solid 6px #FF882C;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-bottomright: 3px;
}
#navi ul li
{
list-style-type: none;
display: inline-block;
height: 29px;
background-color: #FF882C;
padding-left: 10px;
padding-right: 10px;
padding-top: 9px;
position: relative;
margin-top: 1px;
top: 6px;
}
#navi ul li a
{
font-size: 110%;
color: #F3F3F3;
font-weight: bold;
text-decoration: none;
}
#navi ul li:hover
{
background-color: #F3F3F3;
height: 28px;
border-top: solid 1px #C9C9C9;
margin-top: 0px;
top: 7px;
}
#navi ul li:hover a
{
color: #333;
text-decoration: underline;
}
.first_navi_element
{
border-left: solid 6px #FF882C;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-topleft: 3px;
}
.last_navi_element
{
border-right: solid 6px #FF882C;
-moz-border-radius-topright: 3px;
}
#header h1
{
color: #333;
padding-top: 50px;
padding-right: 30px;
text-align: right;
font-size: 440%;
font-family: Tahoma;
border: 0px;
}
#header h1 strong
{
color: #FF882C;
}
.sidebar_element
{
border: solid 1px #C9C9C9;
width: 260px;
padding:8px;
margin-bottom: 10px;
background: #F9F9F9;
}
.sidebar_element h2
{
color: #808080;
font-size: 160%;
padding: 5px 0px 5px 5px;
border-bottom: dotted 1px #C9C9C9;
margin-bottom: 7px;
}
.sidebar_element p{
padding: 5px;
}
.content_element
{
border: solid 1px #C9C9C9;
width: 658px;
padding:8px;
margin-bottom: 10px;
margin-left: 4px;
background: #F9F9F9;
}
h1
{
color: #808080;
font-size: 160%;
padding: 5px 0px 5px 5px;
border-bottom: dotted 1px #C9C9C9;
margin-bottom: 7px;
}
h2
{
color: #808080;
font-size: 140%;
padding: 5px 0px 5px 5px;
border-bottom: dotted 1px #C9C9C9;
margin-bottom: 7px;
}
h3
{
color: #808080;
font-size: 120%;
padding: 5px 0px 5px 5px;
border-bottom: dotted 1px #C9C9C9;
margin-bottom: 7px;
}
h4
{
color: #808080;
font-size: 110%;
padding: 5px 0px 5px 5px;
border-bottom: dotted 1px #C9C9C9;
margin-bottom: 7px;
}
.content_element p{
padding: 5px;
}
.content_element a{
color: #FF882C;
}
.content_element p.info{
text-align: right;
}
.content_element p.beitrag_info{
float: right;
padding-top: 10px;
}
.comment
{
list-style:none;
border: solid 1px #EFCFA5;
background: #F9EFE2;
padding: 5px 40px 5px 10px;
position: relative;
margin-bottom: 8px;
}
.author
{
font-size: 130%;
font-weight: 700;
}
.date
{
float: right;
}
.comment_number
{
font-size: 200%;
color: #EBC79A;
position: absolute;
right: 5px;
bottom: 5px;
}
#comments
{
margin: 10px 0px 10px 0px;
}
input#download
{
width: 50%;
height: 40px;
background-color: #EBC79A;
font-size: 200%;
font-weight: bold;
border: solid 2px #FF882C;
-moz-border-radius: 8px;
}
input#download:hover
{
background-color: #FF882C;
cursor: pointer;
}
div.sexybookmarks
{
clear:both;
height:29px;
margin:auto;
overflow:hidden;
position:relative;
float: right;
top: 10px;
}
div.sexybookmarks a
{
background-position:0 bottom;
border:0;
display:block;
float:left;
height:29px;
text-decoration:none;
width:60px;
}
div.sexybookmarks a:hover
{
background-position:0 top;
}
div.sexybookmarks a span
{
display:none;
}
div.sexybookmarks a.sexy-delicious
{
background-image:url('../images/delicious.png')
}
div.sexybookmarks a.sexy-facebook
{
background-image:url('../images/facebook.png')
}
div.sexybookmarks a.sexy-google
{
background-image:url('../images/google.png')
}
div.sexybookmarks a.sexy-misterwong
{
background-image:url('../images/misterwong.png')
}
div.sexybookmarks a.sexy-twitter
{
background-image:url('../images/twitter.png')
}
label
{
display: inline-block;
width: 145px;
margin-bottom: 6px;
}
input, textarea
{
width: 160px;
display: inline;
font-family: Calibri, Helvetica,Arial,sans-serif;
font-size: 100%;
border: 0px;
border-bottom: solid 2px #FFDEC9;
border-left: solid 1px #FF6505;
margin-bottom: 6px;
}
input.checked, textarea.checked
{
width: 160px;
display: inline;
font-family: Calibri, Helvetica,Arial,sans-serif;
font-size: 100%;
border: 0px;
border-bottom: solid 2px #88FF7F;
border-left: solid 1px #2EC404;
margin-bottom: 6px;
}
input.failed, textarea.failed
{
width: 160px;
display: inline;
font-family: Calibri, Helvetica,Arial,sans-serif;
font-size: 100%;
border: 0px;
background: #FF9A8E;
border-bottom: solid 2px #FF1E05;
border-left: solid 1px #FF1E05;
margin-bottom: 6px;
}
td input, td textarea
{
width: 100px;
}
input.submit
{
width: 200px;
border: solid 1px #FF882C;
background: #FFE9D8;
}
input.submit:hover
{
background: #FF882C;
}
.sidebar_element ul.link
{
list-style-type: none;
}
.sidebar_element ul.link li
{
margin-top: 4px;
}
.sidebar_element a
{
color: #FF882C;
}
.sidebar_element ul li a
{
color: #FF882C;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
.sidebar_element ul li a:hover
{
text-decoration: underline;
}
ul.norm {
padding: 0px 0px 0px 15px;
}
ul.norm li {
margin-bottom: 3px;
}
ol.norm {
padding: 0px 0px 0px 18px;
}
ol.norm li {
margin-bottom: 3px;
}
div.two_column
{
width: 100%;
overflow: auto;
}
div.column_50
{
width: 48%;
float: left;
margin: 0px 0.8% 0px 0.8%;
}
div#note .error
{
background-color: #FFACA7;
border: solid 2px #FF1205;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
position: absolute;
width: 30%;
left: 35%;
top: 35%;
text-align: center;
font-size: 130%;
color: black;
font-weight: bold;
padding: 10px 5px 10px 5px;
}
.loading
{
opacity: 0.5;
}
ul.nav
{
list-style-type: none;
}
#divToUpload
{
position: relative;
width: 150px;
height: 30px;
}
#fileToUpload
{
position: absolute;
width: 15px;
height: 30px;
top:0px;
left:0px;
z-index: 100;
opacity: 0;
}
#buttonUpload
{
width: 164px;
height: 30px;
background-color: #EBC79A;
font-size: 110%;
font-weight: bold;
border: solid 2px #FF882C;
-moz-border-radius: 8px;
position: absolute;
top:0px;
left:0px;
z-index: 1;
}
#fileToUpload:hover
{
cursor: pointer;
}