Skip to content

Commit

Permalink
Merge pull request #21 from vektor-inc/revert-19-feature/pattern-list
Browse files Browse the repository at this point in the history 
Revert "パターンリストブロック調整"
  • Loading branch information
@mtdkei
mtdkei authored Dec 12, 2024
2 parents 9ca3b0d + cba3e76 commit eb866d5
Show file tree
Hide file tree
Showing 7 changed files with 304 additions and 764 deletions.
202 changes: 17 additions & 185 deletions assets/src/scss/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@
margin-bottom: 1rem;
}
&_iframe-outer {
padding: 0 1.25rem;
&--single {
margin: 0 calc( 50% - 50vw );
}
Expand All @@ -29,206 +28,39 @@
}

&--archive {
position: relative;
width: 100%;
height: 200px;
position: relative;
outline: 1px solid #EEEEEE;
overflow: hidden;
img {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
object-fit: cover;
}
iframe {
width: 400%;
height:800px;
pointer-events: none;
transform: scale(0.25);
transform-origin: 0 0;
pointer-events: none;
width: 400%;
height:800px;
}
}

}

&_posts {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--col-width-min, 300px), 1fr));
gap: var(--gap, 1.5rem);
row-gap: var(--gap-row, 1.5rem);
overflow: hidden;
> article {
display: grid;
grid-template-rows: auto auto 1fr auto auto;
width: 100%;
height: 100%;
padding-top: 1.25rem;
row-gap: 1.25rem;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: .25rem;
font-size: .85rem;
box-sizing: border-box;
&:not(:has(.vkpdc_iframe-outer)),
&:not(:has(.vkpdc_post_info)),
&:not(:has(.vkpdc_post_entry_meta)),
&:not(:has(.vkpdc_buttons)) {
grid-template-rows: auto 1fr auto auto;
}
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_post_info)),
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_post_entry_meta)),
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_buttons)),
&:not(:has(.vkpdc_post_info):has(.vkpdc_post_entry_meta)),
&:not(:has(.vkpdc_post_info):has(.vkpdc_post_buttons)) {
grid-template-rows: auto 1fr auto;
}
&:not(:has(.vkpdc_post_info):has(.vkpdc_post_entry_meta):has(.vkpdc_post_buttons)),
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_post_entry_meta):has(.vkpdc_post_buttons)),
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_post_info):has(.vkpdc_post_entry_meta)),
&:not(:has(.vkpdc_iframe-outer):has(.vkpdc_post_info):has(.vkpdc_post_buttons)) {
grid-template-rows: auto 1fr;
}
&:not(:has(.vkpdc_buttons)) {
padding-bottom: 1.25rem;
}
}
}

&_post {
&_title,
&_info,
&_entry_meta {
padding: 0 1.25rem;
}
&_title {
line-height: 1.4;
font-size: .9rem;
font-weight: bold;
&_new {
margin-left: .4em;
font-size: .8em;
white-space: nowrap;
color: red;
}
}
&_taxonomy,
&_id {
display: flex;
flex-direction: row;
margin: 0;
padding: 0;
margin-bottom: .375rem;
gap: .375rem;
&_title {
margin: 0;
padding: 0;
&_inner {
display: inline-block;
min-width: 10em;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 3px;
text-align: center;
font-weight: normal;
}
}
&_contents {
margin: 0;
padding: 0;
vertical-align: middle;
}
}
&_entry_meta,
&_date {
display: flex;
gap: .75rem;
justify-content: space-between;
align-items: center;
font-size: .7rem;
}
&_author,
&_date > span {
display: flex;
gap: .375rem;
align-items: center;
&_avatar {
position: relative;
width: 1.4em;
height: 1.4em;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 50%;
overflow: hidden;
img {
position: absolute;
top: 0;
width: 100%;
}
}
i {
margin-right: 0;
}
&_buttons {
min-width:160px;
flex: 1;
display: block;
& .vkpdc_button--copy {
background-color: #D8141C;
color:#FFF;
text-align: center;
}
}

&_buttons.vkpdc_buttons--archive {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
justify-content: space-between;
margin-top: auto;
padding: 1.25rem;
gap: .75rem .75rem;
min-width: 120px;
background-color: rgba(0, 0, 0, .05);
}
&_button {
&_button {
width: 100%;
display: block;
padding: .375rem .85rem;
border: 1px solid transparent;
border-radius: .25rem;
text-align: center;
cursor: pointer;
text-decoration: none;

padding: 0.5rem 0.85rem;
&-outer {
width: 100%;
display: block;
}
&--icon {
margin-right: .375rem;
}
&--view {
background-color: #fff;
border-color: rgba(0,0,0,0.2);
}
&--copy {
background-color: var(--wp--preset--color--vk-color-primary, #337ab7);
border-color: var(--wp--preset--color--vk-color-primary-dark, #296292);
color: #FFF;
&:hover {
color: #FFF;
}
}
&:hover {
opacity: .8;
box-shadow: 0 0 0 .2rem rgba(171, 184, 195, .25);
transition: 0.5s;
}
i {
margin-right: .375rem;
}
}

@media (min-width: 576px) {
&_posts {
grid-template-columns: repeat(auto-fit, minmax(var(--col-width-min-tablet, 300px), 1fr));
}
}

@media (min-width: 992px) {
&_posts {
grid-template-columns: repeat(auto-fit, minmax(var(--col-width-min-pc, 300px), 1fr));
}
}
}

}
68 changes: 0 additions & 68 deletions blocks/src/pattern-list/block.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,74 +18,6 @@
"type": "string",
"default": "date"
},
"display_author": {
"type": "boolean",
"default": true
},
"display_date_publiched": {
"type": "boolean",
"default": true
},
"display_date_modified": {
"type": "boolean",
"default": true
},
"display_new": {
"type": "boolean",
"default": true
},
"display_taxonomies": {
"type": "boolean",
"default": true
},
"pattern_id": {
"type": "boolean",
"default": true
},
"display_btn_view": {
"type": "boolean",
"default": true
},
"display_btn_copy": {
"type": "boolean",
"default": true
},
"display_image": {
"type": "string",
"default": "featured"
},
"thumbnail_size": {
"type": "string",
"default": "large"
},
"new_date": {
"type": "number",
"default": 7
},
"new_text": {
"type": "string",
"default": "NEW!!"
},
"colWidthMin": {
"type": "string",
"default": "300px"
},
"colWidthMinTablet": {
"type": "string",
"default": "300px"
},
"colWidthMinPC": {
"type": "string",
"default": "300px"
},
"gap": {
"type": "string",
"default": "1.5rem"
},
"gapRow": {
"type": "string",
"default": "1.5rem"
},
"className": {
"type": "string",
"default": ""
Expand Down
Loading

0 comments on commit eb866d5

Please sign in to comment.