Its possible to add some style or twig/template to the password page?

Thx

Comments

ssamuel68 created an issue. See original summary.

deaom’s picture

Assigned: ssamuel68 » Unassigned
Priority: Normal » Minor

Hi @ssamuel68, you can target the form with the CSS and style it that way. Or what did you had in mind?

thomas.frobieter’s picture

It would be very nice to have a Twig template file instead hard coded markup:

ProtectedPagesLoginForm.php

    $form['protected_page_enter_password']['protected_page_pid'] = [
      '#markup' => '<div class="protected_pages_description"><strong>' . $config->get('others.protected_pages_description') . '</strong></div>',
    ];

I would suggest something like:

<div class="protected-page">
    <div class="protected-page__description">
         {{ description }}
    </div>
    {{ form }} <-- class protected-page__form
</div>
deaom’s picture

Status: Active » Needs review
StatusFileSize
new3.2 KB

This is an attempt to achieve the desired behaviour, where twig is present for the login form. So now the description is separated from the form (enter password) in a twig named protected-pages-login. (Like in the example above)

thomas.frobieter’s picture

+++ b/templates/protected-pages-login.html.twig
@@ -0,0 +1,19 @@
+  <div class="protected_pages_description">

Looks good, only the class "protected_pages_description" doesn't fit Drupals BEM standard => protected-pages__description

deaom’s picture

StatusFileSize
new3.2 KB
new165 bytes

Updated patch with the proposed BEM standard correction.

deaom’s picture

StatusFileSize
new3.2 KB
new165 bytes

Updated patch with the correct proposed BEM standard correction.

b-prod’s picture

This patch simply uses the form #theme with the existing structure, and try to be backward compatible.

introfini’s picture

Patch #8 is working nicely, Thanks!

meri_atanasovska’s picture

Patch #7 and #8 working correctly, Thanks.

glynster’s picture

+1 RTBC huge help for theming and very standard, please consider adding to the module.

glynster’s picture

Status: Needs review » Reviewed & tested by the community