serverlist has extra menu point, fixed mobile view

This commit is contained in:
Ulf Gebhardt 2016-12-03 22:42:01 +01:00
parent 45da47d65a
commit 9df78f9d7d
8 changed files with 140 additions and 100 deletions

View File

@ -2,45 +2,57 @@
width: device-width;
}
.nopadding {
padding: 0 !important;
margin: 0 !important;
}
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
color: #7A7A7A;
min-height: 100%;
}
.mojotrollz_nav{
border: 0;
background-color: rgba(255,0,0,0) !important;
margin-top: 45px;
margin-bottom: 0;
padding-left: 14px;
padding-right: 29px;
padding-right: 14px;
}
.mojotrollz_heading{
width: 100%;
width: 35%;
height: 100px;
z-index: 2;
color: #B7B7B7;
font-size: 90px;
text-align: center;
top: -150px;
position: absolute;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
margin-top: 0;
visibility: visible;
animation-delay: 0.7s;
animation-name: fadeInDown;
}
.mojotrollz_flexslider{
padding-left: 14px;
padding-right: 14px;
min-height: 100px;
}
.mojotrollz_download{
margin-left: 0;
padding-left: 0;
width: 270px;
width: 277px;
}
.mojotrollz_download_text{
@ -74,8 +86,8 @@ html, body {
padding-bottom: 25px;
}
.mojotrollz_col_contentmain{
padding-left: 30px;
padding-right: 30px;
padding-left: 15px;
padding-right: 15px;
}
.ontop{

View File

@ -5,4 +5,17 @@ table.mojotrollz_table tr:nth-child(odd) {
}
table.mojotrollz_table tr:hover {
background-color: #1f1f1f;
}
table.mojotrollz_table td, table.mojotrollz_table th{
border-top: 0 !important;
padding: 0 !important;
}
.table-responsive {
border: 0;
}
table.mojotrollz_table td{
padding-left: 3px !important;
}

View File

@ -8,4 +8,8 @@ $(document).ready(function() {
slideshow: true,
animationLoop: true,
});
$('.navbar-collapse a').click(function(){
$(".navbar-collapse").collapse('hide');
});
});

View File

