Improved site responsive

This commit is contained in:
Pierre HUBERT 2018-08-03 15:27:56 +02:00
parent c973b33ac8
commit 499aefbc1d
2 changed files with 48 additions and 0 deletions

View File

@ -20,10 +20,27 @@ header .dropdown .fa-gear {
vertical-align: middle; vertical-align: middle;
} }
.main-header .alternate-latest-posts-button {
display: none;
}
@media (max-width: 360px) { @media (max-width: 360px) {
.main-header[forActiveUser="true"] .navbar-brand { .main-header[forActiveUser="true"] .navbar-brand {
display: none; display: none;
} }
.main-header .alternate-latest-posts-button {
display: block;
}
.nav > li > a {
padding: 10px 10px;
}
.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
width: 100%;
left: 0px;
}
} }
@media (max-width: 767px) { @media (max-width: 767px) {

View File

@ -32,6 +32,9 @@ ComunicWeb.components.menuBar.authenticated = {
//Add user name //Add user name
this.addUserName(navbarRightElemList); this.addUserName(navbarRightElemList);
//Alternate latest posts button
this.addAlternateLatestPostsButton(navbarRightElemList);
//Add friends list button //Add friends list button
this.addFriendListButton(navbarRightElemList); this.addFriendListButton(navbarRightElemList);
@ -128,6 +131,34 @@ ComunicWeb.components.menuBar.authenticated = {
return dropdownContent; return dropdownContent;
}, },
/**
* Add alternate latest posts button
* (if the screen is too small to display "Comunic")
*
* @param {HTMLElement} target The target for the ubutton
*/
addAlternateLatestPostsButton: function(target){
//Create button
var button = createElem2({
type: "li",
appendTo: target,
class: "alternate-latest-posts-button"
});
//Create link
var link = createElem("a", button);
createElem2({
type: "i",
appendTo: link,
class: "fa fa-history"
});
//Makes link lives
link.addEventListener("click", function(){
openPage("latest");
});
},
/** /**
* Add friendsList toggle button * Add friendsList toggle button
* *