我正在开发一个小型流星应用程序,它使用帐户ui进行用户身份验证。
我添加了无样式的包但我不知道如何使用css设置样式,甚至(如果可能的话)更改帐户ui html。
我该怎么做才能“引导它”,将其包含在导航栏中并根据自己的喜好设计样式?
问候,
JoãoBernardo
答案 0 :(得分:1)
如果您想直接进入并更改模板,那么最简单的解决方案就是从您的软件包依赖项中删除帐户 - ui-unstyled,然后将其直接添加到您可以自由编辑的本地软件包目录中
(如果您对ui包附带的任何预制css不感兴趣,您应该使用帐户-ui-unstyled而不是account-ui,但以下步骤适用于这两个包。)
通过这样做,您将失去未来对软件包所做改进的好处,并且您的本地软件包可能会因未来的改进而中断。
首先从命令行删除帐户-ui-unstyled:
meteor remove accounts-ui-unstyled
获取包here的副本,将其重命名并包含在您的本地/包中。然后在命令行上使用meteor add your-package-name
或在.meteor / packages中手动使用,你应该有一个本地副本可以自由更改。
如果方便的话,您可以使用现有的css文件放置您创建的新css。样式化与其他任何样式没有什么不同 - 挂钩到它的ID和类等,或者改变它们,因为你现在可以自由地做。
答案 1 :(得分:0)
为登录和注册创建您自己的html
模板,类似于以下内容。根据您的口味设计风格。
meteor add accounts-password accounts-ui
<template name="login">
<form class="login-form">
<div class="panel panel-default">
<div class="panel-heading">
<h3>Login</h3>
</div>
<div class="panel-body">
<div class="form-group">
<label>Email</label>
<input type="email" class="form-control" id="email" placeholder="Email address">
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" id="password" placeholder="password">
</div>
</div>
<div class="panel-footer">
<button type="submit" class="btn btn-danger btn-lg">Login</button>
</div>
</div>
</form>
</template>
您现在可以在模板事件中调用Meteor.loginWithPassword
,如下所示:
Template.login.events({
'submit .login-form': function(e) {
e.preventDefault();
var email = e.target.email.value;
var password = e.target.password.value;
Meteor.loginWithPassword(email, password,function(error){
if(error) {
//do something if error occurred or
}else{
FlowRouter.go('/');
}
});
}
});
您也可以创建另一个注册表单。
只需致电Accounts.createUser(object, callback);