BurnyLlama/nebulosa-css
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added ability to add source to blockquote. :D

Browse Source
This commit is contained in:
BurnyLlama 2023-03-06 11:56:31 +01:00
parent b3544c6e6c
commit 21210d288c
2 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/text.scss
View File

@ -8,10 +8,9 @@ p {
blockquote { blockquote {
position: relative; position: relative;
font-family: 'Alegreya', serif; font-family: 'Alegreya', serif;
margin: 1rem; margin: 2rem 1rem;
padding: 1rem; padding: 1rem;
background-color: palette.$standout; background-color: palette.$standout;
// border-left: .3rem solid palette.$primary;
box-shadow: .5rem .5rem 0 0 palette.$grey200; box-shadow: .5rem .5rem 0 0 palette.$grey200;
&::before { &::before {
@ -22,10 +21,22 @@ blockquote {
position: absolute; position: absolute;
top: -.75rem; top: -.75rem;
left: -.75rem; left: -.75rem;
height: 2rem;
width: 2rem;
border-radius: 100%; border-radius: 100%;
color: palette.$text; color: palette.$text;
background-color: palette.$primary; background-color: palette.$primary;
height: 2rem; }
width: 2rem;
&[cite] {
margin-bottom: 3rem;
&::after {
content: '– ' attr(cite);
position: absolute;
bottom: -2.5rem;
right: 3rem;
color: palette.$grey600;
}
} }
} }

3
web/pages/text.njk
View File

@ -15,6 +15,9 @@
<blockquote> <blockquote>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga facere, ullam repudiandae perferendis facilis voluptatibus dolores sequi quam nihil harum veritatis rerum, molestias voluptates enim dolorum? Provident officia qui voluptatum. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga facere, ullam repudiandae perferendis facilis voluptatibus dolores sequi quam nihil harum veritatis rerum, molestias voluptates enim dolorum? Provident officia qui voluptatum.
</blockquote> </blockquote>
<blockquote cite="Someone">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga facere, ullam repudiandae perferendis facilis voluptatibus dolores sequi quam nihil harum veritatis rerum, molestias voluptates enim dolorum? Provident officia qui voluptatum.
</blockquote>
</p> </p>