Merge branch 'qjh' of https://bdgit.educoder.net/pvtfxms7o/yudao

front-end/mall4uni/src/pages/accountLogin/accountLogin.scss

@@ -1,8 +1,18 @@
+/* 
+.con 类用于设置一个容器的样式，将背景颜色设置为白色，高度设为100%（通常是相对于父元素的高度占满），
+并且距离顶部有50px的外边距，可用于页面中某个主要内容区域的整体样式设置
+*/
 .con {
   background: #fff;
   height: 100%;
   margin-top: 50px;
 }
+
+/* 
+image 选择器用于设置页面中图片元素的样式，使其以块级元素显示（默认是行内元素，设置为块级方便布局等操作），
+宽度和高度都设置为150rpx，在水平方向上自动居中（通过 margin: auto 实现），并且设置了圆角为50%使其呈现圆形外观，
+同时在底部设置了8%的外边距，用于和下方元素保持一定的间距
+*/
 image {
   display: block;
   width: 150rpx;
@@ -13,11 +23,22 @@ image {
   height: 150rpx;
   margin-bottom: 8%;
 }
+
+/* 
+.login-form 类用于设置登录表单相关元素的样式，宽度占父元素的90%，并且在水平方向上自动居中（通过 margin: 0 auto 实现），
+在底部设置了20%的外边距，用于和下方元素留出间隔，可用于包裹登录表单内的各种输入框、按钮等元素，使其整体布局合理
+*/
 .login-form {
   width: 90%;
   margin: 0 auto;
   margin-bottom: 20%;
 }
+
+/* 
+authorized-btn 类用于设置授权按钮的样式，宽度占父元素的90%，在水平方向上自动居中，文本内容居中显示，
+背景颜色设置为绿色（#0ab906），边框颜色和背景色一致且宽度为1rpx，文字颜色设为白色，设置了6rpx的圆角，字体大小为26rpx，
+内部有一定的内边距（8rpx），并且在顶部设置了80rpx的外边距，用于和上方元素间隔开，重复定义的样式属性可能是为了强调或者方便后续修改调整
+*/
 .authorized-btn {
   width: 90%;
   margin: 0 auto;
@@ -35,6 +56,12 @@ image {
   padding: 8rpx;
   margin-top: 80rpx;
 }
+
+/* 
+to-idx-btn 类用于设置跳转到首页按钮（推测，根据命名）的样式，宽度占父元素的90%，水平自动居中，文本居中，
+背景颜色设为灰色（#eeeeee），文字颜色为深灰色（#333），设置了6rpx的圆角，字体大小为26rpx，有8rpx的内边距，
+在顶部设置了30rpx的外边距，同样存在重复定义的样式属性，作用与上述类似
+*/
 .to-idx-btn {
   width: 90%;
   margin: 0 auto;
@@ -50,6 +77,11 @@ image {
   padding: 8rpx;
   margin-top: 30rpx;
 }
+
+/* 
+form-title 类用于设置表单标题的样式，宽度占满父元素（100%），在底部设置了50rpx的外边距，
+字体大小为32rpx，文本居中显示，颜色设置为蓝色（#00a0e9），重复定义的外边距和字体大小属性可能是误写或者便于后续调整
+*/
 .form-title {
   width: 100%;
   margin-bottom: 50rpx;
@@ -59,11 +91,22 @@ image {
   margin-bottom: 50rpx;
   font-size: 32rpx;
 }
+
+/* 
+.item 类用于设置某个元素的样式，使其以块级元素显示（方便布局等），在底部设置了30rpx的外边距，
+可能用于表单内各个输入项等元素的基础样式设置，同样存在重复定义外边距属性的情况
+*/
 .item {
   display: block;
   margin-bottom: 30rpx;
   margin-bottom: 30rpx;
 }
+
+/* 
+.account 类用于设置账号相关输入框等元素的样式，使其以弹性盒子布局显示（flex布局），
+背景颜色设置为浅灰色（#f8f8f8），有15rpx的内边距，使用了盒模型为 border-box（保证内边距不会撑大元素尺寸），字体大小为26rpx，
+并且在垂直方向上让内部元素居中对齐（通过 align-items: center 实现），内部还对 input 子元素设置了样式
+*/
 .account {
   display: flex;
   background: #f8f8f8;
@@ -71,28 +114,51 @@ image {
   box-sizing: border-box;
   font-size: 26rpx;
   align-items: center;
+
   input {
+    /* 
+    给 input 元素设置左边的内边距为20rpx，宽度占父元素的75%，用于控制输入框内文本距离左边框的距离以及输入框自身的宽度占比
+    */
     padding-left: 20rpx;
     width: 75%;
     padding-left: 20rpx;
   }
 }
+
+/* 
+button 元素的 ::after 伪元素样式设置，将其边框设置为0，并且通过!important 提升优先级，确保该样式生效，
+通常用于去除按钮点击等操作后默认生成的边框样式等情况
+*/
 button {
   &::after {
     border: 0 !important;
   }
 }
+
+/* 
+operate 类用于设置某个操作相关元素的样式，使其以弹性盒子布局显示（flex布局），
+并且通过 justify-content: space-between 让内部元素在水平方向上两端对齐，均匀分布，同时在垂直方向上居中对齐（通过 align-items: center 实现），
+可用于操作按钮组等元素的布局设置
+*/
 .operate {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
 
+/* 
+to-register 类用于设置跳转到注册页面链接（推测，根据命名）的样式，字体大小为28rpx，文字颜色设置为蓝色（#00AAFF），
+可用于引导用户进行注册操作相关的文本样式设置，同样存在重复定义字体大小属性的情况
+*/
 .to-register {
   font-size: 28rpx;
   color: #00AAFF;
   font-size: 28rpx;
 }
+
+/* 
+.error 类用于设置错误提示相关元素的整体样式，内部有.error-text 类用于更具体的错误提示文本等样式设置
+*/
 .error {
   .error-text {
     display: block;
@@ -103,7 +169,13 @@ button {
     margin-top: 10rpx;
     font-size: 28rpx;
     margin-top: 10rpx;
+
     .warning-icon {
+      /* 
+     .warning-icon 类用于设置错误提示图标相关元素的样式，使其以行内块元素显示，颜色设为白色，
+      宽度和高度都为26rpx，设置了行高为26rpx保证文本垂直居中，背景颜色为红色（#e43130），设置了50%的圆角使其呈现圆形外观，
+      文本在水平方向上居中显示，在右边设置了12rpx的外边距，用于和旁边的错误提示文本间隔开，同样存在重复定义尺寸等属性的情况
+      */
       display: inline-block;
       color: #fff;
       width: 26rpx;