Changeset - 919cebd1073c
Parent rev.
Child rev.
[Not reviewed]
default
0 5 0
domruf - 8 years ago 2017-06-26 23:49:26
dominikruf@gmail.com
Grafted from: 88d885e2aa99
templates: use bootstrap grid system for centered panels (login page etc.)

The bootstrap grid system rearranges the elements so that the pages look
good an small screens as well. (i.e. no vertical scrolling)
5 files changed with 28 insertions and 9 deletions:
kallithea/public/less/style.less
4
9
kallithea/templates/login.html
6
kallithea/templates/password_reset.html
6
kallithea/templates/password_reset_confirmation.html
6
kallithea/templates/register.html
6
0 comments (0 inline, 0 general)
kallithea/public/less/style.less
➞
Show inline comments
 
@@ -476,54 +476,48 @@ div#legend_choices {
 
}
 

			




	
	
	
		
 
div.form div.form-group div.button input,

			




	
	
	
		
 
#content div.panel div.form div.buttons input,

			




	
	
	
		
 
div.form div.buttons input,

			




	
	
	
		
 
#content div.panel div.action div.button input {

			




	
	
	
		
 
  font-size: 11px;

			




	
	
	
		
 
  font-weight: 700;

			




	
	
	
		
 
  margin: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 
div.form div.form-group div.highlight,

			




	
	
	
		
 
#content div.panel div.form div.buttons div.highlight {

			




	
	
	
		
 
  display: inline;

			




	
	
	
		
 
}

			




	
	
	
		
 
#content div.panel table td.user,

			




	
	
	
		
 
#content div.panel table td.address {

			




	
	
	
		
 
  width: 10%;

			




	
	
	
		
 
  text-align: center;

			




	
	
	
		
 
}

			




	
	
	
		
 
#content div.panel div.action div.button {

			




	
	
	
		
 
  text-align: right;

			




	
	
	
		
 
  margin: 6px 0 0;

			




	
	
	
		
 
  padding: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 
#login,

			




	
	
	
		
 
#register {

			




	
	
	
		
 
  width: 520px;

			




	
	
	
		
 
  margin: 10% auto 0;

			




	
	
	
		
 
  padding: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 
.ac .match {

			




	
	
	
		
 
  font-weight: 700;

			




	
	
	
		
 
  padding-top: 5px;

			




	
	
	
		
 
  padding-bottom: 5px;

			




	
	
	
		
 
}

			




	
	
	
		
 
.q_filter_box {

			




	
	
	
		
 
  border-radius: 4px;

			




	
	
	
		
 
  border: 0 none;

			




	
	
	
		
 
  margin-bottom: -4px;

			




	
	
	
		
 
  margin-top: -4px;

			




	
	
	
		
 
  padding-left: 3px;

			




	
	
	
		
 
}

			




	
	
	
		
 
#node_filter {

			




	
	
	
		
 
  border: 0px solid #545454;

			




	
	
	
		
 
  color: #AAAAAA;

			




	
	
	
		
 
  padding-left: 3px;

			




	
	
	
		
 
}

			




	
	
	
		
 
/** comment main **/

			




	
	
	
		
 
.comment .panel,

			




	
	
	
		
 
.comment-inline-form {

			




	
	
	
		
 
  max-width: 978px;

			




	
	
	
		
 
}

			




	
	
	
		
 
.comment .panel-body {

			




	
	
	
		
 
  background-color: #FAFAFA;

			




	
	
		
 
@@ -681,51 +675,52 @@ div.comment:target > .panel {

			




	
	
	
		
 
  margin: 5px;

			




	
	
	
		
 
}

			




	
	
	
		
 
div.comment-prev-next-links div.prev-comment,

			




	
	
	
		
 
div.comment-prev-next-links div.next-comment {

			




	
	
	
		
 
  display: inline-block;

			




	
	
	
		
 
  min-width: 150px;

			




	
	
	
		
 
  margin: 3px 6px;

			




	
	
	
		
 
}

			




	
	
	
		
 
#comments-general-comments div.comment-prev-next-links div.prev-comment,

			




	
	
	
		
 
#comments-general-comments div.comment-prev-next-links div.next-comment {

			




	
	
	
		
 
  margin-left: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
/* changelog graph */

			




	
	
	
		
 
#graph_nodes,

			




	
	
	
		
 
#updaterevs-graph {

			




	
	
	
		
 
  .make-xs-column(1);

			




	
	
	
		
 
}

			




	
	
	
		
 
#graph_content,

			




	
	
	
		
 
#graph_content_pr,

			




	
	
	
		
 
#updaterevs-table {

			




	
	
	
		
 
  .make-xs-column(11);

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
/* use bootstrap grid columns for centered forms */

			




	
	
	
		
 
#login,

			




	
	
	
		
 
#register {

			




	
	
	
		
 
/* use bootstrap grid columns for centered columns */

			




	
	
	
		
 
.centered-column {

			




	
	
	
		
 
  .make-sm-column-offset(3);

			




	
	
	
		
 
  .make-sm-column(6);

			




	
	
	
		
 
  .form {

			




	
	
	
		
 
    .form-horizontal;

			




	
	
	
		
 
    .form-group > label {

			




	
	
	
		
 
      .make-sm-column(4);

			




	
	
	
		
 
    }

			




	
	
	
		
 
    .form-group > div {

			




	
	
	
		
 
      .make-sm-column(8);

			




	
	
	
		
 
    }

			




	
	
	
		
 
    .form-group > div:first-child { /* in case there is no label */

			




	
	
	
		
 
      .make-sm-column-offset(4);

			




	
	
	
		
 
      .make-sm-column(8);

			




	
	
	
		
 
    }

			




	
	
	
		
 
  }

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
/* use columns and form-horizontal for settings pages ... on wide screens */

			




	
	
	
		
 
@media (min-width: @screen-sm-min) {

			




	
	
	
		
 
  .settings {

			




	
	
	
		
 
    max-width: @container-md;

			




	
	
	
		
 
    > ul.nav-stacked {

			




	
	
	
		
 
      .make-sm-column(2);

			




	
	
	
		
 
      max-width: (@container-md/12)*2;

			




	
	
	
		
 
    }

			




	
	
	
		
 
    > div {

			




        

    


    
    

    

        

                

                    kallithea/templates/login.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
	
		
 
## -*- coding: utf-8 -*-

			




	
	
	
		
 
<%inherit file="base/root.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<%block name="title">

			




	
	
	
		
 
    ${_('Log In')}

			




	
	
	
		
 
</%block>

			




	
	
	
		
 

			




	
	
	
		
 
<%include file="/base/flash_msg.html"/>

			




	
	
	
		
 
<div class="container">

			




	
	
	
		
 
<div class="row">

			




	
	
	
		
 
<div class="centered-column">

			




	
	
	
		
 
<div id="login" class="panel panel-primary">

			




	
	
	
		
 
    <div class="panel-heading">

			




	
	
	
		
 
      <h5>

			




	
	
	
		
 
        <i class="icon-lock"></i>

			




	
	
	
		
 
        %if c.site_name:

			




	
	
	
		
 
            ${_('Log In to %s') % c.site_name}

			




	
	
	
		
 
        %else:

			




	
	
	
		
 
            ${_('Log In')}

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
      </h5>

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
    <div class="panel-body">

			




	
	
	
		
 
        ${h.form(url('login_home', came_from=c.came_from))}

			




	
	
	
		
 
        <div class="form">

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="username">${_('Username')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.text('username',class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="password">${_('Password')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
		
 
@@ -47,24 +50,27 @@

			




	
	
	
		
 
            <div class="form-group">

			




	
	
	
		
 
                <div>

			




	
	
	
		
 
                    ${h.link_to(_('Forgot your password ?'),h.url('reset_password'))}

			




	
	
	
		
 
                    %if h.HasPermissionAny('hg.admin', 'hg.register.auto_activate', 'hg.register.manual_activate')():

			




	
	
	
		
 
                        /

			




	
	
	
		
 
                        ${h.link_to(_("Don't have an account ?"),h.url('register'))}

			




	
	
	
		
 
                    %endif

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
            </div>

			




	
	
	
		
 

			




	
	
	
		
 
            <div class="form-group">

			




	
	
	
		
 
                <div class="buttons">

			




	
	
	
		
 
                    ${h.submit('sign_in',_('Sign In'),class_="btn btn-default")}

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
            </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 
        ${h.end_form()}

			




	
	
	
		
 
        <script type="text/javascript">

			




	
	
	
		
 
        $(document).ready(function(){

			




	
	
	
		
 
            $('#username').focus();

			




	
	
	
		
 
        });

			




	
	
	
		
 
        </script>

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




        

    


    
    

    

        

                

                    kallithea/templates/password_reset.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
	
		
 
## -*- coding: utf-8 -*-

			




	
	
	
		
 
<%inherit file="base/root.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<%block name="title">

			




	
	
	
		
 
    ${_('Password Reset')}

			




	
	
	
		
 
</%block>

			




	
	
	
		
 

			




	
	
	
		
 
<%include file="/base/flash_msg.html"/>

			




	
	
	
		
 
<div class="container">

			




	
	
	
		
 
<div class="row">

			




	
	
	
		
 
<div class="centered-column">

			




	
	
	
		
 
<div id="register" class="panel panel-primary">

			




	
	
	
		
 
    <div class="panel-heading">

			




	
	
	
		
 
        %if c.site_name:

			




	
	
	
		
 
            <h5>${_('Reset Your Password to %s') % c.site_name}</h5>

			




	
	
	
		
 
        %else:

			




	
	
	
		
 
            <h5>${_('Reset Your Password')}</h5>

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
    <div class="panel-body">

			




	
	
	
		
 
        ${h.form(url('password_reset'))}

			




	
	
	
		
 
        <div class="form">

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="email">${_('Email Address')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.text('email', class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                %if c.captcha_active:

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="recaptcha_field">${_('Captcha')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.hidden('recaptcha_field')}

			




	
	
	
		
 
                        <div id="recaptcha"></div>

			




	
	
		
 
@@ -41,24 +44,27 @@

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="alert alert-info">

			




	
	
	
		
 
                    ${_('A password reset link will be sent to the specified email address if it is registered in the system.')}

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 
        ${h.end_form()}

			




	
	
	
		
 
        %if c.captcha_active:

			




	
	
	
		
 
        <script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
        <script type="text/javascript">

			




	
	
	
		
 
         $(document).ready(function(){

			




	
	
	
		
 
            $('#email').focus();

			




	
	
	
		
 
            %if c.captcha_active:

			




	
	
	
		
 
            Recaptcha.create(${h.js(c.captcha_public_key)}, "recaptcha",

			




	
	
	
		
 
                {

			




	
	
	
		
 
                  theme: "white"

			




	
	
	
		
 
                }

			




	
	
	
		
 
            );

			




	
	
	
		
 
            %endif

			




	
	
	
		
 
         });

			




	
	
	
		
 
        </script>

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




        

    


    
    

    

        

                

                    kallithea/templates/password_reset_confirmation.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
	
		
 
## -*- coding: utf-8 -*-

			




	
	
	
		
 
<%inherit file="base/root.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<%block name="title">

			




	
	
	
		
 
    ${_('Reset Your Password')}

			




	
	
	
		
 
</%block>

			




	
	
	
		
 

			




	
	
	
		
 
<%include file="/base/flash_msg.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<div class="container">

			




	
	
	
		
 
<div class="row">

			




	
	
	
		
 
<div class="centered-column">

			




	
	
	
		
 
<div id="register" class="panel panel-primary">

			




	
	
	
		
 
    <div class="panel-heading">

			




	
	
	
		
 
        %if c.site_name:

			




	
	
	
		
 
            <h5>${_('Reset Your Password to %s') % c.site_name}</h5>

			




	
	
	
		
 
        %else:

			




	
	
	
		
 
            <h5>${_('Reset Your Password')}</h5>

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
    <div class="panel-body">

			




	
	
	
		
 
        ${h.form(h.url('reset_password_confirmation'), method='post')}

			




	
	
	
		
 
        <p>${_('You are about to set a new password for the email address %s.') % c.email}</p>

			




	
	
	
		
 
        <p>${_('Note that you must use the same browser session for this as the one used to request the password reset.')}</p>

			




	
	
	
		
 
        ${h.hidden('email')}

			




	
	
	
		
 
        ${h.hidden('timestamp')}

			




	
	
	
		
 
        <div class="form">

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="token">${_('Code you received in the email')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.text('token', class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="password">${_('New Password')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.password('password',class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="password_confirm">${_('Confirm New Password')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.password('password_confirm',class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <div class="buttons">

			




	
	
	
		
 
                        ${h.submit('send',_('Confirm'),class_="btn btn-default")}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 
        ${h.end_form()}

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
   </div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




	
	
	
		
 
</div>

			




        

    


    
    

    

        

                

                    kallithea/templates/register.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
	
		
 
## -*- coding: utf-8 -*-

			




	
	
	
		
 
<%inherit file="base/root.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<%block name="title">

			




	
	
	
		
 
    ${_('Sign Up')}

			




	
	
	
		
 
</%block>

			




	
	
	
		
 

			




	
	
	
		
 
<%include file="/base/flash_msg.html"/>

			




	
	
	
		
 

			




	
	
	
		
 
<div class="container">

			




	
	
	
		
 
<div class="row">

			




	
	
	
		
 
<div class="centered-column">

			




	
	
	
		
 
<div id="register" class="panel panel-primary">

			




	
	
	
		
 
    <div class="panel-heading">

			




	
	
	
		
 
        %if c.site_name:

			




	
	
	
		
 
            <h5>${_('Sign Up to %s') % c.site_name}</h5>

			




	
	
	
		
 
        %else:

			




	
	
	
		
 
            <h5>${_('Sign Up')}</h5>

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
    <div class="panel-body">

			




	
	
	
		
 
        ${h.form(url('register'))}

			




	
	
	
		
 
        <div class="form">

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="username">${_('Username')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.text('username',class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 

			




	
	
	
		
 
                <div class="form-group">

			




	
	
	
		
 
                    <label class="control-label" for="password">${_('Password')}:</label>

			




	
	
	
		
 
                    <div>

			




	
	
	
		
 
                        ${h.password('password',class_='form-control')}

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
		
 
@@ -79,24 +82,27 @@

			




	
	
	
		
 
                            <div class="alert alert-info">${_('Please wait for an administrator to activate your account.')}</div>

			




	
	
	
		
 
                        %endif

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 
        ${h.end_form()}

			




	
	
	
		
 
        %if c.captcha_active:

			




	
	
	
		
 
        <script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

			




	
	
	
		
 
        %endif

			




	
	
	
		
 
        <script type="text/javascript">

			




	
	
	
		
 
        $(document).ready(function(){

			




	
	
	
		
 
            $('#username').focus();

			




	
	
	
		
 

			




	
	
	
		
 
            %if c.captcha_active:

			




	
	
	
		
 
            Recaptcha.create(${h.js(c.captcha_public_key)}, "recaptcha",

			




	
	
	
		
 
                {

			




	
	
	
		
 
                  theme: "white"

			




	
	
	
		
 
                }

			




	
	
	
		
 
            );

			




	
	
	
		
 
            %endif

			




	
	
	
		
 
        });

			




	
	
	
		
 
        </script>

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
 </div>

			




	
	
	
		
 
 </div>

			




	
	
	
		
 
 </div>

			




	
	
	
		
 
 </div>

			




        

    



    


    



    



      

      





    
    0 comments (0 inline, 0 general)
    





    


  

  







  


    




    








    
        
    
    
        This site is powered by
            Kallithea 0.7.0,
        which is
        © 2010–2025 by various authors & licensed under GPLv3.