beenull/themes-wordpress
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[Seedlet] Replacing border for text-decoration to add underline to links (#5195)

Browse source 
* replacing border for text-decoraction to add underline to links

* Spearhead: Replacing boder-bottom by text-decoration underline

* Seedlet: disable text-decoration for site title

* spaces to tabs

* reorder properties

* rebuild

* reorder properties

Co-authored-by: Ben Dwyer <ben@scruffian.com>
This commit is contained in:
Matias Benedetto 2021-12-22 13:37:24 -03:00 committed by GitHub
parent 225656c65a
commit e13a82b15d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 60 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
seedlet/assets/css/style-editor.css
View file

@ -285,14 +285,14 @@
* Output
*/
a {
border-bottom: 1px solid var(--global--color-secondary);
color: var(--wp--style--color--link, var(--global--color-primary));
text-decoration: none;
transition: border-color 0.1s ease-out;
text-decoration: underline 1px var(--global--color-secondary);
text-underline-offset: 0.3em;
transition: text-decoration 0.1s ease-out;
}
a:hover, a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
a:hover {
@ -308,11 +308,11 @@ a:active {
}
.has-link-color a {
border-bottom: 1px solid var(--wp--style--color--link, var(--global--color-primary));
text-decoration-color: var(--wp--style--color--link, var(--global--color-primary));
}
.has-link-color a:hover, .has-link-color a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
.has-primary-background-color a:not(.has-link-color):not(.has-text-color) {

12
seedlet/assets/sass/base/_base.scss
View file

@ -1,13 +1,13 @@
// Links styles
a {
border-bottom: 1px solid var(--global--color-secondary);
color: var( --wp--style--color--link, var(--global--color-primary) );
text-decoration: none;
transition: border-color 0.1s ease-out;
text-decoration: underline 1px var(--global--color-secondary);
text-underline-offset: 0.3em;
transition: text-decoration 0.1s ease-out;
&:hover,
&:focus {
border-bottom-color: transparent;
text-decoration: none;
}
&:hover {
@ -25,11 +25,11 @@ a {
// If a custom link color has been assigned,
// switch the color of the bottom border too.
.has-link-color & {
border-bottom: 1px solid var( --wp--style--color--link, var(--global--color-primary) );
text-decoration-color: var( --wp--style--color--link, var(--global--color-primary) );
&:hover,
&:focus {
border-bottom-color: transparent;
text-decoration: none;
}
}

3
seedlet/assets/sass/components/header/_header-branding.scss
View file

@ -8,7 +8,6 @@
// Site title
.site-title {
color: var(--branding--color-link);
font-family: var(--branding--title--font-family);
font-size: var(--branding--title--font-size-mobile);
@ -24,6 +23,8 @@
border-bottom: none;
color: currentColor;
font-weight: var(--branding--title--font-weight);
text-decoration: none;
text-shadow:
1px 0px var(--global--color-background),
-1px 0px var(--global--color-background),

13
seedlet/style-rtl.css
View file

@ -927,14 +927,14 @@ body {
}
a {
border-bottom: 1px solid var(--global--color-secondary);
color: var(--wp--style--color--link, var(--global--color-primary));
text-decoration: none;
transition: border-color 0.1s ease-out;
text-decoration: underline 1px var(--global--color-secondary);
text-underline-offset: 0.3em;
transition: text-decoration 0.1s ease-out;
}
a:hover, a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
a:hover {
@ -950,11 +950,11 @@ a:active {
}
.has-link-color a {
border-bottom: 1px solid var(--wp--style--color--link, var(--global--color-primary));
text-decoration-color: var(--wp--style--color--link, var(--global--color-primary));
}
.has-link-color a:hover, .has-link-color a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
.has-primary-background-color a:not(.has-link-color):not(.has-text-color) {
@ -2959,6 +2959,7 @@ pre.wp-block-verse {
border-bottom: none;
color: currentColor;
font-weight: var(--branding--title--font-weight);
text-decoration: none;
text-shadow: -1px 0px var(--global--color-background), 1px 0px var(--global--color-background), 2px 0px var(--global--color-background), -2px 0px var(--global--color-background), 3px 0px var(--global--color-background), -3px 0px var(--global--color-background), 4px 0px var(--global--color-background), -4px 0px var(--global--color-background), 5px 0px var(--global--color-background), -5px 0px var(--global--color-background);
transition: background-size 0.1s ease-out;
}

15
seedlet/style.css
View file

@ -8,7 +8,7 @@ Description: Seedlet is a free WordPress theme. A two-column layout and classica
Requires at least: 5.5
Tested up to: 5.5
Requires PHP: 5.6.2
Version: 1.1.18-wpcom
Version: 1.1.16-wpcom
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: seedlet
@ -927,14 +927,14 @@ body {
}
a {
border-bottom: 1px solid var(--global--color-secondary);
color: var(--wp--style--color--link, var(--global--color-primary));
text-decoration: none;
transition: border-color 0.1s ease-out;
text-decoration: underline 1px var(--global--color-secondary);
text-underline-offset: 0.3em;
transition: text-decoration 0.1s ease-out;
}
a:hover, a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
a:hover {
@ -950,11 +950,11 @@ a:active {
}
.has-link-color a {
border-bottom: 1px solid var(--wp--style--color--link, var(--global--color-primary));
text-decoration-color: var(--wp--style--color--link, var(--global--color-primary));
}
.has-link-color a:hover, .has-link-color a:focus {
border-bottom-color: transparent;
text-decoration: none;
}
.has-primary-background-color a:not(.has-link-color):not(.has-text-color) {
@ -2980,6 +2980,7 @@ pre.wp-block-verse {
border-bottom: none;
color: currentColor;
font-weight: var(--branding--title--font-weight);
text-decoration: none;
text-shadow: 1px 0px var(--global--color-background), -1px 0px var(--global--color-background), -2px 0px var(--global--color-background), 2px 0px var(--global--color-background), -3px 0px var(--global--color-background), 3px 0px var(--global--color-background), -4px 0px var(--global--color-background), 4px 0px var(--global--color-background), -5px 0px var(--global--color-background), 5px 0px var(--global--color-background);
transition: background-size 0.1s ease-out;
}

5
spearhead/assets/sass/_footer.scss
View file

@ -1,4 +1,9 @@
.site-footer {
.menu-item {
a {
border-bottom: none;
}
}
> .site-info {
font-family: var(--global--font-secondary);
a.site-name {

3
spearhead/assets/sass/_header.scss
View file

@ -10,7 +10,7 @@ $site-branding-height: 68px;
}
a {
border-bottom: 1px solid transparent;
text-decoration: none;
}
@include media( laptop-only ){
@ -68,6 +68,7 @@ $site-branding-height: 68px;
> a {
background: inherit;
text-decoration: none;
text-shadow: none;
}
}

1
spearhead/assets/sass/_posts-and-pages.scss
View file

@ -104,6 +104,7 @@
display: inline-block;
font-size: var(--entry-meta--font-size);
margin-top: 0;
text-decoration: 1px solid underline var(--global--color-primary);
&:hover {
color: var(--global--color-primary-hover);

4
spearhead/assets/sass/_text.scss
View file

@ -1,11 +1,11 @@
.has-link-color a, a {
border-bottom: 1px solid;
border-color: transparent;
transition: all 0.1s ease;
text-decoration: none;
&:hover {
color: var( --global--color-primary-hover );
border-color: var( --global--color-primary-hover );
text-decoration: 1px solid underline;
}
}

2
spearhead/package-lock.json generated
View file

@ -1,6 +1,6 @@
{
"name": "spearhead",
"version": "1.3.3",
"version": "1.3.4",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

12
spearhead/style-rtl.css
View file

@ -159,6 +159,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
display: inline-block;
font-size: var(--entry-meta--font-size);
margin-top: 0;
text-decoration: 1px solid underline var(--global--color-primary);
}
.entry-content .more-link:hover {
@ -187,14 +188,14 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
}
.has-link-color a, a {
border-bottom: 1px solid;
border-color: transparent;
transition: all 0.1s ease;
text-decoration: none;
}
.has-link-color a:hover, a:hover {
color: var(--global--color-primary-hover);
border-color: var(--global--color-primary-hover);
text-decoration: 1px solid underline;
}
.wp-block a,
@ -219,7 +220,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
}
.has-main-navigation .site-header a {
border-bottom: 1px solid transparent;
text-decoration: none;
}
@media only screen and (max-width: 829px) {
@ -277,6 +278,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
.site-header .site-branding .site-title > a {
background: inherit;
text-decoration: none;
text-shadow: none;
}
@ -429,6 +431,10 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
margin: 0;
}
.site-footer .menu-item a {
border-bottom: none;
}
.site-footer > .site-info {
font-family: var(--global--font-secondary);
}

14
spearhead/style.css
View file

@ -7,7 +7,7 @@ Description: Share your podcast with the world using Spearhead.
Requires at least: 5.5
Tested up to: 5.5
Requires PHP: 5.6.2
Version: 1.3.4
Version: 1.3.3
License: GNU General Public License v2 or later
License URI: LICENSE
Template: seedlet
@ -159,6 +159,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
display: inline-block;
font-size: var(--entry-meta--font-size);
margin-top: 0;
text-decoration: 1px solid underline var(--global--color-primary);
}
.entry-content .more-link:hover {
@ -187,14 +188,14 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
}
.has-link-color a, a {
border-bottom: 1px solid;
border-color: transparent;
transition: all 0.1s ease;
text-decoration: none;
}
.has-link-color a:hover, a:hover {
color: var(--global--color-primary-hover);
border-color: var(--global--color-primary-hover);
text-decoration: 1px solid underline;
}
.wp-block a,
@ -219,7 +220,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
}
.has-main-navigation .site-header a {
border-bottom: 1px solid transparent;
text-decoration: none;
}
@media only screen and (max-width: 829px) {
@ -277,6 +278,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
.site-header .site-branding .site-title > a {
background: inherit;
text-decoration: none;
text-shadow: none;
}
@ -429,6 +431,10 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
margin: 0;
}
.site-footer .menu-item a {
border-bottom: none;
}
.site-footer > .site-info {
font-family: var(--global--font-secondary);
}

2
spearhead/style.css.map
View file

File diff suppressed because one or more lines are too long