@ -18,75 +18,76 @@
background: url(./api.php?call=files&cat=content&id=bg_brown_sun.jpg)fixed no-repeat;
background-size: cover;
}
.mojotrollz_nav{
background: url(./api.php?call=files&cat=content&id=main_holder_middle.png) repeat-y;
background-size: contain;
}
.mojotrollz_col{
background: url(./api.php?call=files&cat=content&id=main_holder_middle.png) repeat-y;
background-size: contain;
}
.mojotrollz_download_text{
background: url(./api.php?call=files&cat=content&id=download_client.png) no-repeat;
background-size: cover;
}
#tapete{
background: url(./api.php?call=files&cat=content&id=main_holder_middle.png) repeat-y;
background-size: contain;
margin-top: 45px;
padding-left: 15px;
padding-right: 15px;
}
</style>
${css}
${js}
</head>
<body>
<h1 class="fadeInDown animated lead mojotrollz_heading"><img class="img-responsive" title="mojotrollz.eu logo" alt="${mojotrollz_heading}" src="./api.php?call=files&amp;cat=content&amp;id=mojotrollz_logo.png" width="100%"></h1>
<div class="container">
<!-- Navbar -->
<div class="navbar navbar-inverse mojotrollz_nav" role="navigation">
<div id="content_home" class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse anchor">
<ul class="nav navbar-nav navbar-left">
<li class="active ontop"><a href="#content_home">${mojotrollz_mojotrollz}</a></li>
<li class="ontop"><a href="#content_servers">${mojotrollz_servers}</a></li>
<li class="ontop"><a href="#!beta">${mojotrollz_beta}</a></li>
<!--<li><a href="#content_tshirts" onClick="">${mojotrollz_tshirts}</a></li>-->
<!--<li><a href="#content_addons">${mojotrollz_addons}</a></li>-->
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="ontop"><a href="${link_twitch}" target="_blank"><i class="fa fa-twitch fa-lg"></i></a></li>
<li class="ontop"><a href="${link_facebook}" target="_blank"><i class="fa fa-facebook fa-lg"></i></a></li>
<li class="ontop"><a href="${link_youtube}" target="_blank"><i class="fa fa-youtube fa-lg"></i></a></li>
<li class="ontop"><a href="#!donate"><i class="fa fa-usd fa-lg"></i></a></li>
<li class="ontop"><a href="#!account"><i class="glyphicon glyphicon-user"></i></a></li>
</ul>
</div>
</div>
<!-- Flexslider -->
<div class="row-fluid">
<div class="col-md-12 mojotrollz_col">
<h1 class="fadeInDown animated lead mojotrollz_heading"><img title="mojotrollz.eu logo" alt="${mojotrollz_heading}" src="./api.php?call=files&amp;cat=content&amp;id=mojotrollz_logo.png" width="55%"></h1>
<div class="flexslider mojotrollz_flexslider">
<ul class="slides">
<li><img alt="WoW Classic Vanilla Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_1.gif" width="100%"></li>
<li style="display: none"><img alt="WoW The Burning Crusade Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_2.gif" width="100%"></li>
<li style="display: none"><img alt="World of Warcraft Pandaria Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_3.gif" width="100%"></li>
<li style="display: none"><img alt="The Struggle of our Community Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_4.gif" width="100%"></li>
<div id="tapete" class="row">
<!-- Navbar -->
<div class="navbar navbar-inverse mojotrollz_nav" role="navigation">
<div id="content_home" class="navbar-header ontop">
<button type="button" class="navbar-toggle collapsed pull-right" data-toggle="collapse" data-target="#navigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse anchor" id="navigation">
<ul class="nav navbar-nav navbar-left">
<li class="active ontop"><a href="#content_home">${mojotrollz_mojotrollz}</a></li>
<li class="ontop"><a href="#!serverlist">${mojotrollz_servers}</a></li>
<li class="ontop"><a href="#!beta">${mojotrollz_beta}</a></li>
<!--<li><a href="#content_tshirts" onClick="">${mojotrollz_tshirts}</a></li>-->
<!--<li><a href="#content_addons">${mojotrollz_addons}</a></li>-->
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="ontop"><a href="${link_twitch}" target="_blank"><i class="fa fa-twitch fa-lg"></i></a></li>
<li class="ontop"><a href="${link_facebook}" target="_blank"><i class="fa fa-facebook fa-lg"></i></a></li>
<li class="ontop"><a href="${link_youtube}" target="_blank"><i class="fa fa-youtube fa-lg"></i></a></li>
<li class="ontop"><a href="#!donate"><i class="fa fa-usd fa-lg"></i></a></li>
<li class="ontop"><a href="#!account"><i class="glyphicon glyphicon-user"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Content -->
<div class="row-fluid">
<div id="content" class="col-md-12 mojotrollz_col mojotrollz_col_contentmain">
<!-- Flexslider -->
<div class="row-fluid">
<div class="col-md-12 mojotrollz_col">
<div class="flexslider mojotrollz_flexslider">
<ul class="slides">
<li><img alt="WoW Classic Vanilla Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_1.gif" width="100%"></li>
<li style="display: none"><img alt="WoW The Burning Crusade Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_2.gif" width="100%"></li>
<li style="display: none"><img alt="World of Warcraft Pandaria Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_3.gif" width="100%"></li>
<li style="display: none"><img alt="The Struggle of our Community Banner" src="./api.php?call=files&amp;cat=content&amp;id=banner_mojotrollz_4.gif" width="100%"></li>
</ul>
</div>
</div>
</div>
<!-- Content -->
<div class="row-fluid">
<div id="content" class="col-md-12 mojotrollz_col mojotrollz_col_contentmain"></div>
</div>
</div>
<!-- Content More -->
<div class="row-fluid">
<div id="content_more" class="col-md-12">
<div class="row">
<div class="col-md-4">
<a href="#content_home">${mojotrollz_mojotrollz}</a><br><br>
<a href="#content_servers">${mojotrollz_servers}</a><br><br>
<a href="#!serverlist">${mojotrollz_servers}</a><br><br>
<a href="#!beta">${mojotrollz_beta}</a><br><br>
<a href="#!account"><i class="glyphicon glyphicon-user"></i>&nbsp;&nbsp; ${mojotrollz_login}</a> / <a href="#!register"> REGISTER</a><br><br>
<!--<a href="#content_tshirts">${mojotrollz_tshirts}</a><br><br>-->
@ -98,13 +99,14 @@
<a href="${link_twitch}" target="_blank"><i class="fa fa-twitch fa-lg"></i>&nbsp;&nbsp; TWITCH</a><br><br>
<a href="${link_facebook}" target="_blank"><i class="fa fa-facebook fa-lg"></i>&nbsp;&nbsp; FACEBOOK</a><br><br>
<a href="${link_youtube}" target="_blank"><i class="fa fa-youtube fa-lg"></i>&nbsp;&nbsp; YOUTUBE</a><br><br>
<a href="#!donate"><i class="fa fa-usd fa-lg"></i>&nbsp;&nbsp; DONATE</a>
<a href="#!donate"><i class="fa fa-usd fa-lg"></i>&nbsp;&nbsp; DONATE</a><br><br>
</div>
<div class="col-md-4">
<a href="#!impressum">${mojotrollz_impressum}</a><br><br>
<a href="${link_webcraft}" target="_blank">${mojotrollz_webcraft}</a><br><br>
<a href="${link_slingit}" target="_blank">${mojotrollz_slingit}</a><br><br>
</div>
</div>
</div>
</div>
</div>

