Commit 80e83dc3 authored by nirgendswo's avatar nirgendswo

adding elements

parent f5fbb168
/**
* Config for layout
*
*
* @author Björn Hase
*/
$font-family: 'Droid Sans', sans-serif;
$font-family-heading: 'Bangers', cursive;
$font-family-body: 'Roboto', sans-serif;
$primary: #D5484F;
$primary-contrast: white;
$secondary: #999;
$secondary-contrast: #666;
$primary: #587b7f;
$secondary: #d3d0cb;
$background-color: #393e41;
$color: #888;
$background-color: #ddd;
$background-color-contrast: #363A3F;
......@@ -6,17 +6,18 @@
*/
body {
font-family: $font-family;
//background-color: $grey-bg-color;
font-family: $font-family-body;
color: $color;
background-color: $background-color;
}
a {
font-weight: bold;
text-decoration: none;
//color: lighten($purple-color, 10%);
color: $primary;
&:hover {
//color: $dark-color;
color: $color;
}
}
......@@ -37,10 +38,7 @@ figure {
margin: 0;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Oswald', sans-serif;
}
h2 {
font-size: 2em;
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
font-family: $font-family-heading;
}
/**
*
*
*
*
*/
$hutch-border-color: black;
.hutch {
border-top: 1px solid $hutch-border-color;
border-left: 1px solid $hutch-border-color;
&__header {
}
&__content {
}
}
/**
*
*
*
*
*/
$hutch-border-color: #a2a2a2;
.hutch {
border-top: 1px solid $secondary-contrast;
border-left: 1px solid $secondary-contrast;
box-shadow: 10px 10px 0 0 $secondary-contrast;
&__header {
color: $primary-contrast;
background-color: $secondary-contrast;
}
&__content {
background-color: $primary-contrast;
}
}
......@@ -5,8 +5,6 @@
* @author Björn Hase
*/
$site-header-background-color: $background-color;
.site-header {
position: fixed;
top: 0;
......@@ -14,23 +12,25 @@ $site-header-background-color: $background-color;
z-index: 100;
width: 100%;
height: 50px;
background: $site-header-background-color;
background: $background-color-contrast;
color: $secondary;
padding: 15px 10px;
&__icon {
fill: $secondary;
fill: $primary-contrast;
width: 50px;
height: 50px;
}
&__title {
line-height: 2em;
margin: 0 0 0 10px;
color: $primary-contrast;
background: $primary;
@include fontSize(2.4);
}
&__inner {
padding: 15px 10px;
height: 50px;
}
}
......@@ -6,22 +6,30 @@
*
*/
.site-navigation {
&__list {
list-style: none;
margin: 0;
padding: 0;
}
$site-navigation-color--hover: white;
.site-navigation {
line-height: 3.2em;
text-align: right;
&__item {
color: $color;
display: inline-block;
&:hover {
color: $site-navigation-color--hover;
.site-navigation__icon {
color: $site-navigation-color--hover;
}
}
}
&__icon {
fill: white;
fill: $color;
}
&__text {
color: $color;
}
}
......@@ -7,9 +7,7 @@
'elements',
'icon',
'components/badge',
'components/page',
'components/post',
'components/hutch',
'components/content',
'components/form',
'components/button',
......
......@@ -9,7 +9,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/assets/css/styles.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Oswald:700%7CDroid+Sans:400,700" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Bangers%7CRoboto" rel="stylesheet">
</head>
<body>
<!--[if lte IE 9]>
......@@ -17,36 +17,43 @@
<![endif]-->
<header class="site-header">
<svg class="icon site-header__icon --float-left">
<use xlink:href="/assets/svg/icons.svg#fuzzy" />
</svg>
<div class="site-header__title --float-left">
Fuzzy CMS
<div class="site-header__inner">
<svg class="icon site-header__icon --float-left">
<use xlink:href="/assets/svg/icons.svg#fuzzy" />
</svg>
<div class="site-header__title h2 --float-left">
Fuzzy CMS
</div>
@include('FuzzyCms.views.navigation')
</div>
@include('FuzzyCms.views.navigation')
</header>
<div class="grid-wrap">
<main class="site-main">
@section('header')
<div class="site-container">
<div class="hutch">
<div class="hutch__header">
</div>
<main class="site-main">
@section('header')
<div class="grid">
<div class="grid__col-xs-12">
<header class="site-main__header">
<h1 class="site-main__title">
{{ $page->data['title'] }}
</h1>
</header>
</div>
</div>
@show
<div class="grid">
<div class="grid__col-xs-12">
<header class="site-main__header">
<h1 class="site-main__title">
{{ $page->data['title'] }}
</h1>
</header>
</div>
</div>
@show
<div class="grid">
<div class="grid__col-xs-12">
<div class="site-main__entry">
@yield('content')
<div class="site-main__entry">
@yield('content')
</div>
</div>
</div>
</div>
</main>
</main>
</div>
<footer class="site-footer">
<div class="grid">
<div class="grid__col-xs-12">
......
@inject('pageRepository', 'App\PageRepository')
@inject('viewHelper', 'App\ViewHelper')
<nav class="navigation">
<nav class="site-navigation">
@foreach($pageRepository->find(
['type' => 'page', 'exclude' => ['imprint']],
['orderBy' => ['title' => 'desc']]) as $page)
<a class="navigation__item {{ $viewHelper->current($page, 'navigation__item--current') }}"
<a class="site-navigation__item {{ $viewHelper->current($page, 'navigation__item--current') }}"
href="{{ $viewHelper->route($page) }}"
>
<svg class="icon navigation__icon">
<svg class="icon site-navigation__icon">
<use xlink:href="/assets/svg/icons.svg#{{ $page->data['icon'] }}" />
</svg>
<span class="navigation__text">
<span class="site-navigation__text">
{{ $page->data['title'] }}
</span>
</a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment