Skip to content

Commit

Permalink
💄 重新设计时光圈列表样式
Browse files Browse the repository at this point in the history
  • Loading branch information
@Licoy
Licoy committed Feb 5, 2023
1 parent e536179 commit 5213d34
Show file tree
Hide file tree
Showing 6 changed files with 83 additions and 30 deletions.
14 changes: 7 additions & 7 deletions assets/dist/style/libs.min.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion assets/dist/style/screen.min.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion assets/dist/style/style.min.css
View file

Large diffs are not rendered by default.

19 changes: 19 additions & 0 deletions assets/style/screen.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,4 +42,23 @@
}
}
}
#page-moments{
.moments-item{
.meta{
justify-content: flex-start;
flex-direction: row;
align-items: center;
.info{
margin-left: 10px;
}
}
.moment-content-box{
.al{
transform: rotate(180deg);
top: -16px;
left: 4px;
}
}
}
}
}
35 changes: 31 additions & 4 deletions assets/style/style.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ blockquote {
}
}

&.layui-layer-prompt .layui-layer-input{
&.layui-layer-prompt .layui-layer-input {
background-color: var(--pk-bg-box-content) !important;
border: none !important;
color: var(--pk-c-font);
Expand Down Expand Up @@ -660,7 +660,7 @@ a:hover {
}

.btn:hover,
.btn:focus, .form-control:hover, .form-control:focus, button:focus, .abc-checkbox label:focus, .form-check-input:focus,.layui-layer-input,.layui-layer-input:focus {
.btn:focus, .form-control:hover, .form-control:focus, button:focus, .abc-checkbox label:focus, .form-check-input:focus, .layui-layer-input, .layui-layer-input:focus {
outline: none;
box-shadow: none;
}
Expand Down Expand Up @@ -2064,20 +2064,47 @@ a:hover {
}

.user-center-menus {
.sub-title{
.sub-title {
.fs12;
color: var(--pk-c-secondary);
}

.list-group-item:hover, .current {
background-color: var(--pk-c-primary);
color: #fff;
.sub-title{

.sub-title {
color: #fff !important;
}
}
}
}

#page-moments {
.moments-item {
.meta {
display: flex;
justify-content: center;
flex-direction: column;
}

.moment-content-box {
position: relative;

.al {
position: absolute;
width: 0;
height: 0;
top: 4px;
left: -16px;
border: 8px solid;
border-color: var(--pk-bg-box) transparent transparent transparent;
transform: rotate(90deg);
}
}
}
}

//企业风格
#index-company {
.bgimg {
Expand Down
41 changes: 24 additions & 17 deletions pages/template-moments.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
$page = get_query_var('paged') ? get_query_var('paged') : 1;
$cache_key = sprintf(PKC_MOMENTS, $page);
$posts = pk_cache_get($cache_key);
if(!$posts){
if (!$posts) {
$posts = query_posts(array(
'post_type' => 'moments',
'posts_per_page' => 10,
Expand All @@ -29,23 +29,27 @@
class="col-lg-<?php pk_hide_sidebar_out('12', '8') ?> col-md-12 <?php pk_open_box_animated('animated fadeInLeft') ?> ">
<?php foreach ($posts as $post):setup_postdata($post);
the_post(); ?>
<div class="mt20 p-block puock-text moments-item">
<div class="meta p-flex-sc">
<div class="avatar mr10">
<img <?php echo pk_get_lazy_img_info(get_avatar_url(get_the_author_meta('email')),'md-avatar mt-1') ?>
alt="<?php the_author_meta('display_name') ?>"
title="<?php the_author_meta('display_name') ?>">
<div class="mb20 puock-text moments-item">
<div class="row">
<div class="col-12 col-md-1">
<a class="meta ta3" href="<?php echo get_author_posts_url($post->post_author) ?>">
<div class="avatar mb10">
<img <?php echo pk_get_lazy_img_info(get_avatar_url(get_the_author_meta('email')), 'md-avatar mt-1') ?>
alt="<?php the_author_meta('display_name') ?>"
title="<?php the_author_meta('display_name') ?>">
</div>
<div class="t-line-1 info fs12"><?php the_author_meta('display_name') ?></div>
</a>
</div>
<div class="info fs12">
<div><?php the_author_meta('display_name') ?></div>
<div class="c-sub"><?php echo get_the_date('Y-m-d'); ?></div>
</div>
</div>
<div class="mt10 moment-content <?php get_entry_content_class() ?>">
<?php the_content(); ?>
</div>
<div class="mt10 moment-footer p-flex-s-right">
<div class="col-12 col-md-11">
<div class="p-block moment-content-box">
<span class="al"></span>
<div class="mt10 moment-content <?php get_entry_content_class() ?>">
<?php the_content(); ?>
</div>
<div class="mt10 moment-footer p-flex-s-right">
<span class="t-sm c-sub">
<span class="mr-2"><i class="fa-regular fa-clock mr-1"></i><?php pk_get_post_date(); ?></span>
<?php if (!pk_is_checked('hide_post_views')): ?>
<span class="mr-2"><i
class="fa-regular fa-eye mr-1"></i><?php pk_get_post_views() ?></span>
Expand All @@ -55,7 +59,10 @@ class="fa-regular fa-eye mr-1"></i><?php pk_get_post_views() ?></span>
<i class="fa-regular fa-comment mr-1"></i>
<?php echo get_comments_number() ?></a>
<?php endif; ?>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<?php endforeach;
Expand Down

0 comments on commit 5213d34

Please sign in to comment.