View File

@ -1,32 +1,36 @@
<hr style="width: 100%;">
${mojotrollz_servers_text}
<table class="mojotrollz_table" style="width: 100%;">
<tr>
<th class="col-md-2" style="padding: 0;">${basic_name}</th>
<th class="col-md-2" style="padding: 0;">${basic_version}</th>
<th class="col-md-4" style="padding: 0;">${basic_description}</th>
<th class="col-md-1" style="padding: 0;">${basic_score}</th>
<th class="col-md-1" style="padding: 0;"></th>
<th class="col-md-1" style="padding: 0;"></th>
<th class="col-md-1" style="padding: 0;"></th>
</tr>
${server_list}
</table>
<div class="col-md-4" style="padding: 0;">
<br>
${mojotrollz_submit_server}
<form class="textbox trojan" style="padding-top:10px" id="newserver_form">
<div class="control-group">
<div class="controls" style="width: 100%;">
<input class="form-control text_width"
type="text"
id="input_server_address"
placeholder="${mojotrollz_address_server}"
minlength="5"
required data-validation-required-message="§{mojotrollz_please_address_server}">
</div>
<button type="submit" class="btn-sm btn btn-success" style="width: 50%; margin-top: 5px;"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>&nbsp;&nbsp;Submit for Evaluation!</button>
<div class="row-fluid mojotrollz_col_contentmain">
${mojotrollz_servers_text}
<div class="col-md-12 nopadding">
<div class="table-responsive">
<table class="mojotrollz_table table" style="width: 100%;">
<tr>
<th class="col-md-1">${basic_vote}</th>
<th class="col-md-2">${basic_name}</th>
<th class="col-md-2">${basic_version}</th>
<th class="col-md-1">${basic_score}</th>
<th class="col-md-4">${basic_description}</th>
<th class="col-md-1"></th>
<th class="col-md-1"></th>
</tr>
${server_list}
</table>
</div>
<div class="help-block"></div>
</form>
</div>
<div class="col-md-4 nopadding">
${mojotrollz_submit_server}
<form class="textbox trojan" style="padding-top:10px" id="newserver_form">
<div class="control-group">
<div class="controls" style="width: 100%;">
<input class="form-control text_width"
type="text"
id="input_server_address"
placeholder="${mojotrollz_address_server}"
minlength="5"
required data-validation-required-message="§{mojotrollz_please_address_server}">
</div>
<button type="submit" class="btn-sm btn btn-success" style="margin-top: 5px;"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>&nbsp;&nbsp;Submit for Evaluation!</button>
</div>
<div class="help-block"></div>
</form>
</div>
</div>

