search

codingdavinci / relaunch2018

This is the new Coding da Vinci website (online since September 2020).
https://codingdavinci.de
GNU General Public License v2.0
1 stars 1 forks source link

Headers - single project/dataset pages #181

Closed lucyWMDE closed 4 years ago

lucyWMDE commented 4 years ago

We currently have some problems with the way images have been implemented in the headers for single project and datasets pages:

  1. Should images float to the right margin every time with a varying amount of green space in the middle? I'm not so happy about this moving left margin... However, I do quite like the smaller-screen version where the image floats beneath the page title, centred with a green border on all 4 sides. Maybe there is a better way to insert the image into the header? Perhaps centred inside a fixed column width? @stffb - what do you think?

  2. Where should the credit line for the image go at wider screen widths? For smaller screen widths it floats under the image (though we should probably stick to the standard link styles here).

  3. ~~With images in the main body we had also built a nice solution that allowed us to show video or audio on single project/dataset pages when available (eg implemented here http://codingdavinci.snater.com/de/projekte/projekt-name-des-projekts - image is used as a thumbnail, both in the preview and over the audio/video file). I don't think it makes sense to show both an image in the header AND a video/audio file. @snater - could the video/audio function be reinstated for images in the header?~~ decided to keep audio/video in the main content area - see below

stffb commented 4 years ago
  1. In figma is the design with a green border on all 4 sides
  2. The credits should not be as a blue lable
  3. I don't think its too bad how it is. As in the header the picture is more decorative and you would consume a video more on the content level?
lucyWMDE commented 4 years ago
  1. Where should the credit line for the image go ...
  1. The credits should not be as a blue lable

@stffb what would you propose as an alternative? Would you suggest to use the same implementation Henning has already used for smaller screen widths (centred under the image)?

  1. video and audio ...
  1. I don't think its too bad how it is. As in the header the picture is more decorative and you would consume a video more on the content level?

ok. but then I find the duplication of the image a bit unfortunate. @snater what would you think about no longer using the uploaded image as a cover image. Instead displaying audio just as the play button and timeslider, and embedding video without applying an additional cover image..?

stffb commented 4 years ago
  1. After talking to Lucy we decided to go for the version with a green border on all 4 sides. Picture should be aligned with the »Kurzbeschreibung« at the bottom.
  2. Underneath will be the credit line in 16px. see figma: »Header_Projekt/Datensatzseite_1«. Credit line should be left aligned.