Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00
Code Issues Activity
ghost/core/frontend/src/cards/css/button.css

40 lines
886 B
CSS
Raw Normal View History

Applied default box sizing to all cards refs. https://github.com/TryGhost/Ghost/issues/13874 - Improved stability of cards by adding 'box-sizing: border-box;' CSS property to all of them so that it's not required by themes anymore
2021-12-17 15:28:35 +01:00
.kg-button-card,
.kg-button-card * {
box-sizing: border-box;
}
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
.kg-button-card {
display: flex;
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
position: static;
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
align-items: center;
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
width: 100%;
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
justify-content: center;
}
Updateed Button styles to support alignment
2021-12-01 09:44:32 -04:00
.kg-button-card.kg-align-left {
justify-content: flex-start;
}
Card css specificity updates (#13895) The default CSS styles of the new cards that have been released in the past couple of weeks was overoptimised for overridability. It was done by defining the lowest specificity scores for each card style. This resulted in certain default styles being unusable for a lot of themes – e.g. the text color of a button (which is a a element that is usually defined on a higher specificity) could easily be the same color as its background (accent color by default). The solution to this issue is to increase the specificity level of globally used default elements (such as a's h1 and other headings, p's etc.) to a medium level so that they have precedence over styles that are defined in most themes. Our baseline specificity score for these default style is 21, which seems to be covering most of the cases in popular themes. This commit contains CSS updates in card default styles that implement this change.
2021-12-15 12:58:24 +01:00
.kg-button-card a.kg-btn {
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
display: flex;
position: static;
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
align-items: center;
Updated button styles to use relative sizings
2021-12-09 11:49:49 +01:00
padding: 0 1.2em;
height: 2.4em;
line-height: 1em;
Card css specificity updates (#13895) The default CSS styles of the new cards that have been released in the past couple of weeks was overoptimised for overridability. It was done by defining the lowest specificity scores for each card style. This resulted in certain default styles being unusable for a lot of themes – e.g. the text color of a button (which is a a element that is usually defined on a higher specificity) could easily be the same color as its background (accent color by default). The solution to this issue is to increase the specificity level of globally used default elements (such as a's h1 and other headings, p's etc.) to a medium level so that they have precedence over styles that are defined in most themes. Our baseline specificity score for these default style is 21, which seems to be covering most of the cases in popular themes. This commit contains CSS updates in card default styles that implement this change.
2021-12-15 12:58:24 +01:00
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
Updated button styles to use relative sizings
2021-12-09 11:49:49 +01:00
font-size: 0.95em;
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
font-weight: 600;
Removed need for !important in button card css refs https://github.com/TryGhost/Team/issues/1210 - `a.kg-btn` has higher specificity than the `.gh-content a` in Casper we were previously working around with `!important` - dropping `!important` makes it easier for themes to override
2021-11-09 12:30:18 +00:00
text-decoration: none;
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
border-radius: 5px;
transition: opacity 0.2s ease-in-out;
}
Card css specificity updates (#13895) The default CSS styles of the new cards that have been released in the past couple of weeks was overoptimised for overridability. It was done by defining the lowest specificity scores for each card style. This resulted in certain default styles being unusable for a lot of themes – e.g. the text color of a button (which is a a element that is usually defined on a higher specificity) could easily be the same color as its background (accent color by default). The solution to this issue is to increase the specificity level of globally used default elements (such as a's h1 and other headings, p's etc.) to a medium level so that they have precedence over styles that are defined in most themes. Our baseline specificity score for these default style is 21, which seems to be covering most of the cases in popular themes. This commit contains CSS updates in card default styles that implement this change.
2021-12-15 12:58:24 +01:00
.kg-button-card a.kg-btn:hover {
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
opacity: 0.85;
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
}
Card css specificity updates (#13895) The default CSS styles of the new cards that have been released in the past couple of weeks was overoptimised for overridability. It was done by defining the lowest specificity scores for each card style. This resulted in certain default styles being unusable for a lot of themes – e.g. the text color of a button (which is a a element that is usually defined on a higher specificity) could easily be the same color as its background (accent color by default). The solution to this issue is to increase the specificity level of globally used default elements (such as a's h1 and other headings, p's etc.) to a medium level so that they have precedence over styles that are defined in most themes. Our baseline specificity score for these default style is 21, which seems to be covering most of the cases in popular themes. This commit contains CSS updates in card default styles that implement this change.
2021-12-15 12:58:24 +01:00
.kg-button-card a.kg-btn-accent {
Added first pass of injected css for button card refs https://github.com/TryGhost/Team/issues/1207 - basic CSS for button card display - accent color for button background - left/center alignment
2021-11-09 11:10:18 +00:00
background-color: var(--ghost-accent-color);
Removed need for !important in button card css refs https://github.com/TryGhost/Team/issues/1210 - `a.kg-btn` has higher specificity than the `.gh-content a` in Casper we were previously working around with `!important` - dropping `!important` makes it easier for themes to override
2021-11-09 12:30:18 +00:00
color: #fff;
Updated frontend styles for buttons
2021-11-12 11:50:07 +01:00
}
Reference in a new issue Copy permalink