作者:手机用户2502938985 | 来源:互联网 | 2023-06-13 20:18
我正在使用MaterializeCSS库通过Firebase构建网络应用。到目前为止,一切都进行得很顺利。视口仅占据仪表板中屏幕的一半-它会切断一半的内容!
我还添加了一个FAB(浮动操作按钮),其位置为absolute
和bottom:0;right:0;
,但它仍漂浮在页面的一半以下!
真的很感谢您的帮助,因为它会减慢此项目的后端开发速度。
这是我的代码:
Profile Picture add This is how other people will see you,whether they are members or group leaders.
// When user signs in
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in
var email = user.email;
var emailVerified = user.emailVerified;
// Display email under right tab
document.getElementById("emailDisplay").innerHTML = "Hi," + user.email + ".";
// Display email in sidebar
document.getElementById("sidebar-email").innerHTML = user.email;
// Display profile picture
document.getElementById("profileImageCurrent").innerHTML = "";
// Set version to the client version defined above
document.getElementById("version").innerHTML = "You're running version " + clientVersion;
// Get user data from Firestore
var docRef = db.collection("users").doc(user.email);
docRef.get().then(function(doc) {
if (doc.exists) {
var userChurch = JSON.stringify(doc.data());
userChurch = JSON.parse(userChurch);
userChurch = userChurch["church"];
db.collection("churches").where("literalName","==",userChurch)
.get()
.then(function(querysnapshot) {
querysnapshot.forEach(function(doc) {
// doc.data() is never undefined for query doc snapshots
var literalChurch = doc.data();
literalChurch = JSON.stringify(literalChurch);
literalChurch = JSON.parse(literalChurch);
console.log(literalChurch["literalName"]);
document.getElementById("churchName").innerHTML = literalChurch["literalName"];
});
})
.catch(function(error) {
console.log("Error getting documents: ",error);
});
} else {
// doc.data() will be undefined in this case
console.log("No such document!");
}
}).catch(function(error) {
console.log("Error getting document:",error);
});
} else {
// User isn't logged in
window.location.replace("index.html");
}
});
// Log out user
function userLogOut() {
firebase.auth().signOut().then(function() {
window.location.replace("index.html")
}).catch(function(error) {
// If there's somehow an error logging out
window.location.replace("error.html");
});
}
function addMember() {
console.log("Feature has not yet been implemented.");
M.toast({html: 'This feature has not yet been implemented!'})
}
// the css
nav {
padding-left: 20px;
padding-right: 20px;
}
nav i {
color: #ffffff;
}
.email {
font-size: 20px;
}
.s12 {
padding-left: 20px;
padding-right: 20px;
font-size: 20px;
}
.version {
font-size: 20px;
}
.tabs .indicator {
background-color: #039be5 !important;
}
.tabs .active {
background-color: #039be5;
}
.fixed-action-btn {
position: absolute !important;
bottom: 0;
right: 0;
}
.membersEditor {
height: 100%;
}
.addphoto {
color: white;
padding: 0px;
width: 100%;
}
#accountInfo {
height: 100% !important;
}