Last active
November 22, 2019 05:36
-
-
Save wadadanet/e0304f7d611678cea2f847d7df9b4762 to your computer and use it in GitHub Desktop.
fukidashi用のstyle
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.wp-block-cgb-block-fukidashi-block { | |
padding: 0.1rem; | |
display: flex; | |
justify-content: space-between; | |
align-items: flex-start; | |
background-color: transparent; | |
.image { | |
width: 70px; | |
.wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter), | |
.aligncenter { | |
margin: 0; | |
} | |
img { | |
border-radius: 50%; | |
overflow: hidden; | |
} | |
figcaption { | |
font-size: 0.8em; | |
margin-top: 0.5rem; | |
} | |
} | |
.comment { | |
width: calc(100% - 90px); | |
box-sizing: border-box; | |
padding: 1em; | |
background-color: #fff; | |
border-radius: 10px; | |
border: 1px solid #eee; | |
position: relative; | |
&:before , &:after { | |
content: ""; | |
position: absolute; | |
width: 0; | |
height: 0; | |
border-style: solid; | |
} | |
&:before { | |
border-width: 6px 12px 6px 0; | |
border-color: transparent #ffffff transparent transparent; | |
left: -12px; | |
top: calc(50% - 12px); | |
z-index: 2; | |
} | |
&:after { | |
border-width: 7px 14px 7px 0; | |
border-color: transparent #eee transparent transparent; | |
left: -14px; | |
top: calc(50% - 13px); | |
z-index: 1; | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment