@@ -1,13 +0,0 @@ | |||||
<?php | |||||
namespace App\Helper; | |||||
class PDA | |||||
{ | |||||
public static function isPDA() | |||||
{ | |||||
$ua = $_SERVER['HTTP_USER_AGENT'] ?? ''; | |||||
if (str_contains($ua, 'Windows CE; PPC;')) return true; | |||||
return false; | |||||
} | |||||
} |
@@ -0,0 +1,38 @@ | |||||
/* switch navbar to a single line */ | |||||
.titlebar { | |||||
min-height: 32px; | |||||
} | |||||
.titlebar a.logo { | |||||
position: absolute; | |||||
top: 5px; | |||||
left: 10px; | |||||
} | |||||
.titlebar .menu { | |||||
margin: 6px 0; | |||||
margin-left: 37px; | |||||
line-height: 20px; | |||||
height: 20px; | |||||
text-align: right; | |||||
} | |||||
/* break subforum listing into two columns */ | |||||
.row.subforums .cell { | |||||
float: left; | |||||
width: 50%; | |||||
} | |||||
.row.subforums .cell.left .row { | |||||
margin-right: 5px; | |||||
} | |||||
.row.subforums .cell.right .row { | |||||
margin-left: 5px; | |||||
} | |||||
/* switch stats bar to single line */ | |||||
.row.stats span { | |||||
float: left; | |||||
width: 25%; | |||||
} |
@@ -8,7 +8,7 @@ html { | |||||
body { | body { | ||||
max-width: 1000px; | max-width: 1000px; | ||||
padding: 15px; | |||||
padding: 5px; | |||||
margin: 0 auto; | margin: 0 auto; | ||||
line-height: 1.3; | line-height: 1.3; | ||||
background: #333; | background: #333; | ||||
@@ -41,7 +41,7 @@ hr.textonly { | |||||
} | } | ||||
.row { | .row { | ||||
padding: 10px 15px; | |||||
padding: 5px 10px; | |||||
border: outset 1px #555; | border: outset 1px #555; | ||||
background: #444; | background: #444; | ||||
} | } | ||||
@@ -64,9 +64,11 @@ hr.textonly { | |||||
.row.pagination { | .row.pagination { | ||||
text-align: center; | text-align: center; | ||||
padding: 5px 15px; | padding: 5px 15px; | ||||
font-size: 14px; | |||||
} | } | ||||
.row.breadcrumb { | .row.breadcrumb { | ||||
font-size: 14px; | |||||
padding: 5px 15px; | padding: 5px 15px; | ||||
background: #3e3e3e; | background: #3e3e3e; | ||||
border-color: #4e4e4e; | border-color: #4e4e4e; | ||||
@@ -81,71 +83,42 @@ hr.textonly { | |||||
.row.stats span { | .row.stats span { | ||||
display: block; | display: block; | ||||
float: left; | |||||
width: 25%; | |||||
width: 100%; | |||||
text-align: center; | text-align: center; | ||||
color: #aaa; | color: #aaa; | ||||
} | } | ||||
.row.titlebar { | .row.titlebar { | ||||
position: relative; | position: relative; | ||||
min-height: 52px; | |||||
padding: 0; | |||||
text-align: center; | |||||
} | } | ||||
.titlebar .logo { | |||||
position: absolute; | |||||
top: 0; | |||||
left: 0; | |||||
text-decoration: none; | |||||
margin: 10px 15px; | |||||
height: 32px; | |||||
.titlebar a.logo { | |||||
display: inline; | |||||
border: none; | border: none; | ||||
outline: none; | outline: none; | ||||
width: 32px; | |||||
height: 32px; | |||||
} | } | ||||
.titlebar .logo img { | .titlebar .logo img { | ||||
position: absolute; | |||||
top: 0; | |||||
left: 0; | |||||
min-width: 32px; | min-width: 32px; | ||||
min-height: 32px; | min-height: 32px; | ||||
margin-right: 10px; | |||||
border: none; | border: none; | ||||
} | } | ||||
.titlebar .logo h1 { | |||||
position: relative; | |||||
margin: 0; | |||||
padding: 0; | |||||
padding-left: 42px; | |||||
color: white; | |||||
display: inline; | |||||
text-align: left; | |||||
height: 32px; | |||||
line-height: 32px; | |||||
font-size: 28px; | |||||
font-weight: 600; | |||||
font-style: italic; | |||||
} | |||||
.titlebar .logo h1 span { | |||||
color: #ec3737; | |||||
} | |||||
.titlebar .menu { | .titlebar .menu { | ||||
position: relative; | position: relative; | ||||
padding: 10px 15px; | |||||
min-height: 32px; | |||||
text-align: right; | |||||
vertical-align: middle; | vertical-align: middle; | ||||
margin-top: 5px; | |||||
font-size: 14px; | |||||
} | } | ||||
.titlebar .menu a { | .titlebar .menu a { | ||||
display: inline; | display: inline; | ||||
line-height: 32px; | |||||
color: #aaa; | color: #aaa; | ||||
text-decoration: none; | text-decoration: none; | ||||
white-space: nowrap; | |||||
} | } | ||||
.titlebar a:hover { | .titlebar a:hover { | ||||
@@ -221,6 +194,7 @@ hr.textonly { | |||||
} | } | ||||
.footer { | .footer { | ||||
width: 100%; | |||||
margin-top: 10px; | margin-top: 10px; | ||||
min-height: 20px; | min-height: 20px; | ||||
} | } | ||||
@@ -1,83 +0,0 @@ | |||||
@media only screen and (max-width: 600px) { | |||||
body { | |||||
font-size: 12px; | |||||
padding: 5px; | |||||
} | |||||
.row.titlebar { | |||||
padding: 10px 15px; | |||||
} | |||||
.titlebar .logo { | |||||
position: relative; | |||||
float: none; | |||||
margin: 0; | |||||
text-align: center; | |||||
min-width: 100%; | |||||
} | |||||
.titlebar .menu { | |||||
position: relative; | |||||
padding: 0; | |||||
text-align: center; | |||||
max-width: unset; | |||||
min-height: unset; | |||||
margin: 10px 0 0 0; | |||||
} | |||||
.titlebar .menu a { | |||||
padding-right: 5px; | |||||
padding-left: 0; | |||||
line-height: 1; | |||||
} | |||||
.cell { | |||||
width: auto; | |||||
float: none; | |||||
} | |||||
.cell.left .row, | |||||
.cell.right .row { | |||||
margin-right: 0; | |||||
margin-left: 0; | |||||
} | |||||
.row.spacer { | |||||
height: 5px; | |||||
} | |||||
.row.subforum, | |||||
.row.lastThread { | |||||
padding-top: 5px; | |||||
padding-bottom: 5px; | |||||
} | |||||
.row.lastThread { | |||||
margin-bottom: 5px; | |||||
} | |||||
.row.stats { | |||||
height: 30px; | |||||
} | |||||
.row.stats span { | |||||
width: 50%; | |||||
} | |||||
.row.thread a.left, | |||||
.row.thread a.right { | |||||
width: 100%; | |||||
text-align: left; | |||||
} | |||||
.post .postContent .quote { | |||||
width: auto; | |||||
} | |||||
.post .postContent .youtube { | |||||
width: auto; | |||||
height: auto; | |||||
} | |||||
} |
@@ -1,48 +1,9 @@ | |||||
.row.highlights { | |||||
height: 250px; | |||||
padding: 0; | |||||
border-style: inset; | |||||
} | |||||
.row.highlights iframe { | |||||
width: 100%; | |||||
height: 100%; | |||||
border: none; | |||||
} | |||||
.row.subforums { | .row.subforums { | ||||
background: transparent !important; | background: transparent !important; | ||||
padding: 0; | padding: 0; | ||||
border: none; | border: none; | ||||
} | } | ||||
body.simple .row.subforums { | |||||
padding: 0; | |||||
} | |||||
.cell { | |||||
width: 50%; | |||||
float: left; | |||||
} | |||||
.cell.left .row { | |||||
margin-right: 5px; | |||||
} | |||||
.cell.right .row { | |||||
margin-left: 5px; | |||||
} | |||||
body.simple .cell { | |||||
width: auto; | |||||
float: none; | |||||
} | |||||
body.simple .cell .row { | |||||
margin-left: 0; | |||||
margin-right: 0; | |||||
} | |||||
.row.subforum h3, | .row.subforum h3, | ||||
.row.lastThread h4 { | .row.lastThread h4 { | ||||
margin: 0; | margin: 0; | ||||
@@ -66,7 +27,3 @@ body.simple .cell .row { | |||||
border-color: #4a4a4a; | border-color: #4a4a4a; | ||||
margin-bottom: 10px; | margin-bottom: 10px; | ||||
} | } | ||||
body.simple .row.lastThread { | |||||
margin-bottom: 5px; | |||||
} |
@@ -2,10 +2,6 @@ | |||||
padding: 0; | padding: 0; | ||||
} | } | ||||
body.simple .row.threads { | |||||
padding: 0; | |||||
} | |||||
.row.thread { | .row.thread { | ||||
position: relative; | position: relative; | ||||
padding-top: 0; | padding-top: 0; | ||||
@@ -23,15 +19,6 @@ body.simple .row.threads { | |||||
height: 44px; | height: 44px; | ||||
} | } | ||||
body.simple .row.thread img.icon { | |||||
position: relative; | |||||
display: inline; | |||||
top: unset; | |||||
left: unset; | |||||
width: 16px; | |||||
height: 16px; | |||||
} | |||||
.row.thread a { | .row.thread a { | ||||
margin: 1px 0; | margin: 1px 0; | ||||
display: block; | display: block; | ||||
@@ -45,37 +32,21 @@ body.simple .row.thread img.icon { | |||||
padding-top: 10px; | padding-top: 10px; | ||||
} | } | ||||
body.simple .row.thread a.main { | |||||
display: inline; | |||||
padding-top: 0; | |||||
width: unset; | |||||
} | |||||
.row.thread .meta { | .row.thread .meta { | ||||
position: relative; | position: relative; | ||||
width: 100%; | width: 100%; | ||||
font-size: 14px; | |||||
padding-bottom: 10px; | padding-bottom: 10px; | ||||
} | } | ||||
body.simple .row.thread .meta { | |||||
padding-bottom: 0; | |||||
} | |||||
/*.row.thread .meta a.left,*/ | |||||
/*.row.thread .meta a.right {*/ | |||||
/* display: block;*/ | |||||
/* float: left;*/ | |||||
/* width: 49.5%;*/ | |||||
/*}*/ | |||||
.row.thread .meta a.left, | |||||
.row.thread .meta a.right { | |||||
display: block; | |||||
float: left; | |||||
width: 49.5%; | |||||
} | |||||
.row.thread .meta a.right { | |||||
float: right; | |||||
text-align: right; | |||||
} | |||||
body.simple .row.thread .meta a { | |||||
float: none; | |||||
width: unset; | |||||
text-align: left; | |||||
font-size: 10px; | |||||
} | |||||
/*.row.thread .meta a.right {*/ | |||||
/* float: right;*/ | |||||
/* text-align: right;*/ | |||||
/*}*/ |
@@ -36,19 +36,17 @@ | |||||
left: 0; | left: 0; | ||||
right: 0; | right: 0; | ||||
z-index: 5; | z-index: 5; | ||||
padding: 6px 10px; | |||||
} | } | ||||
.postInfo .userForeground img.avatar { | .postInfo .userForeground img.avatar { | ||||
float: left; | float: left; | ||||
min-height: 32px; | min-height: 32px; | ||||
max-height: 32px; | max-height: 32px; | ||||
margin: 6px 15px; | |||||
margin-right: 10px; | margin-right: 10px; | ||||
} | } | ||||
.postInfo .userForeground .username { | .postInfo .userForeground .username { | ||||
float: left; | |||||
margin: 6px 15px; | |||||
color: white; | color: white; | ||||
text-decoration: none; | text-decoration: none; | ||||
} | } | ||||
@@ -56,21 +54,18 @@ | |||||
.postInfo .userForeground .date { | .postInfo .userForeground .date { | ||||
color: #aaa; | color: #aaa; | ||||
text-decoration: none; | text-decoration: none; | ||||
float: right; | |||||
margin: 6px 15px; | |||||
margin-right: 15px; | |||||
} | } | ||||
.postInfo.show-avatar .userForeground .username, | |||||
.postInfo.show-avatar .userForeground .date { | |||||
margin-top: 12px; | |||||
margin-bottom: 12px; | |||||
margin-left: 0; | |||||
.postInfo .userForeground .username, | |||||
.postInfo .userForeground .date { | |||||
display: block; | |||||
font-size: 14px; | |||||
line-height: 16px; | |||||
color: #fff; | |||||
} | } | ||||
.postInfo.show-background .userForeground .username, | |||||
.postInfo.show-background .userForeground .date { | |||||
color: #fff; | |||||
.postInfo .userForeground .date { | |||||
color: #aaa; | |||||
} | } | ||||
.postInfo.banned .userForeground .username, | .postInfo.banned .userForeground .username, | ||||
@@ -78,6 +73,10 @@ | |||||
color: #ff8f8f; | color: #ff8f8f; | ||||
} | } | ||||
.post .postContent { | |||||
word-break: break-word; | |||||
} | |||||
.post .postContent .marginBreak { | .post .postContent .marginBreak { | ||||
height: 1px; | height: 1px; | ||||
clear: both; | clear: both; | ||||
@@ -189,6 +188,10 @@ | |||||
background: url('../../img/youtube-play.gif'); | background: url('../../img/youtube-play.gif'); | ||||
} | } | ||||
.post .ratings { | |||||
padding-top: 5px; | |||||
} | |||||
.post .ratings td { | .post .ratings td { | ||||
padding: 0; | padding: 0; | ||||
padding-right: 5px; | padding-right: 5px; | ||||
@@ -1,41 +0,0 @@ | |||||
/* reduce padding */ | |||||
body.simple { | |||||
padding: 5px; | |||||
} | |||||
body.simple .row { | |||||
padding: 5px; | |||||
} | |||||
body.simple .row.spacer { | |||||
height: 5px; | |||||
padding: 0; | |||||
} | |||||
/* Fix header styling */ | |||||
body.simple .row.titlebar .logo { | |||||
position: relative; | |||||
padding: 0; | |||||
text-align: center; | |||||
margin: 0; | |||||
} | |||||
body.simple .row.titlebar .logo h1 { | |||||
padding-left: 0; | |||||
} | |||||
body.simple .row.titlebar .menu { | |||||
text-align: center; | |||||
padding: 10px 0 0 0; | |||||
} | |||||
body.simple .row.titlebar .menu a { | |||||
line-height: 1; | |||||
} | |||||
/* Fix stats styling */ | |||||
body.simple .row.stats span { | |||||
display: block; | |||||
width: auto; | |||||
float: none; | |||||
} |
@@ -1,6 +1,3 @@ | |||||
@php | |||||
$pda = App\Helper\PDA::isPDA(); | |||||
@endphp | |||||
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Frameset//EN' 'http://www.w3.org/TR/html4/frameset.dtd'> | <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Frameset//EN' 'http://www.w3.org/TR/html4/frameset.dtd'> | ||||
<html class="lang-eng" dir="ltr" ng-app="" > | <html class="lang-eng" dir="ltr" ng-app="" > | ||||
<head> | <head> | ||||
@@ -9,17 +6,16 @@ | |||||
<meta name='mobile-web-app-capable' content='yes'> | <meta name='mobile-web-app-capable' content='yes'> | ||||
<meta charset='ISO-8859-1'> | <meta charset='ISO-8859-1'> | ||||
<link rel='icon' type='image/x-icon' href='/favicon.ico' /> | <link rel='icon' type='image/x-icon' href='/favicon.ico' /> | ||||
<link rel='stylesheet' type='text/css' href='/css/main.css'/> | |||||
@if ($pda) | |||||
<link rel='stylesheet' type='text/css' href='/css/pda.css'/> | |||||
@else | |||||
<link rel='stylesheet' type='text/css' href='/css/mobile.css'/> | |||||
@endif | |||||
<link rel='stylesheet' type='text/css' href='/css/main.css' media="screen" /> | |||||
<link rel="stylesheet" type="text/css" href="/css/enhance.css" media="handheld, screen and (min-width: 640px)" /> | |||||
<!--[if IE]> | |||||
<link rel="stylesheet" type="text/css" href="/css/enhance.css" /> | |||||
<![endif]--> | |||||
@yield('scripts') | @yield('scripts') | ||||
<meta name='theme-color' content='#333'> | <meta name='theme-color' content='#333'> | ||||
<title>Knockout Lite | @yield('title', 'Index')</title> | <title>Knockout Lite | @yield('title', 'Index')</title> | ||||
</head> | </head> | ||||
<body class="{{ $pda ? 'simple' : null }}"> | |||||
<body> | |||||
@yield('page') | @yield('page') | ||||
</body> | </body> | ||||
</html> | </html> |
@@ -1,8 +1,8 @@ | |||||
<div class="wrapper"> | <div class="wrapper"> | ||||
<div class="row titlebar"> | <div class="row titlebar"> | ||||
<div class="logo"> | |||||
<h1><img src="/img/logo.gif" alt=""/>knockout<span>!</span></h1> | |||||
</div> | |||||
<a class="logo" href="{{ route('index') }}"> | |||||
<img src="/img/logo.gif" alt="Knockout!"/> | |||||
</a> | |||||
<div class="menu"> | <div class="menu"> | ||||
<a href="{{ route('index') }}">Home</a> | <a href="{{ route('index') }}">Home</a> | ||||
<span class="space"> </span> | <span class="space"> </span> | ||||