design progress, add xs logo
This commit is contained in:
elisejakob committed
1 parent
eb7fd96b2d
commit
4a278ef2ad
11 files changed
+105
-47
No files matched your search
@@ -181,8 +181,8 @@ const EventList = props => {
|
||||
)}
|
||||
{showMore && (
|
||||
<div className="show-more">
|
||||
<Link to="/program/" className="button">
|
||||
Vis alle
|
||||
<Link to="/program/" className="button button-large">
|
||||
<span>Se alle arrangementer</span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from 'react'
|
||||
import { Link } from 'gatsby'
|
||||
import logo from '../img/logo/logo-s.svg'
|
||||
import logo from '../img/logo/logo-xs.svg'
|
||||
|
||||
export default class Navbar extends React.Component {
|
||||
constructor(props) {
|
||||
|
||||
@@ -39,8 +39,8 @@ export default class PostList extends React.Component {
|
||||
</div>
|
||||
{showMore && (
|
||||
<div className="show-more">
|
||||
<Link to="/nyheter/" className="button">
|
||||
Vis alle
|
||||
<Link to="/nyheter/" className="button button-large">
|
||||
<span>Se alle nyheter</span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
||||
+28
-3
@@ -20,6 +20,10 @@ body {
|
||||
font-family: $sans-serif;
|
||||
line-height: 1.6;
|
||||
letter-spacing: 0.02rem;
|
||||
|
||||
&:focus {
|
||||
outline-color: $color-orange;
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
@@ -94,12 +98,33 @@ button, .button {
|
||||
border: 2px solid $color-orange;
|
||||
background: $color-orange;
|
||||
padding: 0.2rem 2rem;
|
||||
margin: 0 .5rem 1rem;
|
||||
margin: 0 auto 1rem;
|
||||
width: 100%;
|
||||
max-width: $width-m;
|
||||
transition: all .2s ease-in-out;
|
||||
|
||||
&:hover {
|
||||
color: $color-orange;
|
||||
background: transparent;
|
||||
color: $color-black;
|
||||
}
|
||||
|
||||
&-large {
|
||||
padding: 2px;
|
||||
position: relative;
|
||||
background: $color-orange;
|
||||
border: 2px solid $color-orange;
|
||||
|
||||
color: $color-black;
|
||||
transition: all .1s ease-in-out;
|
||||
&:hover {
|
||||
transition: all .16s ease-in-out;
|
||||
background: transparent;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: .5rem 2rem;
|
||||
background: $color-orange;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
+10
-1
@@ -28,7 +28,7 @@
|
||||
text-align: left;
|
||||
border-bottom: 2px solid $color-yellow;
|
||||
color: $color-yellow;
|
||||
margin: 0 1.5rem 0.5rem;
|
||||
margin: 0 1.5rem 1rem;
|
||||
padding: 0.4rem 2rem 0.4rem 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
@@ -315,6 +315,10 @@
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.event-organizers {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.event-links {
|
||||
@@ -378,6 +382,7 @@
|
||||
}
|
||||
@media (max-width: $media-s) {
|
||||
display: block;
|
||||
margin-bottom: 1rem;
|
||||
.event-link {
|
||||
width: 100%;
|
||||
margin-bottom: 0.5rem;
|
||||
@@ -399,11 +404,15 @@
|
||||
&-read-more {
|
||||
a {
|
||||
display: block;
|
||||
margin-top: .5rem;
|
||||
width: 100%;
|
||||
color: $color-orange;
|
||||
text-decoration: underline;
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
&:hover {
|
||||
color: $color-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+15
-7
@@ -1,9 +1,10 @@
|
||||
.site-header {
|
||||
padding: 0.6rem 1rem;
|
||||
padding: 0;
|
||||
background: $color-black;
|
||||
color: $color-white;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@@ -12,10 +13,16 @@
|
||||
z-index: 9002;
|
||||
|
||||
.logo {
|
||||
width: 2rem;
|
||||
height: 1rem;
|
||||
margin: 0 3rem;
|
||||
margin-top: -0.35rem;
|
||||
width: 3.2rem;
|
||||
height: 2.5rem;
|
||||
position: relative;
|
||||
margin: 0 1.2rem;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 3.6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,6 +32,7 @@
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
padding: 0.6rem 1rem;
|
||||
&:last-of-type {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
@@ -67,7 +75,7 @@
|
||||
&_toggle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 1rem;
|
||||
font-size: 2rem;
|
||||
line-height: 1;
|
||||
|
||||
@@ -88,7 +96,7 @@
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -88,4 +88,8 @@
|
||||
.instagram-media {
|
||||
margin: 1rem auto 2rem !important;
|
||||
}
|
||||
|
||||
@media (max-width: $media-s) {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="1144px" height="742px" viewBox="0 0 1144 742" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 56.3 (81716) - https://sketch.com -->
|
||||
<title>logo-xs</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g id="logo-xs" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<path d="M553.187775,92.0807633 C553.466441,92.2814027 553.73396,92.4486022 553.990333,92.6603882 C555.829527,93.9533975 557.501522,95.6699789 559.36301,97.1413343 C561.213351,98.757596 562.952225,100.585644 564.769126,102.380251 C566.429974,104.342059 568.380635,106.0252 569.907724,108.14306 C571.568572,110.149454 573.2963,112.077822 574.789949,114.240268 C576.272451,116.346982 578.055912,118.219616 579.348921,120.370916 C580.686517,122.499923 582.235899,124.39485 583.473175,126.334364 C584.654718,128.340758 585.981167,130.179952 587.118124,131.87424 C589.458917,135.262817 591.164351,138.328141 592.69144,140.323388 C594.107062,142.396661 595.00994,143.544764 595.00994,143.544764 C595.00994,143.544764 594.998793,142.084556 594.708981,139.58771 C594.329995,137.124304 594.073622,133.445916 592.814053,129.355102 C591.710536,125.163968 590.016248,120.370916 587.575136,115.510984 C586.415886,113.025285 584.933384,110.573026 583.361709,108.165354 C581.979526,105.657361 579.995426,103.428035 578.156232,101.120682 C576.361624,98.7687426 574.110004,96.7957887 571.992144,94.7671017 C569.851991,92.816441 567.444318,91.1667394 565.159258,89.5504778 C564.111475,88.8928265 563.063692,88.302055 561.993615,87.7112834 C578.323431,80.9229844 618.272961,73.0980486 684.684596,113.326244 C684.684596,113.326244 715.326688,125.442634 731.232932,165.113498 C731.232932,165.113498 732.146956,165.481337 733.685191,166.161281 C752.757079,166.116695 775.707995,166.863519 801.724235,170.742547 C815.222806,172.793527 829.501642,175.713945 844.226343,180.239478 C858.939898,184.79845 874.088171,191.062858 888.69026,200.214243 C903.147442,209.399068 916.902386,222.017055 926.555369,238.346872 C936.375552,254.609808 941.436123,274.172148 942.160654,294.068886 C942.807159,314.021358 939.418583,334.174469 933.96788,353.948595 C931.058609,363.791071 927.881819,373.666987 924.03623,383.308824 C920.313255,392.772315 916.567987,402.369565 912.778132,412.022549 C905.410208,431.261636 898.577322,450.991175 892.981713,471.233459 C887.39725,491.45345 882.949744,512.253066 881.745908,532.985802 C881.288896,540.877618 881.444949,548.802873 882.236359,556.494049 C894.698294,556.873035 904.70797,567.04991 904.70797,579.589871 C904.70797,585.809692 902.166538,591.472181 898.15375,595.618729 C899.714279,596.543899 901.285954,597.502509 902.969095,598.416533 C912.989918,603.934116 925.830838,609.35138 941.335804,612.751102 C949.082713,614.57915 957.442687,615.67152 966.460313,617.187462 C975.589405,618.792577 984.941429,621.06649 994.616706,624.154107 C1013.8335,630.429661 1034.06464,639.960032 1052.59034,654.4618 C1068.40741,666.890295 1083.14326,683.309285 1092.65134,703.473542 C1098.55905,712.190209 1103.53045,721.475353 1107.15311,731.407003 C1115.59111,753.677974 1117.56406,778.178272 1113.54013,800.839375 C1109.34899,823.500478 1100.04155,844.311241 1088.19268,862.101266 C1076.36611,880.025051 1062.3102,895.329377 1047.48518,908.616162 C1040.13955,915.304142 1032.55984,921.423643 1024.93555,927.219891 C1021.23486,930.00655 1017.60106,932.759768 1013.97841,935.512986 C1010.65671,938.188178 1007.47992,940.707316 1004.30313,943.594294 C991.729728,954.62946 910.00262,963.245807 916.378494,951.062538 C922.698635,938.678629 931.326128,927.877543 940.912232,918.336026 C950.554069,908.649602 960.953876,900.233895 972.122802,892.319786 C977.885611,888.217825 982.857009,885.119061 988.920777,881.28462 C994.37148,877.985217 999.76645,874.496321 1005.04995,870.829079 C1015.62811,863.606061 1025.7604,855.714246 1035.30191,847.242805 C1054.29577,830.210751 1070.82623,810.258279 1080.43463,787.664056 C1082.94262,781.812074 1084.91557,775.815186 1086.3312,769.729124 C1086.4984,766.585774 1086.54298,763.45357 1086.4761,760.34366 C1085.50635,753.711414 1083.96811,747.168341 1081.64961,740.736734 C1075.25144,722.935562 1063.99334,706.382813 1049.22406,693.229787 C1034.47706,679.965295 1016.3192,670.011352 996.768006,664.504916 C987.594327,661.885457 975.645138,660.046263 964.710291,657.103552 C953.641686,654.250014 942.550787,650.816852 931.671673,646.391639 C920.803707,641.910692 910.080647,636.337376 900.282757,628.902573 C890.77468,621.679555 882.325532,612.49473 876.128005,601.961162 C866.01801,599.497757 858.449446,590.457838 858.449446,579.589871 C858.449446,574.005409 860.52272,568.978278 863.744097,564.976637 C862.228155,553.763125 862.228155,542.583052 863.041859,531.737379 C864.85876,508.942516 870.15341,487.306903 876.339791,466.440407 C882.659931,445.607352 890.150468,425.599147 898.008844,406.204007 C906.056713,386.552494 914.550446,368.584123 920.157202,349.902367 C925.786252,331.276345 929.252854,312.527709 929.252854,294.336405 C929.185974,276.178542 925.173187,258.689476 916.902386,243.920188 C908.731904,229.095167 896.637808,217.20171 883.417902,208.217525 C870.075384,199.233339 855.807694,192.757146 841.729498,187.952947 C827.629008,183.104162 813.784891,179.815906 800.609571,177.41938 C779.241477,173.540352 759.790604,171.912943 742.936896,17Line truncated
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 20 KiB |
+23
-18
@@ -21,24 +21,29 @@ export default class IndexPage extends React.Component {
|
||||
/>
|
||||
<section className="front-page-info">
|
||||
<div className="address">
|
||||
<h2>Besøk oss</h2>
|
||||
<p>Vi holder til på Majorstua.</p>
|
||||
<h2>Åpningstider</h2>
|
||||
<ul>
|
||||
<li>
|
||||
Glassbaren:
|
||||
<ul>
|
||||
<li>Mandag–lørdag: 14:00–00:00</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
Bokcaféen:
|
||||
<ul>
|
||||
<li>Mandag–torsdag: 19:00–00:00</li>
|
||||
<li>Fredag: 20:00–03:00</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<h2>Besøk oss</h2>
|
||||
<p>Vi holder til på Majorstua.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Åpningstider</h2>
|
||||
<ul>
|
||||
<li>
|
||||
Glassbaren:
|
||||
<ul>
|
||||
<li>Mandag–lørdag: 14:00–00:00</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
Bokcaféen:
|
||||
<ul>
|
||||
<li>Mandag–torsdag: 19:00–00:00</li>
|
||||
<li>Fredag: 20:00–03:00</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#">Se alle åpningstider</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="volunteer">
|
||||
<Link to="/bli-aktiv/" className="section-title">
|
||||
|
||||
@@ -16,7 +16,7 @@ export default class EventProgram extends React.Component {
|
||||
<EventList
|
||||
events={events}
|
||||
preTitle="Program"
|
||||
title="Dette skjer på Neuf"
|
||||
title="Chateau Neuf"
|
||||
groupBy="month"
|
||||
showFilter
|
||||
/>
|
||||
|
||||
+10
-12
@@ -92,6 +92,16 @@ export const EventTemplate = ({
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
{organizers && (
|
||||
<div className="event-organizers">
|
||||
<span className="event-organizers-title">Arrangeres av </span>
|
||||
{organizers.map(organizer => (
|
||||
<span className="event-organizer">
|
||||
<Link to={organizer.path}>{organizer.name}</Link>
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{hasFeaturedMedia && (
|
||||
@@ -118,18 +128,6 @@ export const EventTemplate = ({
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
{organizers && (
|
||||
<div className="event-organizers">
|
||||
<div className="event-organizers-title">
|
||||
{organizers.length === 1 ? 'Arrangør' : 'Arrangører'}
|
||||
</div>
|
||||
{organizers.map(organizer => (
|
||||
<div className="event-organizer">
|
||||
<Link to={organizer.path}>{organizer.name}</Link>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<div
|
||||
className="event-content wp-content"
|
||||
dangerouslySetInnerHTML={{ __html: content }}
|
||||
|
||||
Reference in new issue
Block a user