Merge branch 'master' into feat/edit-table-with-handsontable

CHANGES.md

@@ -1,6 +1,10 @@
 CHANGES
 ========
 
+## 3.2.3-RC
+
+* Support: Shrink image size for themes which recently added
+
 ## 3.2.2
 
 * Feature: SAML Authentication (SSO)

resource/locales/en-US/translation.json

@@ -424,6 +424,15 @@
     "Enable Line Break desc": "Treat line break in the text page as <code>&lt;br&gt;</code> in HTML",
     "Enable Line Break for comment": "Enable Line Break in comment",
     "Enable Line Break for comment desc": "Treat line break in comment as <code>&lt;br&gt;</code> in HTML",
+    "presentation_setting": "Presentation Setting",
+    "presentation_setting_desc": "You can change presentation settings.",
+    "Page break setting": "Page break Setting",
+    "Preset one separator": "Preset 1",
+    "Preset one separator desc": "Blank line 3 lines",
+    "Preset two separator": "Preset 2",
+    "Preset two separator desc": "Markdown horizontal rule",
+    "Custom separator": "Custom",
+    "Custom separator desc": "Any character",
     "XSS_setting": "Prevent XSS(Cross Site Scripting) Setting",
     "XSS_setting_desc": "You can change the handling of HTML tags in markdown text.",
     "Enable XSS prevention": "Enable XSS Prevention",

resource/locales/ja/translation.json

@@ -441,6 +441,15 @@
     "Enable Line Break desc": "ページテキスト中の改行を、HTML内で<code>&lt;br&gt;</code>として扱います",
     "Enable Line Break for comment": "コメント欄で Line Break を有効にする",
     "Enable Line Break for comment desc": "コメント中の改行を、HTML内で<code>&lt;br&gt;</code>として扱います",
+    "presentation_setting": "プレゼンテーション設定",
+    "presentation_setting_desc": "プレゼンテーションの設定を変更できます。",
+    "Page break setting": "改頁を設定する",
+    "Preset one separator": "プリセット 1",
+    "Preset one separator desc": "空行を3行で改頁します",
+    "Preset two separator": "プリセット 2",
+    "Preset two separator desc": "Markdown の区切り線で改頁します",
+    "Custom separator": "カスタム",
+    "Custom separator desc": "任意の文字で改頁します",
     "XSS_setting": "XSS(Cross Site Scripting)対策設定",
     "XSS_setting_desc": "マークダウンテキスト内の HTML タグの扱いを設定し、悪意のあるプログラムからの攻撃を防ぎます",
     "Enable XSS prevention": "XSSを抑制する",

src/client/styles/scss/_admin.scss

