<!DOCTYPE html>
<html lang="de">
<head>
<!-- These meta tags come first. -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> - Youthweb Styleguide</title>
<!-- Include the CSS -->
<link href="../../dist/toolkit.min.css" rel="stylesheet">
<meta name="theme-color" content="#1c60a1">
</head>
<body>
<script type="text/javascript">
app_settings = {
// Profildaten zum eingeloggten User
// TODO: Refactoring profile-settings
profile: null,
urls: {
// Wegen eines Bugs in Fractal wird z.B. `_config.project.baseUrl` statt `baseUrl` verwendet
// @see https://github.com/frctl/fractal/issues/1042
'root': 'https://styleguide.youthweb.net/components/preview',
'baseUrl': 'http://localhost:8000',
'communityJsonHost': 'http://localhost:8000',
'imagesUploadUrl': 'http://localhost:8000/imageUpload',
},
'loaderUIDelay': 1000, //Asynchrone Funktionen fühlen sich flüssiger an, wenn es aufgrund eines künstlichen Delays nicht flackert
'redirectDelay': 3000, //Bei Redirects sollten die Nutzer die Möglichkeit haben, den Bestätigungstext zu sehen
'locale': window.navigator.userLanguage || window.navigator.language, // z.B. 'de' oder 'de_DE'
};
</script>
<div id="app">
<div class="with-top-navbar">
<div class="growl" id="app-growl"></div>
<add-friend></add-friend>
<report-user></report-user>
<error-message></error-message>
<nav class="navbar navbar-expand-lg fixed-top navbar-dark bg-yw-gradient-primary app-navbar" id="mainNavigation">
<a class="navbar-brand" href="https://styleguide.youthweb.net/components/preview/timeline"><img src="../../dist/img/logo-16.png" alt="Youthweb" /></a>
<div class="collapse navbar-collapse" id="navbarResponsive" data-parent="#mainNavigation">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/forum">Forum</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/live">Zeugnisse</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/praystation">Gebetsanliegen</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/groups">Gruppen</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/events">Events</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/live">Impulse</a>
</li>
</ul>
<search-user source="/" type="users" target="user/{0}" id="autosuggest__navbar"></search-user>
</div>
<a class="nav-link-with-icon ml-auto" href="https://styleguide.youthweb.net/components/preview/messenger">
<span class="icon icon-chat"></span> <!-- TODO: <unread-messages></unread-messages> -->
</a>
<a class="nav-link-with-icon" href="https://styleguide.youthweb.net/components/preview/notifications">
<span class="icon icon-bell"></span> </a>
<button class="navbar-btn-avatar ml-2" type="button" data-toggle="collapse" data-target="#profilePopover" aria-controls="profilePopover" aria-expanded="false" aria-label="Toggle profile">
<img class="rounded-circle" src="">
</button>
<button class="navbar-toggler d-lg-none ml-2" type="button" data-toggle="collapse" data-target="#navigationPopover" aria-controls="navigationPopover" aria-expanded="false" aria-label="Toggle navigation">
<span class="icon icon-menu"></span>
</button>
</nav>
<div id="navigationPopover" class="collapse w-100 d-lg-none" role="dialog" data-toggle="collapse" data-target="#navigationPopover" aria-controls="navigationPopover">
<div class="navbar navbar-dark bg-yw-gradient-primary" onclick="event.stopPropagation();">
<div class="navbar-collapse">
<div class="w-100">
<search-user source="/" type="users" target="user/{0}" id="autosuggest__popover"></search-user>
</div>
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/forum">Forum</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/live">Zeugnisse</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/praystation">Gebetsanliegen</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/groups">Gruppen</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/events">Events</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://styleguide.youthweb.net/components/preview/live">Impulse</a>
</li>
</ul>
<div class="dropdown-divider"></div>
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/blog">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/page/team">Über uns</a>
</li>
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/docs/index.html">Hilfe</a>
</li>
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/page/develop">Develop</a>
</li>
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/page/privacy">Datenschutz</a>
</li>
<li class="nav-item">
<a class="nav-link " href="https://styleguide.youthweb.net/components/preview/page/impressum">Impressum</a>
</li>
</ul>
<div class="dropdown-divider"></div>
<ul class="navbar-nav ">
<li class="nav-item">
<a class="app-notifications nav-link" href="https://www.facebook.com/youthweb.net">
Facebook
</a>
</li>
<li class="nav-item">
<a class="app-notifications nav-link" href="https://www.instagram.com/youthwebnet/">
Instagram
</a>
</li>
<li class="nav-item">
<a class="app-notifications nav-link" href="https://twitter.com/youthwebnet">
Twitter
</a>
</li>
<li class="nav-item">
<a class="app-notifications nav-link" href="https://www.pinterest.de/youthwebnet/">
Pinterest
</a>
</li>
<li class="nav-item">
<a class="app-notifications nav-link" href="https://shop.spreadshirt.de/youthweb">
Shop
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="profilePopover" class="collapse w-100" role="dialog" data-toggle="collapse" data-target="#profilePopover" aria-controls="profilePopover">
<div class="float-right m-2" onclick="event.stopPropagation();">
<div class="card card-profile mb-4 ">
<div class="card-header bg-secondary"></div>
<div class="card-body text-center">
<a href="https://styleguide.youthweb.net/components/preview/users/">
<img class="card-profile-img" src="">
</a>
<h6 class="card-title">
<a class="text-inherit" href="user"></a>
</h6>
<p class="mb-4"></p><!-- Verhältnis zu Lebensmotto? -->
<ul class="card-menu">
<li class="card-menu-item">
<a href="https://styleguide.youthweb.net/components/preview/users//friends" class="text-inherit">
Freunde
<h6 class="my-0"></h6>
</a>
</li>
<li class="card-menu-item">
<a href="https://styleguide.youthweb.net/components/preview/participation/hall-of-fame" class="text-inherit">
CP
<h6 class="my-0"></h6>
</a>
</li>
</ul>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">
<div class="">
<a href="https://styleguide.youthweb.net/components/preview/account/settings" class="btn btn-secondary btn-block"><i class="fas fa-user-cog"></i> Account</a>
<a href="https://styleguide.youthweb.net/components/preview/account/profile_settings" class="btn btn-secondary btn-block"><i class="fas fa-user-circle"></i> Profil</a>
<a href="https://styleguide.youthweb.net/components/preview/account/ignorelist" class="btn btn-secondary btn-block"><i class="fas fa-eye-slash"></i> Ignoreliste</a>
</div>
</li>
<li class="list-group-item"><a href="https://styleguide.youthweb.net/components/preview/logout"><i class="fas fa-sign-out-alt"></i> Logout</a></li>
</ul>
</div>
<div class="card mb-4">
<div class="card-body">
<h6 class="card-title">Über mich<small> · <a href="https://styleguide.youthweb.net/components/preview/users/">Zum Steckbrief</a></small></h6>
<p><i class="fas fa-user"></i> Angemeldet vor 1 Jahr|Angemeldet vor undefined Jahren
</p>
<p>
<i class="fas fa-star"></i> 16.09.2022 (undefined Jahre alt)
</p>
<p>
<i class="fas fa-user-friends"></i> Gruppen: Keine
</p>
</div>
</div>
</div>
</div>
<div class="container pt-4 pb-5">
<div class="row">
<div class="col-lg-3">
</div>
<div class="col-lg-6">
</div>
<div class="d-none d-lg-block d-xl-block col-lg-3">
<div class="card card-profile mb-4 ">
<!-- maxh298: background sollte eher Breitformatbild sein, max. Darstellungshöhe: 149px, maxh298 ist Puffer für 1:2 Verhältnis -->
<div class="card-header bg-secondary" style=""></div>
<div class="card-body text-center">
<a href="https://styleguide.youthweb.net/components/preview/users/">
<img class="card-profile-img" src="">
</a>
<h6 class="card-title">
<a class="text-inherit" href="https://styleguide.youthweb.net/components/preview/users/"></a>
</h6>
<p class="mb-4"></p><!-- Verhältnis zu Lebensmotto? -->
<ul class="card-menu">
<li class="card-menu-item">
<a href="https://styleguide.youthweb.net/components/preview/users//friends" class="text-inherit">
<!--@Frontend Integration: URL aus Profile -->
Freunde
<h6 class="my-0"></h6>
</a>
</li>
<li class="card-menu-item">
<a href="https://styleguide.youthweb.net/components/preview/participation/hall-of-fame" class="text-inherit">
CP
<h6 class="my-0"></h6>
</a>
</li>
</ul>
</div>
</div>
<div class="card mb-4">
<div class="card-body">
<h6 class="card-title">Über mich<small> · <a href="https://styleguide.youthweb.net/components/preview/users/">Zum Steckbrief</a></small></h6>
<p><i class="fas fa-user fa-fw"></i> Angemeldet vor 1 Jahr|Angemeldet vor undefined Jahren
</p>
<p>
<i class="fas fa-star fa-fw"></i> 16.09.2022 (undefined Jahre alt)
</p>
<p>
<i class="fas fa-user-friends fa-fw"></i> Gruppen: Keine
</p>
</div>
</div>
<div class="card mb-4 d-none d-lg-flex">
<div class="card-header">Youthweb</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">
<a href="https://styleguide.youthweb.net/components/preview/blog">Blog</a>
<a href="https://styleguide.youthweb.net/components/preview/page/team">Über uns</a>
<a href="https://styleguide.youthweb.net/components/preview/docs/index.html">Hilfe</a>
<a href="https://styleguide.youthweb.net/components/preview/page/develop">Develop</a>
<a href="https://styleguide.youthweb.net/components/preview/page/privacy">Datenschutz</a>
<a href="https://styleguide.youthweb.net/components/preview/page/impressum">Impressum</a>
</li>
<li class="list-group-item text-center d-none d-lg-flex">
<!---->
<a class="brand-nav" href="https://www.facebook.com/youthweb.net"><i class="fab fa-facebook-f"></i></a>
<a class="brand-nav" href="https://www.instagram.com/youthwebnet/"><i class="fab fa-instagram"></i></a>
<a class="brand-nav" href="https://twitter.com/youthwebnet"><i class="fab fa-twitter"></i></a>
<a class="brand-nav" href="https://www.pinterest.de/youthwebnet/"><i class="fab fa-pinterest-p"></i></a>
<a class="brand-nav" href="https://shop.spreadshirt.de/youthweb"><i class="fas fa-shopping-basket"></i></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../../dist/toolkit.min.js"></script>
</body>
</html>
{% extends '_base.html.twig' %}
{% block body %}
<div id="app">
<div class="with-top-navbar">
<div class="growl" id="app-growl"></div>
<add-friend></add-friend>
<report-user></report-user>
<error-message></error-message>
{% include 'shared/partials/navigation-main.html.twig' %}
{% block header %}{% endblock %}
<div class="container pt-4 pb-5" >
<div class="row">
<div class="col-lg-3">
{% block leftcol %}{% endblock %}
</div>
<div class="col-lg-6">
{% block content %}{% endblock %}
</div>
<div class="d-none d-lg-block d-xl-block col-lg-3">
{% include 'user/partials/profile-cards.html.twig' %}
{% include 'community/partials/youthweb-links.html.twig' %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}
/* No context defined. */
Dieses Layout wird für alle Bereiche verwendet, die nur nach einer Anmeldung sichtbar sind.