miniProgram/pages/testSAS/testSAS.wxss

/* miniprogram/pages/testSAS/testSAS.wxss */
page {
  background: rgb(211, 226, 249);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.sheet {
  background: #fff;
  border-radius: 36rpx;
  margin-top: 80rpx;
  width: 95%;
  height: 580rpx;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.naire {
  height: 450rpx;
}
.question {
  font-size: 36rpx;
  font-weight: bold;
  margin-top: 40rpx;
  margin-left: 32rpx;
}
.question_1 {
  font-size: 30rpx;
  font-weight: 500;
  margin-top: 20rpx;
  margin-left: 32rpx;
}
.question_2 {
  font-size: 20rpx;
  margin-top: 20rpx;
  margin-left: 32rpx;
  color:red;
}
.border {
  height: 2rpx;
  width: 90%;
  background-color: #d4d4d4;
  margin: 16rpx auto;
}
.radio-group-1 {
  display: flex;
  flex-direction: column;
  font-size: 30rpx;
  text-indent: 14rpx;
  margin-top: 40rpx;
}

.radio-group-2 {
  display: flex;
  flex-direction: column;
  font-size: 30rpx;
  text-indent: 14rpx;
}

.radio {
  margin-bottom: 14rpx;
}

.button-group {
  display: flex;
  flex-direction: row;
  width: 80%;
  margin: auto;
  justify-content: space-between;
  margin-top:20rpx;
}
.button {
  background: #fcbe39;
  border-radius: 100rpx;
  font-size: 30rpx;
  line-height: 52rpx;
  height: 52rpx;
  width: 172rpx;
  font-weight: bold;
  color: #fff;
}
.button::after {
  border: 0;
}
.idX {
  text-align: center;
  font-size: 38rpx;
  color: #ffffff;
  font-weight: bold;
  margin: auto;
  margin-top: 10rpx;
}
.id {
  text-align: center;
  font-size: 24rpx;
  color: #000000;
  margin: auto;
  margin-top: 20rpx;
}

.idR {
  text-align: center;
  font-size: 24rpx;
  color: #000000;
  margin: auto;
  margin-top: 2rpx;
  font-weight:700
}

form {
	width: 84%;
}


/* 睡眠时间容器样式 */  
.sleep-time-container {  
  display: flex;  
  align-items: center;  
  margin-top: 20px; /* 你可以根据需要调整 */  
}  
  
/* 文本样式 */  
.sleep-time-container text {  
  margin-right: 10px; /* 输入框前的文本与输入框之间的间距 */  
  font-size: 16px; /* 字体大小 */  
  color: #333; /* 字体颜色 */  
  margin:20rpx;
}  
  
/* 输入框样式 */  
.sleep-time-container input {  
  flex: 1; /* 让输入框自动填充剩余空间 */  
  height: 30px; /* 输入框高度 */  
  padding: 0 5px; /* 输入框内边距 */  
  font-size: 16px; /* 字体大小 */  
  border: 1px solid #ccc; /* 边框 */  
  width:30rpx;
}  
  
/* "点钟"文本样式 */  
.sleep-time-container text:last-child {  
  margin-left: 10px; /* 输入框后的文本与输入框之间的间距 */  
}

.prompt {  
  /* 其他样式，如 padding, margin 等 */ 
 margin-top:10rpx;
 padding:10rpx;
}  
  
.small-red-text {  
  font-size: 12px; /* 你可以根据需要调整字体大小 */  
  color: #000000; /* 红色字体 */  
  /* 如果需要处理多行文本，可以添加如下样式 */  
  word-wrap: break-word; /* 防止单词被截断 */  
  white-space: normal; /* 正常的空格处理 */
}

.small-red-text_ts {  
  font-size: 12px; /* 你可以根据需要调整字体大小 */  
  color: #6f6f6f;  
  /* 如果需要处理多行文本，可以添加如下样式 */  
  word-wrap: break-word; /* 防止单词被截断 */  
  white-space: normal; /* 正常的空格处理 */
  font-weight: 600;
}

.privacy-section {  
  /* 页脚样式 */  
    position: fixed;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    height: 50rpx;  
    /* background-color: #f0f0f0; */
    display: flex;  
    align-items: center;  
    justify-content: center;  
}  
  
.privacy-checkbox {  
  /* 单选按钮样式 */  
}  
  
.checkbox-text {  
  /* 单选按钮旁边的文本样式 */  
}  
  
.privacy-text {  
  /* 隐私条款文本样式 */  
  font-size: 12rpx; /* 字体大小根据需要调整 */  
}  
  
.privacy-detail-btn {  
  /* 查看隐私条款按钮样式 */  
  font-size: 25rpx;
  color: #6f6f6f;
}

.privacy-detail-btn_tk {  
  /* 查看隐私条款按钮样式 */  
  font-size: 25rpx;
  color: #3385ff;
}  
  
.other-btn {  
  /* 其他操作按钮样式 */  
}

.checkbox-item {
  display: block;  
  margin-bottom: 5rpx;  
}

checkbox {
	width:15rpx;
	height:15rpx;
}

.container_tk {  
  display: flex;  
  flex-direction: column;  
  align-items: center;  
  justify-content: center;  
  height: 100vh;  
}  
  
.modal {  
  position: fixed;  
  top: 0;  
  left: 0;  
  right: 0;  
  bottom: 0;  
  background-color: rgba(0, 0, 0, 0.5);  
  display: flex;  
  justify-content: center;  
  align-items: center;  
  z-index: 1000;  
  background-color: #fff;
  width: 100%; /* 根据需要调整 */  
  margin-bottom: 10rpx;
}  
  
.modal-content {  
  background-color: #fff;  
  padding: 1px;  
  border-radius: 10px;  
  width: 90%; /* 根据需要调整 */  
  height:90%;
  max-width: 600px; /* 限定最大宽度 */  
  box-sizing: border-box;  
  position: relative;  
  z-index: 1001;  
}  
  
.modal-close {  
  position: absolute;  
  top: 0px;  
  right: 0px;  
  font-size: 24px;  
  cursor: pointer;  
}  
  
.modal-close image {  
  width: 20px;  
  height: 20px;  
}

.container-yh {  
  display: flex;  
  flex-direction: column;  
  align-items: center;  
  justify-content: flex-start;  
  height: 500rpx;   
  padding: 20rpx;  
}  
  
.circle-container-yh {  
  display: flex;  
  align-items: center;  
  justify-content: space-between; /* 让左右文本分布在图片两侧 */  
  width: 100%; /* 根据需要调整，确保足够宽以容纳图片和文本 */  
}  
  
.circle-image-yh {  
  width: 200rpx; /* 假设圆环图片宽度 */  
  height: 200rpx; /* 假设圆环图片高度 */  
}  
  
.text-container-yh {  
  display: flex;  
  flex-direction: column; /* 文本内容垂直排列 */  
  align-items: flex-start; /* 文本内容从顶部开始排列 */  
}  
  
.left-text-yh, .right-text-yh {  
  /* 根据需要添加样式，如内边距、字体大小等 */  
  display: flex;  
  align-items: center; 
}  

.icon-yh {  
  width: 30rpx; /* 假设小图片的宽度 */  
  height: 30rpx; /* 假设小图片的高度 */  
  margin-right: 10rpx; /* 小图片与文字的间距 */  
}

.top-text-yh {  
  /* 上方文字的样式 */  
  display: flex;  
  justify-content: space-between; /* 让左右文本分布在水平方向上 */  
  align-items: center;  
  margin-top: 20rpx; /* 与圆环图片的间距 */  
}

.text-row-yh {  
  display: flex;  
  align-items: center;  
  margin-bottom: 10rpx; /* 行与行之间的间距 */  
}

.centered-text-yh {  
  position: absolute;  
  top: 85rpx; /* 垂直居中 */  
  left: 0;  
  right: 0;  
  transform: translateY(-50%); /* 垂直居中 */  
  text-align: center; /* 水平居中 */  
}  
  
.text-line-yh {  
  display: block;  
  margin-bottom: 20rpx; /* 行间距 */  
}  
  
.text-line-yh-1 {  
  color: white; /* 第一行文字颜色 */  
  font-size: 40rpx; /* 第一行文字大小 */  
}  
  
.text-line-yh-2 {  
  color: #99ff62; /* 第二行文字颜色 */  
  font-size: 120rpx; /* 第二行文字大小 */  
}  
  
.text-line-yh-3 {  
  color: white; /* 第三行文字颜色 */  
  font-size: 32rpx; /* 第三行文字大小 */  
} 

.close-btn {  
  background-color: #ccc;
  color: #333;
  border: none;
  padding: 5rpx 20rpx;
  margin-top: 20rpx;
  /* margin-bottom: 5rpx; */
  height: 100rpx;
  width: 50%;
}