mirror of
https://github.com/nostalgic-css/NES.css.git
synced 2025-01-17 13:48:13 +01:00
♻️ ballonのサンプルを修正
This commit is contained in:
parent
547f32dcc8
commit
8c62eee7a6
11
css/nes.css
11
css/nes.css
@ -570,16 +570,6 @@ dl.description > dd {
|
||||
border: 4px solid #333;
|
||||
}
|
||||
|
||||
.field .input:-ms-input-placeholder {
|
||||
font-weight: lighter;
|
||||
color: rgba(51, 51, 51, 0.3);
|
||||
}
|
||||
|
||||
.field .input::-ms-input-placeholder {
|
||||
font-weight: lighter;
|
||||
color: rgba(51, 51, 51, 0.3);
|
||||
}
|
||||
|
||||
.field .input::placeholder {
|
||||
font-weight: lighter;
|
||||
color: rgba(51, 51, 51, 0.3);
|
||||
@ -754,4 +744,5 @@ dl.description > dd {
|
||||
.icon.-large.-like::before {
|
||||
box-shadow: 32px 4px 0 #1e77be,36px 4px 0 #1e77be,32px 8px 0 #1e77be,40px 8px 0 #1e77be,32px 12px 0 #1e77be,40px 12px 0 #1e77be,28px 16px 0 #1e77be,40px 16px 0 #1e77be,28px 20px 0 #1e77be,36px 20px 0 #1e77be,24px 24px 0 #1e77be,36px 24px 0 #1e77be,24px 28px 0 #1e77be,36px 28px 0 #1e77be,4px 32px 0 #1e77be,8px 32px 0 #1e77be,12px 32px 0 #1e77be,20px 32px 0 #1e77be,40px 32px 0 #1e77be,44px 32px 0 #1e77be,48px 32px 0 #1e77be,52px 32px 0 #1e77be,56px 32px 0 #1e77be,60px 32px 0 #1e77be,4px 36px 0 #1e77be,8px 36px 0 #1e77be,12px 36px 0 #1e77be,20px 36px 0 #1e77be,64px 36px 0 #1e77be,4px 40px 0 #1e77be,8px 40px 0 #1e77be,12px 40px 0 #1e77be,20px 40px 0 #1e77be,64px 40px 0 #1e77be,4px 44px 0 #1e77be,8px 44px 0 #1e77be,12px 44px 0 #1e77be,20px 44px 0 #1e77be,60px 44px 0 #1e77be,4px 48px 0 #1e77be,8px 48px 0 #1e77be,12px 48px 0 #1e77be,20px 48px 0 #1e77be,64px 48px 0 #1e77be,4px 52px 0 #1e77be,8px 52px 0 #1e77be,12px 52px 0 #1e77be,20px 52px 0 #1e77be,64px 52px 0 #1e77be,4px 56px 0 #1e77be,8px 56px 0 #1e77be,12px 56px 0 #1e77be,20px 56px 0 #1e77be,60px 56px 0 #1e77be,4px 60px 0 #1e77be,8px 60px 0 #1e77be,12px 60px 0 #1e77be,20px 60px 0 #1e77be,60px 60px 0 #1e77be,4px 64px 0 #1e77be,8px 64px 0 #1e77be,12px 64px 0 #1e77be,20px 64px 0 #1e77be,24px 64px 0 #1e77be,28px 64px 0 #1e77be,32px 64px 0 #1e77be,36px 64px 0 #1e77be,40px 64px 0 #1e77be,44px 64px 0 #1e77be,48px 64px 0 #1e77be,52px 64px 0 #1e77be,56px 64px 0 #1e77be;;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=nes.css.map */
|
19
index.html
19
index.html
@ -238,11 +238,22 @@
|
||||
|
||||
<section class="container">
|
||||
<h2 class="title -is-3">Balloons</h2>
|
||||
<div class="balloon -right">
|
||||
<p>Good morning. Thou hast had a good night's sleep I hope.</p>
|
||||
<div class="conversation">
|
||||
<div class="avatar -left">
|
||||
<img src="https://avatars0.githubusercontent.com/u/5305599?s=100">
|
||||
</div>
|
||||
<div class="balloon -left">
|
||||
<p>Hello NES.css</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="balloon -left">
|
||||
<p>Hello NES.css</p>
|
||||
|
||||
<div class="conversation">
|
||||
<div class="balloon -right">
|
||||
<p>Good morning. Thou hast had a good night's sleep I hope.</p>
|
||||
</div>
|
||||
<div class="avatar -right">
|
||||
<img src="https://avatars0.githubusercontent.com/u/5305599?s=100">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
25
style.css
25
style.css
@ -44,6 +44,31 @@ body {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.conversation {
|
||||
display: grid;
|
||||
|
||||
/* prettier-ignore */
|
||||
grid-template:
|
||||
".... message ....."
|
||||
"left message right"
|
||||
"left message right"
|
||||
"left ....... right"
|
||||
/ 100px 1fr 100px;
|
||||
grid-gap: 2rem;
|
||||
}
|
||||
|
||||
.conversation > .avatar.-left {
|
||||
grid-area: left;
|
||||
}
|
||||
|
||||
.conversation > .avatar.-right {
|
||||
grid-area: right;
|
||||
}
|
||||
|
||||
.conversation > .balloon {
|
||||
grid-area: message;
|
||||
}
|
||||
|
||||
.github-link {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
|
Loading…
x
Reference in New Issue
Block a user