diff --git a/source/lostplaces/lostplaces_app/static/favicon.ico b/source/lostplaces/lostplaces_app/static/favicon.ico new file mode 100644 index 0000000..9b29a81 Binary files /dev/null and b/source/lostplaces/lostplaces_app/static/favicon.ico differ diff --git a/source/lostplaces/lostplaces_app/static/images/logo.png b/source/lostplaces/lostplaces_app/static/images/logo.png new file mode 100644 index 0000000..b7201c8 Binary files /dev/null and b/source/lostplaces/lostplaces_app/static/images/logo.png differ diff --git a/source/lostplaces/lostplaces_app/static/main.css b/source/lostplaces/lostplaces_app/static/main.css index 34b59ca..45d8ab4 100644 --- a/source/lostplaces/lostplaces_app/static/main.css +++ b/source/lostplaces/lostplaces_app/static/main.css @@ -9,13 +9,21 @@ .LP-Link .LP-Text:hover { color: #C09F80; } +.LP-Link__IconWrapper { + display: inline; } + .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; } + padding-bottom: 0px; + margin-bottom: 0px; } + .LP-Headline--main { + position: relative; + top: 2rem; + font-size: 2rem; } .LP-Headline--inline { display: inline; } @@ -44,7 +52,11 @@ object-fit: contain; } .LP-Content { - padding: 15px; } + padding: 35px; } + +@media (max-width: 1290px) { + .LP-Content { + padding: 15px; } } .LP-TextSection .LP-Text { line-height: 1.4rem; } @@ -86,9 +98,10 @@ padding: 0; margin: 0; } .LP-SecurityMeasure__List .LP-SecurityMeasure__Item { - margin: 0 5px; - padding: 5px 8px; - background-color: #D7CEC7; } + margin: 0 8px; + padding: 8px 14px; + background-color: #D7CEC7; + border-radius: 2px; } .LP-SecurityMeasure__List .LP-SecurityMeasure__Item .LP-Text { font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 1.2rem; } @@ -179,33 +192,111 @@ height: 168px; width: 280px; } +.LP-LinkList__List { + list-style-type: none; + display: grid; + grid-template-columns: repeat(auto-fit, 300px); + margin: 0; + padding: 0; } + .LP-LinkList__List .LP-LinkList__Item { + border-left: 1px solid #C09F80; + width: 100%; + margin-top: 12px; + height: 55px; } + .LP-LinkList__List .LP-LinkList__Item .LP-Link { + padding: 1em 0 1em 1em; + width: calc(100% - $-link-padding); + display: block; + color: #565656; } + .LP-LinkList__List .LP-LinkList__Item .LP-Link--iconized { + padding-top: 0; + padding-bottom: 1.1em; } + .LP-LinkList__List .LP-LinkList__Item .LP-Link--iconized:hover { + background-color: #ccc !important; } + .LP-LinkList__List .LP-LinkList__Item .LP-Link:hover { + background-color: #f9f9f9; + color: #76323F; } + .LP-LinkList__List .LP-LinkList__Item .LP-Link .LP-Text { + color: inherit; } + +.LP-Link__Icon { + width: 2em; + height: 2em; + fill: #76323F; + line-height: 5em; } + +.LP-LinkList__Item .LP-Link__Icon { + position: relative; + top: .7em; + margin-right: .6em; } + +.LP-Footer { + margin-top: 75px; + width: 100%; + background-color: #565656; + padding: 25px; } + .LP-Footer .LP-LinkList__List { + display: flex; + align-items: center; + justify-content: center; } + .LP-Footer .LP-LinkList__List .LP-LinkList__Item { + border: none; + padding: 5px; + width: auto; } + .LP-Footer .LP-LinkList__List .LP-LinkList__Item .LP-Text { + color: #f9f9f9; + font-size: 17px; } + .LP-Footer .LP-LinkList__List .LP-LinkList__Item .LP-Link { + display: inline; } + .LP-Footer .LP-LinkList__List .LP-LinkList__Item .LP-Link:hover { + background-color: inherit; } + .LP-MainContainer { margin: 0 auto; max-width: 1280px; } -.LP-PlaceOverview .LP-PlaceOverview__Info { - margin-bottom: 40px; } - .LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOveriew__Image { - width: 600px; - height: 400px; - box-shadow: 0 0 10px #565656; - object-fit: cover; - float: right; - margin-left: 35px; - margin-bottom: 35px; } - .LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOverView__Description { - padding: 0 25px; - position: relative; - top: -15px; } +.LP-HorizontalLine { + color: #565656; } + +.LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOveriew__Image { + width: 700px; + height: 450px; + box-shadow: 0 0 10px #565656; + object-fit: cover; + float: right; + margin-left: 35px; + margin-bottom: 35px; } + +.LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOverView__Description { + padding: 0px; + position: relative; + top: -15px; } .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; } + display: grid; + grid-template-columns: repeat(auto-fit, 300px); + margin: 0px; + padding: 0px; } + .LP-PlaceOverview .LP-PlaceOverView__ImageList .LP-PlaceOverView__ImageItem img { + box-shadow: 0 0 5px #565656; + height: 200px; + width: 290px; + object-fit: cover; + margin-top: 10px; } + +@media (max-width: 1290px) { + .LP-PlaceOverview .LP-PlaceOverview__Info .LP-TextSection { + margin-top: -100px; } + .LP-PlaceOverview .LP-PlaceOverview__Info .LP-Headline { + position: relative; + top: -400px; + margin-bottom: 100px; + width: 100vw; + display: block; } + .LP-PlaceOverview .LP-PlaceOverview__Info .LP-PlaceOveriew__Image { + float: none; + width: calc(100vw - 30px); + margin: 0; + padding: 0; + margin-left: 7px; } } diff --git a/source/lostplaces/lostplaces_app/templates/global.html b/source/lostplaces/lostplaces_app/templates/global.html index e0e3439..dfde7a3 100644 --- a/source/lostplaces/lostplaces_app/templates/global.html +++ b/source/lostplaces/lostplaces_app/templates/global.html @@ -5,12 +5,19 @@ - Preview + + + {% if title%} + {{title}}|UrbEx + {% else %} + Urban Exploration + {% endif %} +
diff --git a/source/lostplaces/lostplaces_app/templates/placeOverview.html b/source/lostplaces/lostplaces_app/templates/placeOverview.html index 3b3206f..5534413 100644 --- a/source/lostplaces/lostplaces_app/templates/placeOverview.html +++ b/source/lostplaces/lostplaces_app/templates/placeOverview.html @@ -1,28 +1,23 @@ {% extends 'global.html'%} +{% load static %} {% block maincontent %} +
- -
- -
-
-

{{place.name}}

-

{{place.description}}

-
-
-
- -
- Google Maps - TIM Online (GER/NRW Only) - Open Street Map +
+ +
+
+

{{place.name}}

+

{{place.description}}

+
- -
-

Sicherheitsmaßnahmen

+
+
+

Sicherheitsmaßnahmen

+
  • Kameras
  • Zaun
  • @@ -30,32 +25,50 @@
  • Alarmanlage
  • Selbstschussanlage
-
- -
    -
  • - -
  • -
  • - -
  • -
  • - -
  • -
  • - -
  • -
  • - -
  • -
  • - -
  • -
- -

Lade deine Bilder hoch

-
- -
+
+ + +
+

Bilder

+
+
    +
  • + +
  • +
  • + +
  • +
  • + +
  • +
  • + +
  • +
  • + +
  • +
  • + +
  • +
+
+
+
{% endblock maincontent %} \ No newline at end of file