mirror of
https://codeberg.org/streams/streams.git
synced 2024-09-20 04:15:12 +00:00
add choklet template with several defined flavours, two and three column fluid layouts with optional side margins and a region for a blog-style header photo
This commit is contained in:
friendica
parent
e931af8307
commit
895c9411d9
10 changed files with 248 additions and 48 deletions
|
|
@ -8,12 +8,10 @@ function nav(&$a) {
|
|||
*
|
||||
*/
|
||||
|
||||
$ssl_state = ((local_user()) ? true : false);
|
||||
|
||||
if(!(x($a->page,'nav')))
|
||||
$a->page['nav'] = '';
|
||||
|
||||
$base = $a->get_baseurl($ssl_state);
|
||||
$base = z_root();
|
||||
$a->page['htmlhead'] .= <<< EOT
|
||||
|
||||
<script>$(document).ready(function() {
|
||||
|
|
@ -33,18 +31,6 @@ EOT;
|
|||
|
||||
|
||||
|
||||
/**
|
||||
* Placeholder div for popup panel
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* Our network is distributed, and as you visit friends some of the
|
||||
* sites look exactly the same - it isn't always easy to know where you are.
|
||||
* Display the current site location as a navigation aid.
|
||||
*
|
||||
*/
|
||||
|
||||
if(local_user()) {
|
||||
$channel = $a->get_channel();
|
||||
$observer = $a->get_observer();
|
||||
|
|
@ -58,6 +44,26 @@ EOT;
|
|||
$sitelocation = (($myident) ? $myident : $a->get_hostname());
|
||||
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* Provide a banner/logo/whatever
|
||||
*
|
||||
*/
|
||||
|
||||
$banner = get_config('system','banner');
|
||||
|
||||
if($banner === false)
|
||||
$banner = get_config('system','sitename');
|
||||
|
||||
$a->page['header'] .= replace_macros(get_markup_template('hdr.tpl'), array(
|
||||
'$baseurl' => $a->get_baseurl(),
|
||||
'$sitelocation' => $sitelocation,
|
||||
'$langselector' => ((get_config('system','select_language')) ? lang_selector() : ''),
|
||||
'$banner' => $banner
|
||||
));
|
||||
|
||||
|
||||
// nav links: array of array('href', 'text', 'extra css classes', 'title')
|
||||
$nav = Array();
|
||||
|
||||
|
|
@ -128,7 +134,7 @@ EOT;
|
|||
if(($a->config['system']['register_policy'] == REGISTER_OPEN) && (! local_user()) && (! remote_user()))
|
||||
$nav['register'] = array('register',t('Register'), "", t('Create an account'));
|
||||
|
||||
$help_url = $a->get_baseurl($ssl_state) . '/help';
|
||||
$help_url = z_root() . '/help';
|
||||
|
||||
if(! get_config('system','hide_help'))
|
||||
$nav['help'] = array($help_url, t('Help'), "", t('Help and documentation'));
|
||||
|
|
@ -209,7 +215,6 @@ EOT;
|
|||
|
||||
$a->page['nav'] .= replace_macros($tpl, array(
|
||||
'$baseurl' => $a->get_baseurl(),
|
||||
'$langselector' => ((get_config('system','select_language')) ? lang_selector() : ''),
|
||||
'$sitelocation' => $sitelocation,
|
||||
'$nav' => $x['nav'],
|
||||
'$banner' => $banner,
|
||||
|
|
|
|||
|
|
@ -1,15 +1,22 @@
|
|||
header #banner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
#blog-banner {
|
||||
position: relative;
|
||||
margin-top: 45px;
|
||||
margin-top: 75px;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
aside#region_1 {
|
||||
|
|
@ -30,20 +37,14 @@ section {
|
|||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
float: left;
|
||||
min-width: 650px;
|
||||
width: 60%;
|
||||
min-width: 400px;
|
||||
width: 70%;
|
||||
display: block;
|
||||
padding-bottom: 350px;
|
||||
}
|
||||
|
||||
#region_3 {
|
||||
float: right;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#blog-margin {
|
||||
margin-right: 5%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
|
|
|||
55
view/css/choklet_edgesthree.css
Normal file
55
view/css/choklet_edgesthree.css
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
header #banner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
#blog-banner {
|
||||
position: relative;
|
||||
margin-top: 75px;
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
}
|
||||
|
||||
aside#region_1 {
|
||||
display: block;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
aside input[type='text'] {
|
||||
width: 174px;
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
float: left;
|
||||
min-width: 650px;
|
||||
width: 60%;
|
||||
display: block;
|
||||
padding-bottom: 350px;
|
||||
}
|
||||
|
||||
#region_3 {
|
||||
float: right;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#blog-margin {
|
||||
margin-right: 5%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
48
view/css/choklet_edgestwo.css
Normal file
48
view/css/choklet_edgestwo.css
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
header #banner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
#blog-banner {
|
||||
position: relative;
|
||||
margin-top: 75px;
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
}
|
||||
|
||||
aside#region_1 {
|
||||
display: block;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
aside input[type='text'] {
|
||||
width: 174px;
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
float: left;
|
||||
min-width: 400px;
|
||||
width: 70%;
|
||||
display: block;
|
||||
padding-bottom: 350px;
|
||||
}
|
||||
|
||||
#blog-margin {
|
||||
margin-right: 5%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
49
view/css/choklet_full.css
Normal file
49
view/css/choklet_full.css
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
#blog-banner {
|
||||
position: relative;
|
||||
margin-top: 45px;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
}
|
||||
|
||||
aside#region_1 {
|
||||
display: block;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
aside input[type='text'] {
|
||||
width: 174px;
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
float: left;
|
||||
min-width: 650px;
|
||||
width: 60%;
|
||||
display: block;
|
||||
padding-bottom: 350px;
|
||||
}
|
||||
|
||||
#region_3 {
|
||||
float: right;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#blog-margin {
|
||||
margin-right: 5%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
51
view/css/choklet_three.css
Normal file
51
view/css/choklet_three.css
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
header #banner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
#blog-banner {
|
||||
position: relative;
|
||||
margin-top: 75px;
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
aside#region_1 {
|
||||
display: block;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
aside input[type='text'] {
|
||||
width: 174px;
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
float: left;
|
||||
min-width: 650px;
|
||||
width: 60%;
|
||||
display: block;
|
||||
padding-bottom: 350px;
|
||||
}
|
||||
|
||||
#region_3 {
|
||||
float: right;
|
||||
min-width: 210px;
|
||||
max-width: 220px;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
|
|
@ -7,7 +7,8 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="blog-margin">
|
||||
<?php if(x($page,'nav')) echo $page['nav']; ?>
|
||||
<header><?php if(x($page,'header')) echo $page['header']; ?></header>
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
|
||||
<div id="blog-banner"><?php if(x($page,'banner')) echo $page['banner']; ?></div>
|
||||
<aside id="region_1"><?php if(x($page,'aside')) echo $page['aside']; ?></aside>
|
||||
<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,8 @@
|
|||
<?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
|
||||
</head>
|
||||
<body>
|
||||
<?php if(x($page,'nav')) echo $page['nav']; ?>
|
||||
<header><?php if(x($page,'header')) echo $page['header']; ?></header>
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
|
||||
<aside id="region_1"><?php if(x($page,'aside')) echo $page['aside']; ?></aside>
|
||||
<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
|
||||
<div id="page-footer"></div>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,8 @@
|
|||
<?php if(x($page,'htmlhead')) echo $page['htmlhead'] ?>
|
||||
</head>
|
||||
<body>
|
||||
<nav><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
|
||||
<header><?php if(x($page,'header')) echo $page['header']; ?></header>
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
|
||||
<section><?php if(x($page,'content')) echo $page['content']; ?>
|
||||
<div id="page-footer"></div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,3 @@
|
|||
<header>
|
||||
<!-- <div id="site-location">{{$sitelocation}}</div> -->
|
||||
<div id="banner" class="hidden-sm hidden-xs">{{$banner}}</div>
|
||||
</header>
|
||||
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
|
||||
|
|
@ -175,11 +169,5 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{5}"><a href="{0}" title="{2} {3}"><img src="{1}"><span class='contactname'>{2}</span>{3}<br><span class="notif-when">{4}</span></a></li>
|
||||
</ul>
|
||||
|
||||
{{if $langselector}}<div id="langselector" >{{$langselector}}</div>{{/if}}
|
||||
<div id="panel" style="display: none;"></div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue