Merge pull request #4232 from fabrixxm/frio-login

[WIP] Frio: restyle login page
This commit is contained in:
Hypolite Petovan 2018-01-14 17:22:36 -05:00 committed by GitHub
commit f45cde798a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 85 additions and 4 deletions

View file

@ -39,6 +39,7 @@ function theme_admin_post(App $a) {
Config::set('frio', 'contentbg_transp', $_POST["frio_contentbg_transp"]); Config::set('frio', 'contentbg_transp', $_POST["frio_contentbg_transp"]);
Config::set('frio', 'background_image', $_POST["frio_background_image"]); Config::set('frio', 'background_image', $_POST["frio_background_image"]);
Config::set('frio', 'bg_image_option', $_POST["frio_bg_image_option"]); Config::set('frio', 'bg_image_option', $_POST["frio_bg_image_option"]);
Config::set('frio', 'login_bg_image', $_POST["frio_login_bg_image"]);
Config::set('frio', 'css_modified', time()); Config::set('frio', 'css_modified', time());
} }
} }
@ -75,6 +76,7 @@ function theme_admin(App $a) {
$arr["contentbg_transp"] = Config::get('frio', 'contentbg_transp'); $arr["contentbg_transp"] = Config::get('frio', 'contentbg_transp');
$arr["background_image"] = Config::get('frio', 'background_image'); $arr["background_image"] = Config::get('frio', 'background_image');
$arr["bg_image_option"] = Config::get('frio', 'bg_image_option'); $arr["bg_image_option"] = Config::get('frio', 'bg_image_option');
$arr["login_bg_image"] = Config::get('frio', 'login_bg_image');
return frio_form($arr); return frio_form($arr);
} }
@ -104,7 +106,7 @@ function frio_form($arr) {
$background_image_help = "<strong>" . t("Note"). ": </strong>".t("Check image permissions if all users are allowed to visit the image"); $background_image_help = "<strong>" . t("Note"). ": </strong>".t("Check image permissions if all users are allowed to visit the image");
$t = get_markup_template('theme_settings.tpl'); $t = get_markup_template('theme_settings.tpl');
$o .= replace_macros($t, array( $ctx = array(
'$submit' => t('Submit'), '$submit' => t('Submit'),
'$baseurl' => System::baseUrl(), '$baseurl' => System::baseUrl(),
'$title' => t("Theme settings"), '$title' => t("Theme settings"),
@ -116,7 +118,13 @@ function frio_form($arr) {
'$contentbg_transp' => array_key_exists("contentbg_transp", $disable) ? "" : array('frio_contentbg_transp', t("Content background transparency"), ((isset($arr["contentbg_transp"]) && $arr["contentbg_transp"] != "") ? $arr["contentbg_transp"] : 100)), '$contentbg_transp' => array_key_exists("contentbg_transp", $disable) ? "" : array('frio_contentbg_transp', t("Content background transparency"), ((isset($arr["contentbg_transp"]) && $arr["contentbg_transp"] != "") ? $arr["contentbg_transp"] : 100)),
'$background_image' => array_key_exists("background_image", $disable ) ? "" : array('frio_background_image', t('Set the background image'), $arr['background_image'], $background_image_help), '$background_image' => array_key_exists("background_image", $disable ) ? "" : array('frio_background_image', t('Set the background image'), $arr['background_image'], $background_image_help),
'$bg_image_options' => Image::get_options($arr), '$bg_image_options' => Image::get_options($arr),
)); );
if ( array_key_exists("login_bg_image", $arr ) && !array_key_exists("login_bg_image", $disable ) ) {
$ctx['$login_bg_image'] = array('frio_login_bg_image', t('Login page background image'), $arr['login_bg_image'], $background_image_help);
}
$o .= replace_macros($t, $ctx);
return $o; return $o;
} }

View file

@ -3005,3 +3005,68 @@ section .profile-match-wrapper {
float: left; float: left;
} }
/**
* Login page
*/
.mod-home.is-not-singleuser,
.mod-login {
background-image: linear-gradient(to right, rgba(0,0,0, 0.7) , rgba(0,0,0, 0.4)), url($login_bg_image);
background-size: cover;
background-attachment: fixed;
background-position: center;
padding-top: 0;
}
.mod-home.is-not-singleuser nav.navbar,
.mod-login nav.navbar { background-color: transparent }
.mod-home.is-not-singleuser #topbar-second,
.mod-login #topbar-second {
background-color: transparent;
box-shadow: unset;
border: 0
}
.mod-home.is-not-singleuser #content > h1,
.mod-login #content > h1 {
color: #eee;
}
@media screen and (min-width: 700px) {
.mod-home.is-not-singleuser #content > #login-form,
.mod-login #content > #login-form {
width: 50%;
background-color: #fff;
color: #444;
padding: 1em;
float: right;
position: relative;
margin-top: 4em;
}
.mod-home.is-not-singleuser #content > #login-form:before,
.mod-login #content > #login-form:before {
display: block;
position: absolute;
content: " ";
background-color: rgba(255,255,255,0.1);
width:90%;
height: 110%;
top: -5%;
left: 5%;
z-index: -1;
}
.mod-home.is-not-singleuser #content > #login-form:after,
.mod-login #content > #login-form:after {
display: block;
position: absolute;
content: " ";
background-color: rgba(255,255,255,0.2);
width:80%;
height: 120%;
top: -10%;
left: 10%;
z-index: -1;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 KiB

