Awesome underlines and slight fixes
This commit is contained in:
parent
0580225da3
commit
4e9fb73237
4 changed files with 40 additions and 38 deletions
|
@ -39,15 +39,34 @@
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@mixin selection($background, $foreground) {
|
||||
::selection {
|
||||
background-color: $background;
|
||||
color: $foreground;
|
||||
@mixin selection($backgroundColor, $textColor) {
|
||||
&::selection {
|
||||
background-color: $backgroundColor;
|
||||
color: $textColor;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
background-color: $background;
|
||||
color: $foreground;
|
||||
&::-moz-selection {
|
||||
background-color: $backgroundColor;
|
||||
color: $textColor;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin underline($textColor: #000, $whitespaceColor: #fff) {
|
||||
@include selection($textColor, $whitespaceColor);
|
||||
|
||||
background-image: linear-gradient($whitespaceColor, $whitespaceColor), linear-gradient($whitespaceColor, $whitespaceColor), linear-gradient($textColor, $textColor);
|
||||
background-position: 0 88%, 100% 88%, 0 88%;
|
||||
background-repeat: no-repeat, no-repeat, repeat-x;
|
||||
background-size: 0.05rem 1px, 0.05rem 1px, 1px 1px;
|
||||
box-decoration-break: clone;
|
||||
display: inline;
|
||||
text-decoration: none;
|
||||
text-shadow: 0.03rem 0 $whitespaceColor, -0.03rem 0 $whitespaceColor, 0 0.03rem $whitespaceColor, 0 -0.03rem $whitespaceColor, 0.06rem 0 $whitespaceColor, -0.06rem 0 $whitespaceColor, 0.09rem 0 $whitespaceColor, -0.09rem 0 $whitespaceColor, 0.12rem 0 $whitespaceColor, -0.12rem 0 $whitespaceColor, 0.15rem 0 $whitespaceColor, -0.15rem 0 $whitespaceColor;
|
||||
|
||||
@-moz-document url-prefix() {
|
||||
background-position: 0 90%, 100% 90%, 0 90%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -39,7 +39,7 @@
|
|||
|
||||
|
||||
.blog-post__title {
|
||||
display: inline-block; // position is set elsewhere
|
||||
// display: inline-block; // position is set elsewhere
|
||||
line-height: 1.33;
|
||||
|
||||
&::after {
|
||||
|
|
|
@ -158,7 +158,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
p, ol, ul:not(.overview__ecosystem__module), table {
|
||||
p,
|
||||
ol,
|
||||
ul:not(.overview__ecosystem__module),
|
||||
table {
|
||||
code {
|
||||
background-color: $black;
|
||||
border-radius: 3px;
|
||||
|
@ -175,11 +178,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
p, ol, ul:not(.overview__ecosystem__module):not(.feature-links) {
|
||||
p,
|
||||
ol,
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module) {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
p, ol, ul:not(.overview__ecosystem__module):not(.feature-links) {
|
||||
position: relative;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
|
@ -193,7 +195,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
ol, ul:not(.overview__ecosystem__module):not(.feature-links) {
|
||||
ol,
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module) {
|
||||
padding-top: 0.5rem;
|
||||
|
||||
li {
|
||||
|
@ -212,7 +215,7 @@
|
|||
padding-left: 1.6rem;
|
||||
}
|
||||
|
||||
ul:not(.overview__ecosystem__module):not(.feature-links) {
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module) {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
|
@ -222,29 +225,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
a:not(.button):not(.__button-black):not(.feature-link__title):not(.newsletter-standalone__submit) {
|
||||
a:not(.__button-black):not(.button):not(.feature-link__title):not(.header-anchor):not(.newsletter-standalone__submit) {
|
||||
@include underline($teal, $white);
|
||||
color: $teal;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
width: 100%; height: 1px;
|
||||
|
||||
background-color: currentColor;
|
||||
content: "";
|
||||
left: 0;
|
||||
position: absolute;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
&:not(:hover)::after {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&:hover::after {
|
||||
bottom: 3px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
|
|
|
@ -242,7 +242,7 @@
|
|||
All information should be considered incomplete and possibly incorrect and things may not work as expected.
|
||||
</p>
|
||||
|
||||
<br/>
|
||||
<br/><br/>
|
||||
|
||||
<p>
|
||||
Please do not share or link this site publicly while this message is here. This website is open source and you can <a href="https://github.com/lbryio/lbry.tech" target="_blank" rel="noopener noreferrer">contribute to it on Github</a>.
|
||||
|
|
Loading…
Reference in a new issue