View File

@ -1,4 +1,9 @@
<tr>
<td>
<button type="submit" class="btn_vote btn-sm btn ${btn_vote_color}" server="${id}" style="width: 95%;">
<span class="glyphicon ${glyphicon_vote}" aria-hidden="true"> vote</span>
</button>
</td>
<td><a href="${url}" target="blank">${name}</a></td>
<td>
<a href="${link_wow_${version_url}}">
@ -6,13 +11,8 @@
&nbsp;&nbsp;${version}
</a>
</td>
<td>${description}</td>
<td>${score}</td>
<td>
<button type="submit" class="btn_vote btn-sm btn ${btn_vote_color}" server="${id}" style="width: 95%;">
<span class="glyphicon ${glyphicon_vote}" aria-hidden="true"> vote</span>
</button>
</td>
<td>${description}</td>
<td>
<button type="submit" class="btn-sm btn btn-primary" onClick="location.href='${url}'" style="width: 95%;">
<span class="glyphicon glyphicon-globe" aria-hidden="true"></span>

View File

@ -8,15 +8,15 @@
</div>
<div id="content_teamspeak">
<div class="col-md-9">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!--<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>-->
<!-- mojotrollz -->
<ins class="adsbygoogle"
<!--<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-3504070649672819"
data-ad-slot="2848666885"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</script>-->
</div>
<div class="col-md-3" style="text-align: right;">
<h3>
@ -29,6 +29,9 @@
</h3>
</div>
</div>
<div id="content_servers" class="mojotrollz_col_content"></div>
<div style="padding-left: 15px; padding-right: 15px;">
<hr style="width: 100%;">
</div>
<div id="content_servers"></div>
${content_tshirt}
${content_addons}

View File

@ -1,6 +1,8 @@
REPLACE INTO `system_page` (`id`, `group`, `name`, `state`, `parent_id`, `login`, `type`, `div`, `url`, `func`, `php_class`) VALUES (10, 1, 'start', 'start', -1, 0, 0, '#content', './?page=start', 'init_start', 'default_start');
REPLACE INTO `system_page` (`id`, `group`, `name`, `state`, `parent_id`, `login`, `type`, `div`, `url`, `func`, `php_class`) VALUES (11, 1, 'serverlist', 'start', 10, 0, 0, '#content_servers', './?page=serverlist', 'init_serverlist', 'default_serverlist');
REPLACE INTO `system_page` (`id`, `group`, `name`, `state`, `parent_id`, `login`, `type`, `div`, `url`, `func`, `php_class`) VALUES (12, 1, 'serverlist', 'serverlist', -1, 0, 0, '#content', './?page=serverlist', 'init_serverlist', 'default_serverlist');
REPLACE INTO `system_page` (`id`, `group`, `name`, `state`, `parent_id`, `login`, `type`, `div`, `url`, `func`, `php_class`) VALUES (15, 1, 'impressum', 'impressum', -1, 0, 0, '#content', './?page=impressum', 'init_impressum', 'default_impressum');
REPLACE INTO `system_page` (`id`, `group`, `name`, `state`, `parent_id`, `login`, `type`, `div`, `url`, `func`, `php_class`) VALUES (20, 1, 'account', 'account', -1, 0, 0, '#content', './?page=account', 'init_account', 'default_account');