Ja...
This commit is contained in:
commit
875cf06dd1
|
|
@ -0,0 +1,126 @@
|
|||
|
||||
# Created by https://www.toptal.com/developers/gitignore/api/visualstudiocode,node
|
||||
# Edit at https://www.toptal.com/developers/gitignore?templates=visualstudiocode,node
|
||||
|
||||
### Node ###
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
lerna-debug.log*
|
||||
|
||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# TypeScript v1 declaration files
|
||||
typings/
|
||||
|
||||
# TypeScript cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Microbundle cache
|
||||
.rpt2_cache/
|
||||
.rts2_cache_cjs/
|
||||
.rts2_cache_es/
|
||||
.rts2_cache_umd/
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variables file
|
||||
.env
|
||||
.env.test
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
|
||||
# Next.js build output
|
||||
.next
|
||||
|
||||
# Nuxt.js build / generate output
|
||||
.nuxt
|
||||
dist
|
||||
|
||||
# Gatsby files
|
||||
.cache/
|
||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||
# public
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# Serverless directories
|
||||
.serverless/
|
||||
|
||||
# FuseBox cache
|
||||
.fusebox/
|
||||
|
||||
# DynamoDB Local files
|
||||
.dynamodb/
|
||||
|
||||
# TernJS port file
|
||||
.tern-port
|
||||
|
||||
# Stores VSCode versions used for testing VSCode extensions
|
||||
.vscode-test
|
||||
|
||||
### VisualStudioCode ###
|
||||
.vscode/*
|
||||
!.vscode/settings.json
|
||||
!.vscode/tasks.json
|
||||
!.vscode/launch.json
|
||||
!.vscode/extensions.json
|
||||
*.code-workspace
|
||||
|
||||
### VisualStudioCode Patch ###
|
||||
# Ignore all local history of files
|
||||
.history
|
||||
|
||||
# End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,node
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"git.ignoreLimitWarning": true
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@import 'link/link';
|
||||
@import 'headline/headline';
|
||||
@import 'text/text';
|
||||
@import 'icon/icon';
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.LP-Headline{
|
||||
font-family: $-primary-sans-serif-font;
|
||||
color: $-secondary-color;
|
||||
font-size: 1.7rem;
|
||||
padding-top: 0px;
|
||||
margin-top: 0px;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"context": {
|
||||
"headline": "Hello here is my headline"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<h1 class="LP-Headline">{{headline}}</h1>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
.LP-Icon{
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.LP-Icon__List{
|
||||
list-style-type: none;
|
||||
display: inline-flex;
|
||||
justify-content: space-between;
|
||||
justify-items: stretch;
|
||||
|
||||
.LP-Icon__Item{
|
||||
padding: 0 3px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<img class="LP-Icon" src="/icons/favourite.svg"/>
|
||||
|
||||
<ul class="LP-Icon__List">
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/favourite.svg"/></li>
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/location.svg"/></li>
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/flag.svg"/></li>
|
||||
</ul>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.LP-Link {
|
||||
color: $-secondary-color;
|
||||
text-decoration: none;
|
||||
font-family: $-primary-accent-font;
|
||||
&:hover {
|
||||
color: $-secondary-accent-color;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"context": {
|
||||
"url": "#",
|
||||
"text": "Click Me"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<a href="{{url}}" class="LP-Link"><span class="LP-Link__Text">{{text}}</span></a>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
.LP-Text {
|
||||
color: black;
|
||||
font-family: $-primary-serif-font;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"context": {
|
||||
"text": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<p class="LP-Text">{{text}}</p>
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@import 'logo/logo';
|
||||
@import 'textSection/textSection';
|
||||
@import 'place/place';
|
||||
@import 'securityMeasureList/securityMeasureList';
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
.LP-Logo {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<a href="LP-Link" href="#">
|
||||
<img class="LP-Logo" src="https://99designs-blog.imgix.net/blog/wp-content/uploads/2016/07/logo-2.png?auto=format&q=60&fit=max&w=930"/>
|
||||
</a>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
.LP-Place{
|
||||
width: 280px;
|
||||
height: 235px;
|
||||
.LP-Place__Image{
|
||||
width: 100%;
|
||||
height: 165px;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.LP-Place__Assets{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.8rem;
|
||||
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.LP-Place__Info{
|
||||
|
||||
.LP-Place__Title{
|
||||
font-family: $-primary-sans-serif-font;
|
||||
color: $-secondary-color;
|
||||
font-size: 1rem;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.LP-Place__Detail{
|
||||
font-family: $-primary-sans-serif-font;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-top: 5px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"context": {
|
||||
"image": "/images/photo_2020-05-02_18-11-21.jpg",
|
||||
"title": "Kokerei Wiescherhöfen",
|
||||
"location": "Hamm (Westfalen)"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<article class="LP-Place">
|
||||
<img class="LP-Place__Image" src="{{image}}"/>
|
||||
<div class="LP-Place__Assets">
|
||||
<div class="LP-Place__Info">
|
||||
<h3 class="LP-Place__Title">{{title}}</h3>
|
||||
<p class="LP-Place__Detail" >{{location}}</p>
|
||||
</div>
|
||||
<ul class="LP-Icon__List">
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/favourite.svg"/></li>
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/location.svg"/></li>
|
||||
<li class="LP-Icon__Item"><img class="LP-Icon" src="/icons/flag.svg"/></li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.LP-SecurityMeasure__List{
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
padding:0;
|
||||
margin: 0;
|
||||
|
||||
.LP-SecurityMeasure__Item{
|
||||
margin: 0 5px;
|
||||
padding: 5px 8px;
|
||||
background-color: #D7CEC7;
|
||||
.LP-Text{
|
||||
font-family: $-primary-sans-serif-font;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<ul class="LP-SecurityMeasure__List">
|
||||
<li class="LP-SecurityMeasure__Item"><span class="LP-Text">Kameras</span></li>
|
||||
<li class="LP-SecurityMeasure__Item"><span class="LP-Text">Zaun</span></li>
|
||||
<li class="LP-SecurityMeasure__Item"><span class="LP-Text">Wachhund</span></li>
|
||||
<li class="LP-SecurityMeasure__Item"><span class="LP-Text">Alarmanlage</span></li>
|
||||
<li class="LP-SecurityMeasure__Item"><span class="LP-Text">Selbstschussanlage</span></li>
|
||||
</ul>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
.LP-Content{
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.LP-TextSection{
|
||||
|
||||
.LP-Text {
|
||||
line-height: 1.4rem;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
<article class="LP-TextSection LP-Content">
|
||||
{{> @headline headline=headline}}
|
||||
{{> @text text=text}}
|
||||
</article>
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@import 'header/header';
|
||||
@import 'navigation/navigation';
|
||||
@import 'introduction/introduction';
|
||||
@import 'placeGrid/placeGrid';
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.LP-Header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 70px;
|
||||
|
||||
&__Logo {
|
||||
max-width: 300px;
|
||||
width: 35%;
|
||||
object-fit:contain;
|
||||
}
|
||||
|
||||
.LP-Header__Navigation{
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<header class="LP-Header">
|
||||
<div class="LP-Header__Logo">
|
||||
{{render '@logo'}}
|
||||
</div>
|
||||
<div class="LP-Header__Navigation">
|
||||
{{> @navigation}}
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
.LP-Introduction{
|
||||
|
||||
.LP-Headline{
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.LP-Text{
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"context": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
|
||||
<div class="LP-Introduction">
|
||||
{{> @textsection headline='Welcome to the urban exploring registry' text='Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.'}}
|
||||
</div>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
.LP-Menu{
|
||||
&__List {
|
||||
list-style-type: none;
|
||||
display: inline-flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
&__Item {
|
||||
padding: 10px 15px;
|
||||
margin: 0 15px;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.LP-Link__Text {
|
||||
color: $-secondary-color;
|
||||
font-weight: bold;
|
||||
text-shadow: 0px 0px 20px white;
|
||||
&:hover{
|
||||
color: $-primary-accent-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<nav class="LP-Menu">
|
||||
<ul class="LP-Menu__List">
|
||||
<li class="LP-Menu__Item">{{> @link text='Home'}}</li>
|
||||
<li class="LP-Menu__Item">{{> @link text='About'}}</li>
|
||||
<li class="LP-Menu__Item">{{> @link text='Contact'}}</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
.LP-Place__Grid{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.LP-Place__Item{
|
||||
margin: 0 15px;
|
||||
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<div class="LP-Content">
|
||||
{{> @headline headline='Explorere the latest locations'}}
|
||||
<ul class="LP-Place__Grid">
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/photo_2020-04-09_18-27-13.jpg' title='Haus Maikotten' location='Münster (westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_11-03-07.png' title='Kokerei in Hamm' location='Hamm (westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_20-15-00.png' title='Noch ein Zementwerk' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/photo_2020-05-02_18-11-21.jpg' title='Zementwerk Mersmann' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_20-15-00.png' title='Noch ein Zementwerk' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/photo_2020-04-09_18-27-13.jpg' title='Haus Maikotten' location='Münster (westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_20-15-00.png' title='Noch ein Zementwerk' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/photo_2020-05-02_18-11-21.jpg' title='Zementwerk Mersmann' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_20-15-00.png' title='Noch ein Zementwerk' location='Beckum (Westfalen)' }}
|
||||
</li>
|
||||
<li class="LP-Place__Item">
|
||||
{{> @place image='/images/Bildschirmfoto_von_2020-07-13_11-03-07.png' title='Kokerei in Hamm' location='Hamm (westfalen)' }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
@import 'home/home';
|
||||
@import 'placeOverview/placeOverview';
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
.LP-MainContainer {
|
||||
margin: 0 auto;
|
||||
max-width: 1280px;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
|
||||
{{> @introduction}}
|
||||
{{> @placegrid}}
|
||||
|
||||
Icons made by <a class="LP-Link" href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon"> www.flaticon.com</a>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
.LP-PlaceOverview{
|
||||
.LP-PlaceOverview__Info{
|
||||
display: flex;
|
||||
margin-bottom: 40px;
|
||||
|
||||
.LP-PlaceOveriew__Image{
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
box-shadow: 0 0 10px $-secondary-color;
|
||||
object-fit: cover;
|
||||
}
|
||||
.LP-PlaceOverView__Description{
|
||||
padding: 0 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.LP-PlaceOverView__ImageList{
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.LP-PlaceOverView__ImageItem{
|
||||
padding: 15px;
|
||||
img {
|
||||
box-shadow: 0 0 5px $-secondary-color;
|
||||
height: 200px;
|
||||
width: 300px;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
{}
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<article class="LP-PlaceOverview">
|
||||
<div class="LP-PlaceOverview__Info">
|
||||
<img class="LP-PlaceOveriew__Image" src="/images/Bildschirmfoto_von_2020-07-13_20-15-00.png">
|
||||
<article class="LP-PlaceOverView__Description">
|
||||
{{> @textsection headline='Kokerei Wiescherhöfen' text='Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.'}}
|
||||
</article>
|
||||
</div>
|
||||
<article>
|
||||
{{> @headline headline='Sicherheitsmaßnahmen'}}
|
||||
{{> @securitymeasurelist}}
|
||||
</article>
|
||||
<ul class="LP-PlaceOverView__ImageList">
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/Bildschirmfoto_von_2020-07-13_11-03-07.png"></a>
|
||||
</li>
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/photo_2020-05-02_18-11-21.jpg"></a>
|
||||
</li>
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/Bildschirmfoto_von_2020-07-13_11-03-07.png"></a>
|
||||
</li>
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/Bildschirmfoto_von_2020-07-13_20-15-00.png"></a>
|
||||
</li>
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/Bildschirmfoto_von_2020-07-13_11-03-07.png"></a>
|
||||
</li>
|
||||
<li class="LP-PlaceOverView__ImageItem">
|
||||
<a href="#"><img src="/images/photo_2020-05-02_18-11-21.jpg"></a>
|
||||
</li>
|
||||
</ul>
|
||||
{{> @headline headline='Lade deine Bilder hoch'}}
|
||||
<form>
|
||||
<input type="file"/>
|
||||
</form>
|
||||
</article>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="{{ path '/components.css' }}">
|
||||
<title>Preview</title>
|
||||
</head>
|
||||
<body>
|
||||
{{> @header}}
|
||||
<article class="LP-MainContainer">{{{ yield }}}</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
$-primary-color: #D7CEC7;
|
||||
$-secondary-color: #565656;
|
||||
$-primary-accent-color: #76323F;
|
||||
$-secondary-accent-color: #C09F80;
|
||||
|
||||
$-primary-sans-serif-font: "Trebuchet MS", Helvetica, sans-serif;
|
||||
$-primary-serif-font: "Times New Roman", Times, serif;
|
||||
$-primary-accent-font: Tahoma, 'sans-serif';
|
||||
|
||||
@import '01_Atoms/atoms';
|
||||
@import '02_Molecules/molecules';
|
||||
@import '03_Organisms/organisms';
|
||||
@import '04_Templates/templates';
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
'use strict';
|
||||
|
||||
/*
|
||||
* Require the path module
|
||||
*/
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
|
||||
/*
|
||||
* Require the Fractal module
|
||||
*/
|
||||
const fractal = module.exports = require('@frctl/fractal').create();
|
||||
|
||||
/*
|
||||
* Give your project a title.
|
||||
*/
|
||||
fractal.set('project.title', 'lostplaces');
|
||||
|
||||
/*
|
||||
* Tell Fractal where to look for components.
|
||||
*/
|
||||
fractal.components.set('path', path.join(__dirname, 'components'));
|
||||
|
||||
/*
|
||||
* Tell Fractal where to look for documentation pages.
|
||||
*/
|
||||
fractal.docs.set('path', path.join(__dirname, 'docs'));
|
||||
|
||||
/*
|
||||
* Tell the Fractal web preview plugin where to look for static assets.
|
||||
*/
|
||||
fractal.web.set('static.path', path.join(__dirname, 'public'));
|
||||
|
||||
/**
|
||||
* Default preview
|
||||
*/
|
||||
fractal.components.set('default.preview', '@preview');
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,13 @@
|
|||
{
|
||||
"name": "communitea",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"@frctl/fractal": "^1.2.1",
|
||||
"node-sass": "^4.13.1"
|
||||
},
|
||||
"scripts": {
|
||||
"sass": "node-sass -w components/components.scss -o public/ --recursive",
|
||||
"styleguide": "fractal start --sync",
|
||||
"suite": "npm run sass & npm run styleguide"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,155 @@
|
|||
.LP-Link {
|
||||
color: #565656;
|
||||
text-decoration: none;
|
||||
font-family: Tahoma, "sans-serif"; }
|
||||
.LP-Link:hover {
|
||||
color: #C09F80; }
|
||||
|
||||
.LP-Headline {
|
||||
font-family: "Trebuchet MS", Helvetica, sans-serif;
|
||||
color: #565656;
|
||||
font-size: 1.7rem;
|
||||
padding-top: 0px;
|
||||
margin-top: 0px;
|
||||
padding-bottom: 0.2rem; }
|
||||
|
||||
.LP-Text {
|
||||
color: black;
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
font-size: 1.2rem; }
|
||||
|
||||
.LP-Icon {
|
||||
height: 20px;
|
||||
width: 20px; }
|
||||
|
||||
.LP-Icon__List {
|
||||
list-style-type: none;
|
||||
display: inline-flex;
|
||||
justify-content: space-between;
|
||||
justify-items: stretch; }
|
||||
.LP-Icon__List .LP-Icon__Item {
|
||||
padding: 0 3px; }
|
||||
|
||||
.LP-Logo {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: auto;
|
||||
object-fit: contain; }
|
||||
|
||||
.LP-Content {
|
||||
padding: 15px; }
|
||||
|
||||
.LP-TextSection .LP-Text {
|
||||
line-height: 1.4rem; }
|
||||
|
||||
.LP-Place {
|
||||
width: 280px;
|
||||
height: 235px; }
|
||||
.LP-Place .LP-Place__Image {
|
||||
width: 100%;
|
||||
height: 165px;
|
||||
object-fit: fill; }
|
||||
.LP-Place .LP-Place__Assets {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 0.8rem;
|
||||
padding: 0 10px; }
|
||||
.LP-Place .LP-Place__Info .LP-Place__Title {
|
||||
font-family: "Trebuchet MS", Helvetica, sans-serif;
|
||||
color: #565656;
|
||||
font-size: 1rem;
|
||||
padding: 0px;
|
||||
margin: 0px; }
|
||||
.LP-Place .LP-Place__Info .LP-Place__Detail {
|
||||
font-family: "Trebuchet MS", Helvetica, sans-serif;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-top: 5px;
|
||||
font-size: 0.9rem; }
|
||||
|
||||
.LP-SecurityMeasure__List {
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
padding: 0;
|
||||
margin: 0; }
|
||||
.LP-SecurityMeasure__List .LP-SecurityMeasure__Item {
|
||||
margin: 0 5px;
|
||||
padding: 5px 8px;
|
||||
background-color: #D7CEC7; }
|
||||
.LP-SecurityMeasure__List .LP-SecurityMeasure__Item .LP-Text {
|
||||
font-family: "Trebuchet MS", Helvetica, sans-serif;
|
||||
font-size: 1.2rem; }
|
||||
|
||||
.LP-Header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 70px; }
|
||||
.LP-Header__Logo {
|
||||
max-width: 300px;
|
||||
width: 35%;
|
||||
object-fit: contain; }
|
||||
|
||||
.LP-Menu__List {
|
||||
list-style-type: none;
|
||||
display: inline-flex;
|
||||
justify-content: space-around; }
|
||||
|
||||
.LP-Menu__Item {
|
||||
padding: 10px 15px;
|
||||
margin: 0 15px;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
background-color: transparent; }
|
||||
|
||||
.LP-Menu .LP-Link__Text {
|
||||
color: #565656;
|
||||
font-weight: bold;
|
||||
text-shadow: 0px 0px 20px white; }
|
||||
.LP-Menu .LP-Link__Text:hover {
|
||||
color: #76323F; }
|
||||
|
||||
.LP-Introduction .LP-Headline {
|
||||
font-size: 2rem; }
|
||||
|
||||
.LP-Introduction .LP-Text {
|
||||
font-size: 1.3rem; }
|
||||
|
||||
.LP-Place__Grid {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap; }
|
||||
.LP-Place__Grid .LP-Place__Item {
|
||||
margin: 0 15px;
|
||||
margin-bottom: 50px; }
|
||||
|
||||
.LP-MainContainer {
|
||||
margin: 0 auto;
|
||||
max-width: 1280px; }
|
||||
|
||||
.LP-PlaceOverview .LP-PlaceOverview__Info {
|
||||
display: flex;
|
||||
margin-bottom: 40px; }
|
||||
.LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOveriew__Image {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
box-shadow: 0 0 10px #565656;
|
||||
object-fit: cover; }
|
||||
.LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOverView__Description {
|
||||
padding: 0 25px; }
|
||||
|
||||
.LP-PlaceOverview .LP-PlaceOverView__ImageList {
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap; }
|
||||
.LP-PlaceOverview .LP-PlaceOverView__ImageList .LP-PlaceOverView__ImageItem {
|
||||
padding: 15px; }
|
||||
.LP-PlaceOverview .LP-PlaceOverView__ImageList .LP-PlaceOverView__ImageItem img {
|
||||
box-shadow: 0 0 5px #565656;
|
||||
height: 200px;
|
||||
width: 300px;
|
||||
object-fit: cover; }
|
||||
|
|
@ -0,0 +1 @@
|
|||
<svg id="Capa_1" enable-background="new 0 0 512.07 512.07" height="512" viewBox="0 0 512.07 512.07" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m509.759 194.639c-6.152-18.858-22.945-31.043-42.781-31.043h-127.918l-40.282-122.33c-6.192-18.805-22.95-30.926-42.729-30.926-.063 0-.128 0-.191.001-19.86.078-36.611 12.349-42.674 31.262l-39.108 121.993h-128.983c-19.886 0-36.692 12.226-42.814 31.146-6.123 18.92.335 38.674 16.453 50.324l104.361 75.434-40.17 121.991c-6.217 18.88.133 38.662 16.177 50.396 8.058 5.894 17.307 8.842 26.562 8.842 9.171-.001 18.347-2.897 26.365-8.693l104.542-75.563 103.3 75.436c16.026 11.704 36.781 11.76 52.873.147s22.575-31.328 16.518-50.227l-39.218-122.329 103.474-75.563c16.02-11.698 22.396-31.441 16.243-50.298zm-33.935 26.07-120.959 88.332 45.825 142.946c3.085 9.621-3.435 15.247-5.506 16.742s-9.465 5.91-17.625-.05l-120.901-88.289-122.206 88.333c-8.201 5.927-15.576 1.461-17.642-.05-2.065-1.511-8.558-7.187-5.392-16.8l47.033-142.833-122.145-88.287c-8.206-5.932-6.272-14.34-5.484-16.775s4.146-10.382 14.271-10.382h150.87l45.79-142.835c3.087-9.629 11.668-10.41 14.225-10.421h.052c2.62 0 11.113.769 14.255 10.309l47.07 142.947h149.624c10.1 0 13.469 7.92 14.261 10.348s2.74 10.81-5.416 16.765z"/></g></svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m512 165v-15h-166v-30c0-33.084-26.916-60-60-60h-196v-60h-90v512h90v-150h136v30c0 33.084 26.916 60 60 60h226v-15c0-37.162-8.647-56.762-16.276-74.055-7.365-16.691-13.724-31.107-13.724-61.945s6.359-45.254 13.724-61.945c7.629-17.293 16.276-36.893 16.276-74.055zm-452 317h-30v-452h30zm30-392h196c16.542 0 30 13.458 30 30v220.072c-8.833-5.123-19.075-8.072-30-8.072h-196zm166 302v-30h30c16.542 0 30 13.458 30 30s-13.458 30-30 30-30-13.458-30-30zm212.276-16.945c6.054 13.723 11.43 25.908 13.15 46.945h-143.498c5.123-8.833 8.072-19.075 8.072-30v-212h135.427c-1.721 21.037-7.097 33.223-13.15 46.945-7.63 17.293-16.277 36.893-16.277 74.055s8.647 56.762 16.276 74.055z"/></g></svg>
|
||||
|
After Width: | Height: | Size: 816 B |
|
|
@ -0,0 +1 @@
|
|||
<svg id="Capa_1" enable-background="new 0 0 511 511" height="512" viewBox="0 0 511 511" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m255.5 59c-91.533 0-166 74.468-166 166s74.467 166 166 166 166-74.468 166-166-74.467-166-166-166zm0 302c-74.991 0-136-61.01-136-136s61.009-136 136-136 136 61.01 136 136-61.009 136-136 136z"/><path d="m415.306 66.193c-42.685-42.685-99.439-66.193-159.806-66.193s-117.121 23.508-159.806 66.193c-42.686 42.687-66.194 99.44-66.194 159.807 0 106.499 74.454 198.443 177.887 220.849l48.113 64.151 48.114-64.152c103.432-22.406 177.886-114.349 177.886-220.848 0-60.367-23.508-117.12-66.194-159.807zm-123.064 352.355-5.716 1.083-31.026 41.369-31.026-41.368-5.716-1.083c-92.28-17.495-159.258-98.474-159.258-192.549 0-108.075 87.925-196 196-196s196 87.925 196 196c0 94.074-66.978 175.053-159.258 192.548z"/></g></svg>
|
||||
|
After Width: | Height: | Size: 850 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 259 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 138 KiB |
Loading…
Reference in New Issue