Updated: Comment #N

Problem/Motivation

A profile can set a slogan during installation; On the last step this slogan is misaligned:

17.png

Proposed resolution

Format the slogan in a proper manner.

Screenshot from #13 after the patch from #12
After Patch Screenshot

Remaining tasks

  • create patch
  • (todo) manual testing and screenshot (last done in #13)
  • (todo) Code Review (last done in #11)

User interface changes

Style added to align the Slogan

API changes

N/A

N/A

Original report by @patrickd

For testing:

To get the slogan showing in the installer you need to add this line within settings.php
$conf['system.site']['slogan'] = 'slogan';

Comments

patrickd’s picture

StatusFileSize
new398 bytes
patrickd’s picture

Issue tags: +Novice
lewisnyman’s picture

Component: install system » Seven theme
Status: Needs review » Active

The styling for the installation screen is contained in the Seven theme. In my opinion we should allow the slogan to display incase installation profiles but remove the slogan in the Seven theme, ideally using a preprocess function instead of CSS.

littledynamo’s picture

Assigned: Unassigned » littledynamo
rteijeiro’s picture

@LewisNyman: What about to create an install twig template and use seven_preprocess_install_page?

lewisnyman’s picture

Maybe we should just style the slogan correctly? I'm happy for it to show if it is somehow set, that is uncommon though.

emma.maria’s picture

I have added styles to tidy up the slogan within the installer.

Emma

Mobile styling

Desktop styling

emma.maria’s picture

Assigned: littledynamo » Unassigned
Status: Active » Needs review
lewisnyman’s picture

Status: Needs review » Needs work

hmm, can we change the id to a class? I don't want to create more work over on #2041793: install-page.html.twig markup and CSS

emma.maria’s picture

Status: Needs work » Needs review
StatusFileSize
new1.15 KB

I have changed site slogan to use a class in the Twig file and amended the selectors in the installer css to reflect this.

Emma

lewisnyman’s picture

Status: Needs review » Needs work

Sorry I missed these before but:

  1. +++ b/core/themes/seven/install-page.css
    @@ -89,10 +89,19 @@ body.install-page #page-title {
    +    margin: 0.75em 0 0.75em 50px; /* LTR */
    

    There are one too many indentations here.

  2. +++ b/core/themes/seven/install-page.css
    @@ -89,10 +89,19 @@ body.install-page #page-title {
    +    margin: 0.75em 0 1.5em 0;
    

    If we wanted to be really efficient we could remove the last ‘0’ with the same effect.

bryangullan’s picture

Status: Needs work » Needs review
StatusFileSize
new1.15 KB

Hey,

We're doing a Drupal 8 sprint and came across this - thought we'd make those 2 tweaks for you. Patch attached. Thanks for doing all the actual work tho :-)

Bryan

axlroach’s picture

Status: Needs review » Needs work
StatusFileSize
new42.56 KB

Needs a bit of work... The slogan is still to far to the left during installation. It does appear correctly once you're on the 'Configure site' page.

bryangullan’s picture

Status: Needs work » Needs review
StatusFileSize
new1.15 KB

I've been looking at this together with @axlroach and we can only replicate the problem on the Installation profile section on his machine. Can anyone else replicate his issue? If not we're thinking it might be an odd ghost in his machine.

He did spot a missing space before a { in the CSS. Have attached a patch to correct that.

bryangullan’s picture

Issue summary: View changes

Instructions on how to test patch

shameemkm’s picture

Issue summary: View changes

Updating Issue summary By patch functionality.

shameemkm’s picture

Patch works as mentioned in comment #14

shameemkm’s picture

Issue summary: View changes
yesct’s picture

Issue summary: View changes

@shameemkm thanks. the image is not showing because of #2125301: %20 in image file names triggers the "local images only" filter

also rearranging things a bit in the issue summary

and, since there is a new patch since the last code review, and screenshot, we need to do both the manual testing and get a new screenshot, and a new code review.

for the manual testing and new screenshot, let's look especially to see if the concern from #13 (too far to the left) was addressed.
Here is the contributor task doc for adding a screenshot, if it helps https://drupal.org/node/1859584. (noticed #2132591: link to docs page (add screenshot) goes to wrong place while trying to get that link)

to make it easier to get reviews (especially re-reviews), please include interdiffs For instructions on creating an interdiff, see https://drupal.org/documentation/git/interdiff

Anonymous’s picture

Before patching:

after patching

Applied patch from #14 to an fresh 8.x.

after patching

Seems okay to me.

parthipanramesh’s picture

Status: Needs review » Reviewed & tested by the community

Looks good to me aswell. Thank you very much! :)

webchick’s picture

Status: Reviewed & tested by the community » Fixed
StatusFileSize
new101.11 KB

Looks good! I was curious what this looked like even with a longer slogan and it still looks basically fine:

Title continues into right sidebar

Committed and pushed to 8.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.