| @@ -13,6 +13,7 @@ export const createElectionResultListItem = | |||||
| topBox.href = '#'; | topBox.href = '#'; | ||||
| const imageBox = createElement('div', ['image-box'], null, topBox); | const imageBox = createElement('div', ['image-box'], null, topBox); | ||||
| createImage(image, 310, 310, '', [], imageBox); | createImage(image, 310, 310, '', [], imageBox); | ||||
| createElement('span', ['copyright'], name, imageBox); | |||||
| createElement('h3', [], name, topBox); | createElement('h3', [], name, topBox); | ||||
| const textBox = createElement('div', ['text-box'], null, electionResultListItem); | const textBox = createElement('div', ['text-box'], null, electionResultListItem); | ||||
| @@ -29,6 +29,21 @@ | |||||
| padding-bottom: 100%; | padding-bottom: 100%; | ||||
| border-top-left-radius: 4px; | border-top-left-radius: 4px; | ||||
| border-top-right-radius: 4px; | border-top-right-radius: 4px; | ||||
| .copyright { | |||||
| bottom: 0; | |||||
| color: var(--theme-color-white); | |||||
| display: block; | |||||
| font-size: 12px; | |||||
| left: 100%; | |||||
| line-height: 1.2; | |||||
| padding: 8px; | |||||
| position: absolute; | |||||
| text-shadow: 0 0 3px rgba(0,0,0,.6),0 0 8px rgba(0,0,0,.6); | |||||
| transform: rotate(-90deg); | |||||
| transform-origin: 0 100%; | |||||
| width: 66%; | |||||
| z-index: 2; | |||||
| } | |||||
| } | } | ||||
| img { | img { | ||||
| @@ -11,7 +11,7 @@ | |||||
| padding: 16px 12px; | padding: 16px 12px; | ||||
| transition: 0.25s ease; | transition: 0.25s ease; | ||||
| line-height: 1.2; | line-height: 1.2; | ||||
| text-align: center; | |||||
| text-align: left; | |||||
| text-decoration: none; | text-decoration: none; | ||||
| background-color: var(--theme-grey-light); | background-color: var(--theme-grey-light); | ||||
| display: block; | display: block; | ||||
| @@ -40,6 +40,8 @@ | |||||
| .mini-container { | .mini-container { | ||||
| width: 100%; | width: 100%; | ||||
| display: flex; | |||||
| flex-direction: column; | |||||
| } | } | ||||
| } | } | ||||
| &.infoteaser{ | &.infoteaser{ | ||||
| @@ -80,11 +82,10 @@ | |||||
| } | } | ||||
| .title{ | .title{ | ||||
| margin-top: 0; | margin-top: 0; | ||||
| padding-left: 54px; | |||||
| min-height: 48px; | min-height: 48px; | ||||
| text-align: left; | text-align: left; | ||||
| line-height: 24px; | line-height: 24px; | ||||
| margin-bottom: 19px; | |||||
| margin-bottom: 11px; | |||||
| width: 100%; | width: 100%; | ||||
| &.noicon{ | &.noicon{ | ||||
| padding-left: 0; | padding-left: 0; | ||||
| @@ -94,11 +95,17 @@ | |||||
| } | } | ||||
| } | } | ||||
| } | } | ||||
| .icon-box + .title { | |||||
| padding-left: 54px; | |||||
| } | |||||
| .icon-box + .mini-container { | |||||
| padding-left: 54px; | |||||
| } | |||||
| .btn{ | .btn{ | ||||
| background-color: transparent; | background-color: transparent; | ||||
| border: 1px solid white; | border: 1px solid white; | ||||
| margin-left: 54px; | |||||
| align-self: flex-start; | |||||
| margin-left: 0; | |||||
| align-self: flex-end; | |||||
| display: inline-block; | display: inline-block; | ||||
| padding:8px 10px; | padding:8px 10px; | ||||
| line-height: 22px; | line-height: 22px; | ||||
| @@ -44,7 +44,9 @@ export const createElectionDetail = | |||||
| const back = createElement('div', ['election-detail--back'], null, electionDetail); | const back = createElement('div', ['election-detail--back'], null, electionDetail); | ||||
| const more = createElement('div', ['election-detail--more', 'contact-wrapper'], null, electionDetail); | const more = createElement('div', ['election-detail--more', 'contact-wrapper'], null, electionDetail); | ||||
| createImage(image, 545, 526, '', [], text); | |||||
| const imageContainer = createElement('div', ['election-detail--image-container'], null, text); | |||||
| createImage(image, 545, 526, '', [], imageContainer); | |||||
| createElement('span', ['copyright'], name, imageContainer); | |||||
| const textbox = createElement('div', ['text-box'], null, text); | const textbox = createElement('div', ['text-box'], null, text); | ||||
| createElement('h1', [], name, textbox); | createElement('h1', [], name, textbox); | ||||
| createElement('p', ['subheadline'], subheadline, textbox); | createElement('p', ['subheadline'], subheadline, textbox); | ||||
| @@ -22,6 +22,29 @@ | |||||
| } | } | ||||
| } | } | ||||
| .election-detail--image-container { | |||||
| position: relative; | |||||
| margin: 0 40px 0 0; | |||||
| img { | |||||
| margin: 0; | |||||
| } | |||||
| .copyright { | |||||
| bottom: 0; | |||||
| color: var(--theme-color-white); | |||||
| display: block; | |||||
| font-size: 12px; | |||||
| left: 100%; | |||||
| line-height: 1.2; | |||||
| padding: 8px; | |||||
| position: absolute; | |||||
| text-shadow: 0 0 3px rgba(0,0,0,.6),0 0 8px rgba(0,0,0,.6); | |||||
| transform: rotate(-90deg); | |||||
| transform-origin: 0 100%; | |||||
| width: 66%; | |||||
| z-index: 2; | |||||
| } | |||||
| } | |||||
| .text-box { | .text-box { | ||||
| flex: 1; | flex: 1; | ||||
| padding-right: 1.5rem; | padding-right: 1.5rem; | ||||
| @@ -557,7 +557,7 @@ section.marketingheader{ | |||||
| height: fit-content; | height: fit-content; | ||||
| } | } | ||||
| } | } | ||||
| } | |||||
| } | |||||
| } | } | ||||
| } | } | ||||
| } | } | ||||