View file

@ -54,9 +54,12 @@ if (!isset($minimal)) {
} }
echo ' echo '
<meta name="theme-color" content="' . $nav_bg . '" />'; <meta name="theme-color" content="' . $nav_bg . '" />';
$is_singleuser = Config::get('system','singleuser');
$is_singleuser_class = $is_singleuser ? "is-singleuser" : "is-not-singleuser";
?> ?>
</head> </head>
<body id="top"> <body id="top" class="mod-<?php echo $a->module." ".$is_singleuser_class;?>">
<a href="#content" class="sr-only sr-only-focusable">Skip to main content</a> <a href="#content" class="sr-only sr-only-focusable">Skip to main content</a>
<?php <?php
if (x($page, 'nav') && !$minimal) { if (x($page, 'nav') && !$minimal) {

View file

@ -42,6 +42,7 @@ if ($a->module !== 'install') {
$contentbg_transp = Config::get("frio", "contentbg_transp"); $contentbg_transp = Config::get("frio", "contentbg_transp");
$background_image = Config::get("frio", "background_image"); $background_image = Config::get("frio", "background_image");
$bg_image_option = Config::get("frio", "bg_image_option"); $bg_image_option = Config::get("frio", "bg_image_option");
$login_bg_image = Config::get("frio", "login_bg_image");
$modified = Config::get("frio", "css_modified"); $modified = Config::get("frio", "css_modified");
// There is maybe the case that the user did never modify the theme settings. // There is maybe the case that the user did never modify the theme settings.
@ -96,6 +97,7 @@ $link_color = (empty($link_color) ? "#6fdbe8" : $link_color);
$bgcolor = (empty($bgcolor) ? "#ededed" : $bgcolor); $bgcolor = (empty($bgcolor) ? "#ededed" : $bgcolor);
// The background image can not be empty. So we use a dummy jpg if no image was set. // The background image can not be empty. So we use a dummy jpg if no image was set.
$background_image = (empty($background_image) ? 'img/none.jpg' : $background_image); $background_image = (empty($background_image) ? 'img/none.jpg' : $background_image);
$login_bg_image = (empty($login_bg_image) ? 'img/login_bg.jpg' : $login_bg_image);
$modified = (empty($modified) ? time() :$modified); $modified = (empty($modified) ? time() :$modified);
$contentbg_transp = ((isset($contentbg_transp) && $contentbg_transp != "") ? $contentbg_transp : 100); $contentbg_transp = ((isset($contentbg_transp) && $contentbg_transp != "") ? $contentbg_transp : 100);
@ -175,6 +177,7 @@ $options = array (
'$contentbg_transp' => $contentbg_transp, '$contentbg_transp' => $contentbg_transp,
'$background_image' => $background_image, '$background_image' => $background_image,
'$background_size_img' => $background_size_img, '$background_size_img' => $background_size_img,
'$login_bg_image' => $login_bg_image,
); );
$css_tpl = file_get_contents('view/theme/frio/css/style.css'); $css_tpl = file_get_contents('view/theme/frio/css/style.css');

View file

@ -20,7 +20,7 @@
<div id="login-extra-links" class="list-unstyled"> <div id="login-extra-links" class="list-unstyled">
{{if $register}}<a href="register" title="{{$register.title|escape:'html'}}" id="register-link">{{$register.desc}}</a>{{/if}} {{if $register}}<a href="register" title="{{$register.title|escape:'html'}}" id="register-link">{{$register.desc}}</a>{{/if}}
<a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link" class="pull-right">{{$lostlink}}</a> <a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link">{{$lostlink}}</a>
</div> </div>
<div id="login-submit-wrapper" class="pull-right" > <div id="login-submit-wrapper" class="pull-right" >

View file

@ -30,6 +30,8 @@
{{/foreach}} {{/foreach}}
</div> </div>
{{if $login_bg_image}}{{include file="field_fileinput.tpl" field=$login_bg_image}}{{/if}}
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
$("#frio_nav_bg, #frio_nav_icon_color, #frio_background_color, #frio_link_color").colorpicker({format: 'hex', align: 'left'}); $("#frio_nav_bg, #frio_nav_icon_color, #frio_background_color, #frio_link_color").colorpicker({format: 'hex', align: 'left'});