|
@@ -0,0 +1,326 @@
|
|
|
|
+.activity_detail {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
+ -webkit-box-direction: normal;
|
|
|
|
+ -ms-flex-direction: column;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ -ms-flex-wrap: nowrap;
|
|
|
|
+ flex-wrap: nowrap;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ padding-top: constant(safe-area-inset-top);
|
|
|
|
+ padding-top: env(safe-area-inset-top);
|
|
|
|
+ padding-bottom: constant(safe-area-inset-bottom);
|
|
|
|
+ padding-bottom: env(safe-area-inset-bottom);
|
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ background: url(../images/bg.png) no-repeat center center;
|
|
|
|
+ background-size: 100% 100%;
|
|
|
|
+}
|
|
|
|
+.activity_detail .header {
|
|
|
|
+ position: relative;
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ text-align: center;
|
|
|
|
+ padding: 0 .24rem;
|
|
|
|
+ height: .88rem;
|
|
|
|
+ line-height: .88rem;
|
|
|
|
+ color: #fff;
|
|
|
|
+}
|
|
|
|
+.activity_detail .header .header_left {
|
|
|
|
+ position: absolute;
|
|
|
|
+ left: .24rem;
|
|
|
|
+ top: 50%;
|
|
|
|
+ margin-top: -.18rem;
|
|
|
|
+ width: .2rem;
|
|
|
|
+ height: .36rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .header .header_title {
|
|
|
|
+ -webkit-box-flex: 1;
|
|
|
|
+ -ms-flex: 1;
|
|
|
|
+ flex: 1;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: .36rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .header .header_right {
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: .24rem;
|
|
|
|
+ font-size: .32rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .content {
|
|
|
|
+ width: 100%;
|
|
|
|
+ padding: 0 .3rem;
|
|
|
|
+ overflow-y: scroll;
|
|
|
|
+}
|
|
|
|
+.activity_detail .people {
|
|
|
|
+ width: 6.58rem;
|
|
|
|
+ height: 9.53rem;
|
|
|
|
+ margin: .22rem auto 0;
|
|
|
|
+ background: url(../images/text1.png) no-repeat center center;
|
|
|
|
+ background-size: cover;
|
|
|
|
+}
|
|
|
|
+.activity_detail .dashed_line {
|
|
|
|
+ width: 6.58rem;
|
|
|
|
+ height: 1px;
|
|
|
|
+ margin: .55rem auto .46rem;
|
|
|
|
+ border-top: 1px dashed #ffe8cc;
|
|
|
|
+ opacity: 0.42;
|
|
|
|
+}
|
|
|
|
+.activity_detail .handle_area {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
+ -webkit-box-direction: normal;
|
|
|
|
+ -ms-flex-direction: column;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+}
|
|
|
|
+.activity_detail .handle_area .invite_title {
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .handle_area .invite_btn {
|
|
|
|
+ width: 5.4rem;
|
|
|
|
+ height: .9rem;
|
|
|
|
+ margin-top: .24rem;
|
|
|
|
+ line-height: .9rem;
|
|
|
|
+ background: -webkit-gradient(linear, left top, left bottom, from(#ffeacf), to(#ffd2a6));
|
|
|
|
+ background: linear-gradient(#ffeacf, #ffd2a6);
|
|
|
|
+ border-radius: .12rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: .36rem;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ color: #7F2D03;
|
|
|
|
+}
|
|
|
|
+.activity_detail .handle_area .invite_code {
|
|
|
|
+ width: 5.4rem;
|
|
|
|
+ height: .9rem;
|
|
|
|
+ margin-top: .28rem;
|
|
|
|
+ line-height: .9rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+ color: #fff;
|
|
|
|
+ border-radius: .2rem;
|
|
|
|
+ border: 0.02rem solid #ffe8cc;
|
|
|
|
+}
|
|
|
|
+.activity_detail .handle_area .invite_code .copy {
|
|
|
|
+ margin-left: .99rem;
|
|
|
|
+ color: #FFDF76;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends {
|
|
|
|
+ margin-top: .98rem;
|
|
|
|
+ padding-bottom: .6rem;
|
|
|
|
+ width: 100%;
|
|
|
|
+ background: -webkit-gradient(linear, left top, left bottom, from(#fff1e8), to(#fed9c9));
|
|
|
|
+ background: linear-gradient(#fff1e8, #fed9c9);
|
|
|
|
+ border-radius: .12rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .hasinvite_title {
|
|
|
|
+ width: 3.31rem;
|
|
|
|
+ height: .64rem;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ line-height: .64rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: #4C2200;
|
|
|
|
+ font-size: .32rem;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ background: url(../images/square.png) no-repeat center center;
|
|
|
|
+ background-size: cover;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .friend_name {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ -webkit-box-pack: justify;
|
|
|
|
+ -ms-flex-pack: justify;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ padding: .92rem .86rem 0;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .friend_name .friend_name_item {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
+ -webkit-box-direction: normal;
|
|
|
|
+ -ms-flex-direction: column;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .friend_name .friend_name_item img {
|
|
|
|
+ width: 1.2rem;
|
|
|
|
+ height: 1.2rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .friend_name .friend_name_item span {
|
|
|
|
+ margin-top: .2rem;
|
|
|
|
+ color: #888;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .get_btn {
|
|
|
|
+ display: block;
|
|
|
|
+ width: 5.2rem;
|
|
|
|
+ height: .9rem;
|
|
|
|
+ line-height: .9rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ margin: .78rem auto 0;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ font-size: .36rem;
|
|
|
|
+ border-radius: .45rem;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ border: 0;
|
|
|
|
+ outline: 0;
|
|
|
|
+ background: #F27904;
|
|
|
|
+}
|
|
|
|
+.activity_detail .hasinvite_friends .get_btn[disabled] {
|
|
|
|
+ opacity: 0.42;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_play {
|
|
|
|
+ margin-top: .4rem;
|
|
|
|
+ width: 100%;
|
|
|
|
+ background: -webkit-gradient(linear, left top, left bottom, from(#fff1e8), to(#fed9c9));
|
|
|
|
+ background: linear-gradient(#fff1e8, #fed9c9);
|
|
|
|
+ border-radius: .12rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_play .play_title {
|
|
|
|
+ width: 3.31rem;
|
|
|
|
+ height: .64rem;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ line-height: .64rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: #4C2200;
|
|
|
|
+ font-size: .32rem;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ background: url(../images/square.png) no-repeat center center;
|
|
|
|
+ background-size: cover;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_play .play_info {
|
|
|
|
+ padding: .52rem .46rem .63rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_play .play_info p {
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+ color: #67401E;
|
|
|
|
+ line-height: 1.6;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_rule {
|
|
|
|
+ margin-top: .4rem;
|
|
|
|
+ width: 100%;
|
|
|
|
+ background: -webkit-gradient(linear, left top, left bottom, from(#fff1e8), to(#fed9c9));
|
|
|
|
+ background: linear-gradient(#fff1e8, #fed9c9);
|
|
|
|
+ border-radius: .12rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_rule .rule_title {
|
|
|
|
+ width: 3.31rem;
|
|
|
|
+ height: .64rem;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ line-height: .64rem;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: #4C2200;
|
|
|
|
+ font-size: .32rem;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ background: url(../images/square.png) no-repeat center center;
|
|
|
|
+ background-size: cover;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_rule .rule_info {
|
|
|
|
+ padding: .52rem .46rem .63rem;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_rule .rule_info p {
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+ color: #67401E;
|
|
|
|
+ line-height: 1.6;
|
|
|
|
+}
|
|
|
|
+.activity_detail .activity_explain {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 100%;
|
|
|
|
+ padding: .42rem 0 .56rem;
|
|
|
|
+ color: #fff;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.invite_way {
|
|
|
|
+ position: fixed;
|
|
|
|
+ display: none;
|
|
|
|
+ bottom: 0;
|
|
|
|
+ left: 0;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 2.54rem;
|
|
|
|
+ background: #fff;
|
|
|
|
+ z-index: 99;
|
|
|
|
+}
|
|
|
|
+.invite_way .way_title {
|
|
|
|
+ margin-top: .3rem;
|
|
|
|
+ margin-bottom: .3rem;
|
|
|
|
+ font-size: .28rem;
|
|
|
|
+ color: #666;
|
|
|
|
+ text-align: center;
|
|
|
|
+}
|
|
|
|
+.invite_way .way_list {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ -ms-flex-pack: distribute;
|
|
|
|
+ justify-content: space-around;
|
|
|
|
+ padding: 0 1rem;
|
|
|
|
+}
|
|
|
|
+.invite_way .way_list .way_list_item {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ display: -ms-flexbox;
|
|
|
|
+ display: flex;
|
|
|
|
+ -webkit-box-align: center;
|
|
|
|
+ -ms-flex-align: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
+ -webkit-box-direction: normal;
|
|
|
|
+ -ms-flex-direction: column;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ text-align: center;
|
|
|
|
+}
|
|
|
|
+.invite_way .way_list .way_list_item img {
|
|
|
|
+ width: .9rem;
|
|
|
|
+ height: .9rem;
|
|
|
|
+}
|
|
|
|
+.invite_way .way_list .way_list_item span {
|
|
|
|
+ margin-top: .16rem;
|
|
|
|
+ font-size: .26rem;
|
|
|
|
+ color: #888;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
|
|
|
|
+ .activity_detail {
|
|
|
|
+ padding-top: .44rem;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+.app-layout-header{
|
|
|
|
+ background-color: inherit;
|
|
|
|
+ border-bottom: none;
|
|
|
|
+ color: #fff;
|
|
|
|
+}
|
|
|
|
+.app-layout-header>.app-back{
|
|
|
|
+ color: #fff;
|
|
|
|
+}
|
|
|
|
+.app-layout-header>.helpfriends{
|
|
|
|
+ position: absolute;
|
|
|
|
+ font-size: 17px;
|
|
|
|
+ padding-top: 2px;
|
|
|
|
+ padding-right: 11px;
|
|
|
|
+ right: 0px;
|
|
|
|
+ top: 18px;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-weight: 200;
|
|
|
|
+}
|