lbry-desktop/ui/scss/component/_markdown-preview.scss

132 lines
2.1 KiB
SCSS
Raw Normal View History

2018-05-07 06:59:33 +02:00
.markdown-preview {
2019-11-14 21:02:15 +01:00
> *:last-child {
margin-bottom: 0;
}
// Headers
2018-05-11 22:58:30 +02:00
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
2019-11-07 20:39:22 +01:00
font-weight: var(--font-weight-bold);
2019-06-11 20:10:58 +02:00
margin-bottom: var(--spacing-medium);
padding-top: var(--spacing-medium);
2018-05-11 22:58:30 +02:00
}
2018-05-07 06:59:33 +02:00
// Paragraphs
2018-05-30 20:12:54 +02:00
p {
svg {
width: 1rem;
height: 1rem;
margin-left: 0.2rem;
position: relative;
top: 1px;
}
2018-05-30 20:12:54 +02:00
}
2018-05-30 05:08:37 +02:00
// Strikethrough text
2018-05-30 20:12:54 +02:00
del {
}
2018-05-07 06:59:33 +02:00
// Tables
2018-05-30 20:12:54 +02:00
table {
margin-bottom: 1.2rem;
2019-06-11 20:10:58 +02:00
padding: var(--spacing-medium);
2019-08-06 22:04:55 +02:00
word-break: normal;
tr {
td,
th,
td:first-of-type,
th:first-of-type,
td:last-of-type,
th:last-of-type {
2019-06-11 20:10:58 +02:00
padding: var(--spacing-medium);
}
2018-05-30 20:12:54 +02:00
}
}
2018-05-07 06:59:33 +02:00
// Image
2018-07-27 02:24:00 +02:00
img {
2019-06-11 20:10:58 +02:00
margin-bottom: var(--spacing-medium);
padding-top: var(--spacing-medium);
2018-07-27 02:24:00 +02:00
}
// Horizontal Rule
2018-05-30 20:12:54 +02:00
hr {
margin-bottom: 2rem;
position: relative;
top: 1rem;
2018-05-30 20:12:54 +02:00
}
2018-05-07 06:59:33 +02:00
// Code blocks
2018-11-30 06:49:02 +01:00
pre {
white-space: normal;
background: transparent;
code {
margin-bottom: var(--spacing-medium);
padding: var(--spacing-medium);
display: block;
white-space: pre-wrap;
}
2018-11-30 06:49:02 +01:00
}
// Inline code
2018-05-30 20:12:54 +02:00
code {
2019-11-22 22:13:00 +01:00
background-color: black; //gray-1;
color: black; //gray-5;
display: inline-block;
margin: var(--spacing-miniscule);
border-radius: 0.2rem;
2019-11-22 22:13:00 +01:00
font-size: var(--font-small);
padding: calc(var(--spacing-miniscule) - 4px) var(--spacing-miniscule);
}
2019-06-17 22:32:38 +02:00
a,
button {
2018-07-22 23:28:33 +02:00
display: inline-block;
2019-06-17 22:32:38 +02:00
.button__label {
white-space: normal;
}
2018-07-22 23:28:33 +02:00
}
2019-03-24 02:59:09 +01:00
button {
white-space: normal;
text-align: left;
}
2019-06-09 08:57:51 +02:00
.preview-link {
2019-06-21 03:00:52 +02:00
padding: 0;
margin: 1rem 0;
2019-11-22 22:13:00 +01:00
background-color: var(--color-primary-alt);
border-left: 0.5rem solid var(--color-primary);
2019-06-09 08:57:51 +02:00
display: block;
align-items: center;
2019-06-21 03:00:52 +02:00
word-break: break-all;
overflow: hidden;
.claim-preview {
border: 0;
background: transparent;
}
.media__subtitle {
display: block;
}
2019-06-09 08:57:51 +02:00
}
2019-06-21 03:00:52 +02:00
.preview-link__thumbnail {
width: 12rem;
}
.preview-link__description {
margin-top: var(--spacing-small);
2019-06-09 08:57:51 +02:00
}
2018-05-07 06:59:33 +02:00
}