@@ -1,5 +1,4 @@
 .admin-page {
-    //security XSS prevent
 
   .admin-user-menu {
     .dropdown-menu {

src/client/styles/scss/_layout.scss

@@ -1,151 +1,177 @@
-.main-container { // {{{
-  h1, h2, h3, h4, h5, h6 {
-    font-weight: 500;
-  }
-
-  .navbar-top-links { // {{{
-    .confidential {
-      a {
-        // border: solid 2px #f00;
-        // background: #fff;
-        // color: #f00;
-        // font-weight: bold;
-        // height: 42px;
-        // margin-top: 5px;
-        // padding: 10px;
-        // margin-right: 5px;
-      }
-    }
-
-    .nav-item-admin, .nav-item-create-page {
-      span {
-        margin-left: 0.5em;
-        @media (max-width: $screen-xs-min) {
-          display: none;
-        }
-      }
-    }
-  } // }}}
-
-  .main {
-    .header-wrap {
-      padding: 15px 15px 0 15px;
-      min-height: 70px;
-    }
-  }
-
-  .layout-control { // {{{
-    transition: .3s ease;
-    position: fixed;
-    display: block;
-    text-align: center;
-    right: 25%;
-    bottom: 25px;
-    padding: 5px 8px;
-    border: solid 1px #ccc;
-    border-right: none;
-    border-radius: 5px 0 0 5px;
-    z-index: 1039;
-    font-size: .8em;
-
-    &:hover {
-      text-decoration: none;
-      cursor: pointer;
-    }
-  } // }}}
-
-  .revision-toc {
-    font-size: .9em;
-    max-width: 250px;
-    overflow: hidden;
-
-    .revision-toc-content {
-      padding: 10px;
-
-      > ul {
-        padding-left: 0;
-        ul {
-          padding-left: 1em;
-        }
-      }
-
-      > ul > li { // first level of li
-        margin: 4px 4px 4px 15px;
-        padding: 5px;
-      }
-    }
-  }
-} // }}}
-
-
-// fix tab width to 95 pixels
-// see also '_on-edit.scss'
-$nav-main-left-tab-width: 95px;
-.nav.nav-tabs {
-  .nav-main-left-tab {
-    width: $nav-main-left-tab-width;
-    text-align: center;
-    a {
-      padding-left: 0;
-      padding-right: 0;
-    }
-  }
-}
-
-
-@media print { // {{{ printable style
-  .main-container { // {{{
-    padding: 30px;
-
-    a:after {
-      display: none !important;
-    }
-    .main {
-      header {
-        border-bottom: solid 1px #666;
-        h1 {
-          font-size: 2em;
-          color: #000;
-        }
-      }
-
-      .revision-toc {
-        float: none;
-        font-size: .9em;
-        border: solid 1px #aaa;
-        border-radius: 5px;
-        max-width: 100%;
-        margin-bottom: 20px;
-
-        .revision-toc-head {
-          display: inline-block;
-          float: none;
-        }
-
-        .revision-toc-content.collapse {
-          display: block;
-          height: auto;
-        }
-      }
-
-      .meta {
-        border-top: solid 1px #ccc;
-        margin-top: 32px;
-        color: #666;
-      }
-
-
-    }
-  }
-} // }}}
-
-.system-version {
-  position: fixed;
-  right: 0.5em;
-  bottom: 0;
-  opacity: .6;
-
-  > span {
-    margin-left: .5em;
-  }
-}
+.main-container { // {{{
+  h1, h2, h3, h4, h5, h6 {
+    font-weight: 500;
+  }
+
+  .navbar-top-links { // {{{
+    .confidential {
+      a {
+        // border: solid 2px #f00;
+        // background: #fff;
+        // color: #f00;
+        // font-weight: bold;
+        // height: 42px;
+        // margin-top: 5px;
+        // padding: 10px;
+        // margin-right: 5px;
+      }
+    }
+
+    .nav-item-admin, .nav-item-create-page {
+      span {
+        margin-left: 0.5em;
+        @media (max-width: $screen-xs-min) {
+          display: none;
+        }
+      }
+    }
+  } // }}}
+
+  /*
+   * header
+   */
+  header {
+    line-height: 1em;
+
+    h1 {
+      @include variable-font-size(28px);
+      line-height: 1.1em;
+    }
+
+    // affix
+    &.affix {
+      width: 100%;
+      top: 0;
+      left: 0;
+      padding: 2px 20px;
+      z-index: 15; // over the .sidebar
+      box-shadow: 0 0px 2px #999;
+
+      h1 {
+        @include variable-font-size(20px);
+      }
+    }
+  }
+
+  .main {
+    .header-wrap {
+      padding: 15px 15px 0 15px;
+      min-height: 70px;
+    }
+  }
+
+  .layout-control { // {{{
+    transition: .3s ease;
+    position: fixed;
+    display: block;
+    text-align: center;
+    right: 25%;
+    bottom: 25px;
+    padding: 5px 8px;
+    border: solid 1px #ccc;
+    border-right: none;
+    border-radius: 5px 0 0 5px;
+    z-index: 1039;
+    font-size: .8em;
+
+    &:hover {
+      text-decoration: none;
+      cursor: pointer;
+    }
+  } // }}}
+
+  .revision-toc {
+    font-size: .9em;
+    max-width: 250px;
+    overflow: hidden;
+
+    .revision-toc-content {
+      padding: 10px;
+
+      > ul {
+        padding-left: 0;
+        ul {
+          padding-left: 1em;
+        }
+      }
+
+      > ul > li { // first level of li
+        margin: 4px 4px 4px 15px;
+        padding: 5px;
+      }
+    }
+  }
+} // }}}
+
+
+// fix tab width to 95 pixels
+// see also '_on-edit.scss'
+$nav-main-left-tab-width: 95px;
+.nav.nav-tabs {
+  .nav-main-left-tab {
+    width: $nav-main-left-tab-width;
+    text-align: center;
+    a {
+      padding-left: 0;
+      padding-right: 0;
+    }
+  }
+}
+
+
+@media print { // {{{ printable style
+  .main-container { // {{{
+    padding: 30px;
+
+    a:after {
+      display: none !important;
+    }
+    .main {
+      header {
+        border-bottom: solid 1px #666;
+        h1 {
+          font-size: 2em;
+          color: #000;
+        }
+      }
+
+      .revision-toc {
+        float: none;
+        font-size: .9em;
+        border: solid 1px #aaa;
+        border-radius: 5px;
+        max-width: 100%;
+        margin-bottom: 20px;
+
+        .revision-toc-head {
+          display: inline-block;
+          float: none;
+        }
+
+        .revision-toc-content.collapse {
+          display: block;
+          height: auto;
+        }
+      }
+
+      .meta {
+        border-top: solid 1px #ccc;
+        margin-top: 32px;
+        color: #666;
+      }
+
+
+    }
+  }
+} // }}}
+
+.system-version {
+  position: fixed;
+  right: 0.5em;
+  bottom: 0;
+  opacity: .6;
+
+  > span {
+    margin-left: .5em;
+  }
+}

src/client/styles/scss/_page.scss

@@ -8,14 +8,9 @@
    * header
    */
   header {
-    line-height: 1em;
-
     // the container of h1
     div.title-container {
       margin-right: auto;
-      h1 {
-        line-height: 1.1em;
-      }
     }
 
     .btn-copy, .btn-copy-link, .btn-edit {
@@ -58,8 +53,6 @@
     }
 
     h1#revision-path {
-      @include variable-font-size(28px);
-
       margin-top: 0;
       margin-bottom: 0;
       .d-flex {
@@ -76,21 +69,6 @@
       }
 
     }
-
-    // affix
-    &.affix {
-      width: 100%;
-      top: 0;
-      left: 0;
-      padding: 2px 20px;
-      z-index: 15; // over the .sidebar
-      box-shadow: 0 0px 2px #999;
-
-      h1#revision-path {
-        @include variable-font-size(20px);
-      }
-    }
-
   }
 
   // alert component settings

src/server/form/admin/markdownPresentation.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var form = require('express-form')
+  , field = form.field;
+
+module.exports = form(
+  field('markdownSetting[markdown:presentation:pageBreakSeparator]').trim().toInt(),
+  field('markdownSetting[markdown:presentation:pageBreakCustomSeparator]').trim()
+);

src/server/form/index.js

@@ -27,6 +27,7 @@ module.exports = {
     securityPassportTwitter: require('./admin/securityPassportTwitter'),
     markdown: require('./admin/markdown'),
     markdownXss: require('./admin/markdownXss'),
+    markdownPresentation: require('./admin/markdownPresentation'),
     customcss: require('./admin/customcss'),
     customscript: require('./admin/customscript'),
     customheader: require('./admin/customheader'),

src/server/models/config.js

@@ -116,6 +116,8 @@ module.exports = function(crowi) {
       'markdown:xss:attrWhiteList': [],
       'markdown:isEnabledLinebreaks': false,
       'markdown:isEnabledLinebreaksInComments': true,
+      'markdown:presentation:pageBreakSeparator': 1,
+      'markdown:presentation:pageBreakCustomSeparator': '',
     };
   }
 
@@ -357,6 +359,28 @@ module.exports = function(crowi) {
     return config.markdown[key];
   };
 
+  configSchema.statics.pageBreakSeparator = function(config) {
+    const key = 'markdown:presentation:pageBreakSeparator';
+
+    // return default value if undefined
+    if (undefined === config.markdown || undefined === config.markdown[key]) {
+      return getDefaultMarkdownConfigs[key];
+    }
+
+    return config.markdown[key];
+  };
+
+  configSchema.statics.pageBreakCustomSeparator = function(config) {
+    const key = 'markdown:presentation:pageBreakCustomSeparator';
+
+    // return default value if undefined
+    if (undefined === config.markdown || undefined === config.markdown[key]) {
+      return getDefaultMarkdownConfigs[key];
+    }
+
+    return config.markdown[key];
+  };
+
   configSchema.statics.isEnabledXssPrevention = function(config) {
     const key = 'markdown:xss:isEnabledPrevention';
 

src/server/routes/admin.js

@@ -138,6 +138,25 @@ module.exports = function(crowi, app) {
     }
   };
 
+  // app.post('/admin/markdown/presentationSetting' , admin.markdown.presentationSetting);
+  actions.markdown.presentationSetting = function(req, res) {
+    let presentationSetting = req.form.markdownSetting;
+
+    req.session.markdownSetting = presentationSetting;
+    if (req.form.isValid) {
+      Config.updateNamespaceByArray('markdown', presentationSetting, function(err, config) {
+        Config.updateConfigCache('markdown', config);
+        req.session.markdownSetting = null;
+        req.flash('successMessage', ['Successfully updated!']);
+        return res.redirect('/admin/markdown');
+      });
+    }
+    else {
+      req.flash('errorMessage', req.form.errors);
+      return res.redirect('/admin/markdown');
+    }
+  };
+
   // app.post('/admin/markdown/xss-setting' , admin.markdown.xssSetting);
   actions.markdown.xssSetting = function(req, res) {
     let xssSetting = req.form.markdownSetting;

src/server/routes/index.js

@@ -86,6 +86,7 @@ module.exports = function(crowi, app) {
   app.get('/admin/markdown'                   , loginRequired(crowi, app) , middleware.adminRequired() , admin.markdown.index);
   app.post('/admin/markdown/lineBreaksSetting', loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.markdown, admin.markdown.lineBreaksSetting); //change form name
   app.post('/admin/markdown/xss-setting'      , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.markdownXss, admin.markdown.xssSetting);
+  app.post('/admin/markdown/presentationSetting', loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.markdownPresentation, admin.markdown.presentationSetting);
 
   // markdown admin
   app.get('/admin/customize'                , loginRequired(crowi, app) , middleware.adminRequired() , admin.customize.index);

src/server/service/passport.js

@@ -431,7 +431,7 @@ class PassportService {
 
     debug('SamlStrategy: setting up..');
     passport.use(new SamlStrategy({
-      path: config.crowi['security:passport-saml:path'] || process.env.SAML_CALLBACK_URI,
+      path: config.crowi['security:passport-saml:callbackUrl'] || process.env.SAML_CALLBACK_URI,
       entryPoint: config.crowi['security:passport-saml:entryPoint'] || process.env.SAML_ENTRY_POINT,
       issuer: config.crowi['security:passport-saml:issuer'] || process.env.SAML_ISSUER,
     }, function(profile, done) {

src/server/util/swigFunctions.js

@@ -142,6 +142,16 @@ module.exports = function(crowi, app, req, locals) {
     return Config.customCss();
   };
 
+  locals.pageBreakSeparator = function() {
+    let config = crowi.getConfig();
+    return Config.pageBreakSeparator(config);
+  };
+
+  locals.pageBreakCustomSeparator = function() {
+    let config = crowi.getConfig();
+    return Config.pageBreakCustomSeparator(config);
+  };
+
   locals.customScript = function() {
     return Config.customScript();
   };

src/server/views/admin/app.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('App settings') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('App settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/customize.html

@@ -26,7 +26,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Customize') }} </h1>
+    <h1 id="admin-title" class="title">{{ t('Customize') }} </h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/external-accounts.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('User management') }}/{{ t('External Account management') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('User management') }}/{{ t('External Account management') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/global-notification-detail.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Notification settings') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Notification settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/importer.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Import Data') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Import Data') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/index.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id=""> {{ t('admin_top.Management Wiki') }}</h1>
+    <h1 id="admin-title" class="title"> {{ t('admin_top.Management Wiki') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/markdown.html

@@ -6,7 +6,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Markdown settings') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Markdown settings') }}</h1>
   </header>
 </div>
 {% endblock %}
@@ -89,6 +89,59 @@
         </fieldset>
       </form>
 
+      <form action="/admin/markdown/presentationSetting" method="post" class="form-horizontal" id="markdownSettingForm" role="form">
+        <legend>{{ t('markdown_setting.presentation_setting') }}</legend>
+        <p class="well">{{ t("markdown_setting.presentation_setting_desc") }}</p>
+
+        <fieldset class="form-group row my-2">
+            {% set nameForPageBreakOption = "markdownSetting[markdown:presentation:pageBreakSeparator]" %}
+            {% set pageBreakSeparator = markdownSetting['markdown:presentation:pageBreakSeparator'] %}
+
+          <label class="col-xs-3 control-label">
+            {{ t('markdown_setting.Page break setting') }}
+          </label>
+
+          <div class="col-xs-3 radio radio-primary">
+              <input type="radio" id="option1" name="{{nameForPageBreakOption}}" value="1" {% if pageBreakSeparator === 1 %}checked{% endif %}>
+              <label for="option1">
+                <p class="font-weight-bold">{{ t('markdown_setting.Preset one separator') }}</p>
+                <div class="m-t-15">
+                    {{ t('markdown_setting.Preset one separator desc') }}
+                </div>
+              </label>
+          </div>
+
+          <div class="col-xs-3 radio radio-primary">
+              <input type="radio" id="option2" name="{{nameForPageBreakOption}}" value="2" {% if pageBreakSeparator === 2 %}checked{% endif %}>
+              <label for="option2">
+                <p class="font-weight-bold">{{ t('markdown_setting.Preset two separator') }}</p>
+                <div class="m-t-15">
+                    {{ t('markdown_setting.Preset two separator desc') }}
+                </div>
+              </label>
+          </div>
+
+          <div class="col-xs-3 radio radio-primary">
+            <input type="radio" id="option3" name="{{nameForPageBreakOption}}" value="3" {% if pageBreakSeparator === 3 %}checked{% endif %}>
+            <label for="option3">
+              <p class="font-weight-bold">{{ t('markdown_setting.Custom separator') }}</p>
+              <div class="m-t-15">
+                  {{ t('markdown_setting.Custom separator desc') }}
+                  <input class="form-control" type="text" name="markdownSetting[markdown:presentation:pageBreakCustomSeparator]" value="{{markdownSetting['markdown:presentation:pageBreakCustomSeparator']|default('') }}">
+              </div>
+            </label>
+          </div>
+
+        </fieldset>
+
+        <div class="form-group my-3">
+          <div class="col-xs-offset-4 col-xs-5">
+            <input type="hidden" name="_csrf" value="{{ csrf() }}">
+            <button type="submit" class="btn btn-primary">{{ t("Update") }}</button>
+          </div>
+        </div>
+      </form>
+
       <form action="/admin/markdown/xss-setting" method="post" class="form-horizontal" id="markdownSettingForm" role="form">
         {% set nameForIsXssEnabled = "markdownSetting[markdown:xss:isEnabledPrevention]" %}
         {% set isXssEnabled = markdownSetting['markdown:xss:isEnabledPrevention'] %}

src/server/views/admin/notification.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Notification settings') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Notification settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/search.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Full Text Search management') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Full Text Search management') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/security.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Security settings') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('Security settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/user-group-detail.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('UserGroup management') + '/' + userGroup.name | preventXss }}</h1>
+    <h1 id="admin-title" class="title">{{ t('UserGroup management') + '/' + userGroup.name | preventXss }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/user-groups.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('UserGroup management') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('UserGroup management') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/admin/users.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('user_management.User management') }}</h1>
+    <h1 id="admin-title" class="title">{{ t('user_management.User management') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/layout/admin.html

@@ -1,7 +1,7 @@
 {% extends '../layout-growi/base/layout.html' %}
 
 
-{% block main_css_class %}admin-page{% endblock %}
+{% block html_base_css %}admin-page{% endblock %}
 
 
 {% block html_additional_headers %}

src/server/views/me/api_token.html

@@ -7,7 +7,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-  <h1 class="title" id="">{{ t('API Settings') }}</h1>
+  <h1 id="admin-title" class="title">{{ t('API Settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/me/external-accounts.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('user_management.external_account') }}</h1>
+    <h1 id="mypage-title" class="title">{{ t('user_management.external_account') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/me/index.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('User Settings') }}</h1>
+    <h1 id="mypage-title" class="title">{{ t('User Settings') }}</h1>
   </header>
 </div>
 {% endblock %}

src/server/views/me/password.html

@@ -5,7 +5,7 @@
 {% block content_header %}
 <div class="header-wrap">
   <header id="page-header">
-    <h1 class="title" id="">{{ t('Password Settings') }}</h1>
+    <h1 id="mypage-title" class="title">{{ t('Password Settings') }}</h1>
   </header>
 </div>
 {% endblock %}