0

我正在自动化 AWS Cognito 中的创建用户池过程。我正在使用 yaml 文件来设置整个内容（即用户属性、IDP 等...）。我需要自定义登录页面，并且我知道我需要将 CSS 添加到特定的类列表中。我不明白在哪里或格式。

4

2 回答 2

1

我就是这样做的。您现在可以使用 AWS::Cognito::UserPoolIdentityProvider 资源

UserPoolUICustomization: 
Type: AWS::Cognito::UserPoolUICustomizationAttachment 
Properties: 
  UserPoolId: !Ref CognitoUserPool
  ClientId: !Ref CognitoUserPoolClient2 
  CSS: ".logo-customizable {
    max-width: 100%;
    max-height: 100%;
  }
       .banner-customizable {
    padding: 0px 0px 5px 0px;
    background-color: #fff;
  }
       .label-customizable {
    font-weight: 400;
  }
       .textDescription-customizable {
    padding-top: 10px;
    padding-bottom: 10px;
    display: block;
    font-size: 16px;
  }
       .idpDescription-customizable {
    padding-top: 10px;
    padding-bottom: 10px;
    display: block;
    font-size: 16px;
  }
       .legalText-customizable {
    color: #747474;
    font-size: 11px;
  }
       .submitButton-customizable {
    font-size: 14px;
    font-weight: bold;
    margin: 20px 0px 10px 0px;
    height: 40px;
    width: 100%;
    color: #fff;
    background-color: #337ab7;
  }"
于 2020-10-29T06:03:32.310 回答
0

您可以修改提供的 css 类并使用 AWS CLI 推送更新。

background-customizable
banner-customizable
errorMessage-customizable
idpButton-customizable
idpButton-customizable:hover
inputField-customizable
inputField-customizable:focus + few more.

AWS 提供了 cognito 用户池 UI 上使用的类列表，您可以对其进行修改。

使用--css ".classname{field : value}"withaws cognito-idp set-ui-customization命令进行更新。

喜欢 ：-

aws cognito-idp set-ui-customization --user-pool-id <your-user-pool-id> --client-id 
<your-app-client-id> --image-file <path-to-logo-image-file> --css ".label-
customizable{ color: <color>;}"
于 2019-09-27T19:57:06.337 回答