unify some styles with master
This commit is contained in:
zeppi
jessopb
parent
830375cb32
commit
c2f945ab3c
19 changed files with 445 additions and 37 deletions
|
|
@ -1889,5 +1889,8 @@
|
|||
"A thumbnail is required. Please upload or provide an image URL above.": "A thumbnail is required. Please upload or provide an image URL above.",
|
||||
"You can upload your own recording or select a replay when your stream is over": "You can upload your own recording or select a replay when your stream is over",
|
||||
"This channel isn't staking enough LBRY Credits for inline image previews.": "This channel isn't staking enough LBRY Credits for inline image previews.",
|
||||
"Fromage": "Fromage",
|
||||
"Latest": "Latest",
|
||||
"Tá Rolando": "Tá Rolando",
|
||||
"--end--": "--end--"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -34,7 +34,15 @@
|
|||
|
||||
.button--primary {
|
||||
background-color: var(--color-button-primary-bg);
|
||||
// color: var(--color-button-primary-text);
|
||||
|
||||
.button__label {
|
||||
color: var(--color-button-primary-text);
|
||||
}
|
||||
|
||||
.icon {
|
||||
stroke: var(--color-button-primary-text);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--color-button-primary-hover-text);
|
||||
|
|
@ -54,7 +62,15 @@
|
|||
.button--secondary {
|
||||
background-color: var(--color-button-secondary-bg);
|
||||
border: 1px solid var(--color-button-secondary-border);
|
||||
color: var(--color-button-secondary-text);
|
||||
// color: var(--color-button-secondary-text);
|
||||
|
||||
.button__label {
|
||||
color: var(--color-button-primary-text);
|
||||
}
|
||||
|
||||
.icon {
|
||||
stroke: var(--color-button-primary-text);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-button-secondary-bg-hover);
|
||||
|
|
@ -223,6 +239,238 @@
|
|||
}
|
||||
}
|
||||
|
||||
.button--fire {
|
||||
color: var(--color-fire);
|
||||
position: relative;
|
||||
|
||||
path {
|
||||
stroke: var(--color-fire-outside);
|
||||
}
|
||||
}
|
||||
|
||||
.button__fire-particle {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 20%;
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
background-color: #ef5a00;
|
||||
border-radius: 50%;
|
||||
filter: drop-shadow(0 0 10px #d43322);
|
||||
animation-iteration-count: 2;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
.button__fire-glow {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
left: var(--spacing-s);
|
||||
bottom: var(--spacing-m);
|
||||
position: absolute;
|
||||
box-shadow: 4px 0px 10px 10px var(--color-glow);
|
||||
animation: glowDecay 2.5s ease-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.button__fire-particle1 {
|
||||
@extend .button__fire-particle;
|
||||
right: 10%;
|
||||
top: 40%;
|
||||
animation: particleUp 1.5s ease-out 0;
|
||||
animation-iteration-count: 2;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.button__fire-particle2 {
|
||||
@extend .button__fire-particle;
|
||||
animation: particleUp2 2s ease-out 0;
|
||||
animation-iteration-count: 2;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.button__fire-particle3 {
|
||||
@extend .button__fire-particle;
|
||||
animation: particleUp3 2.2s ease-out 0;
|
||||
animation-iteration-count: 2;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.button__fire-particle4 {
|
||||
@extend .button__fire-particle1;
|
||||
animation-delay: 0.5s;
|
||||
}
|
||||
.button__fire-particle5 {
|
||||
@extend .button__fire-particle2;
|
||||
animation-delay: 0.75s;
|
||||
}
|
||||
.button__fire-particle6 {
|
||||
@extend .button__fire-particle3;
|
||||
animation-delay: 0.25s;
|
||||
}
|
||||
|
||||
@keyframes glowDecay {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes particleUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
left: 0;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
right: 10%;
|
||||
}
|
||||
|
||||
50% {
|
||||
right: 20%;
|
||||
}
|
||||
|
||||
50% {
|
||||
left: 10%;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
right: 40%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
top: -50%;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes particleUp2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
right: 0;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
left: 10%;
|
||||
}
|
||||
|
||||
50% {
|
||||
left: 20%;
|
||||
}
|
||||
|
||||
50% {
|
||||
right: 10%;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
left: 40%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
top: -50%;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes particleUp3 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
left: 30%;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
left: 60%;
|
||||
}
|
||||
|
||||
40% {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
80% {
|
||||
opacity: 1;
|
||||
right: 80%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
top: -50%;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
}
|
||||
|
||||
.button--slime {
|
||||
color: var(--color-slime);
|
||||
}
|
||||
|
||||
.button__slime-drop {
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 15%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
background-color: #81c554;
|
||||
border-radius: 50%;
|
||||
filter: drop-shadow(0 0 10px #d43322);
|
||||
animation-iteration-count: 2;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
.button__slime-drop1 {
|
||||
@extend .button__slime-drop;
|
||||
top: 40%;
|
||||
animation: dropDown 1.5s ease-out 0;
|
||||
animation-iteration-count: 1;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
.button__slime-drop2 {
|
||||
@extend .button__slime-drop;
|
||||
left: 35%;
|
||||
top: 40%;
|
||||
animation: dropDown2 1.5s ease-out 0;
|
||||
animation-iteration-count: 1;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
.button__slime-stain {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
left: var(--spacing-s);
|
||||
bottom: var(--spacing-m);
|
||||
position: absolute;
|
||||
box-shadow: 4px 0px 10px 10px var(--color-slime);
|
||||
animation: glowDecay 2.5s ease-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes dropDown {
|
||||
0% {
|
||||
opacity: 1;
|
||||
top: 50%;
|
||||
}
|
||||
70% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
top: 80%;
|
||||
transform: scale(0.5, 4);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dropDown2 {
|
||||
0% {
|
||||
opacity: 1;
|
||||
top: 50%;
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
top: 80%;
|
||||
transform: scale(0.5, 6);
|
||||
}
|
||||
}
|
||||
|
||||
.button--disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
@ -300,8 +548,10 @@ svg + .button__label {
|
|||
}
|
||||
|
||||
.button-toggle--active {
|
||||
color: var(--color-primary);
|
||||
background-color: var(--color-primary-alt);
|
||||
//color: var(--color-primary);
|
||||
//background-color: var(--color-primary-alt);
|
||||
color: var(--color-button-toggle-text);
|
||||
background-color: var(--color-button-toggle-bg);
|
||||
|
||||
svg {
|
||||
opacity: 1;
|
||||
|
|
@ -347,6 +597,12 @@ svg + .button__label {
|
|||
}
|
||||
}
|
||||
|
||||
.button--file-action {
|
||||
&:first-child {
|
||||
margin-right: var(--spacing-s);
|
||||
}
|
||||
}
|
||||
|
||||
.button-toggle-group-action {
|
||||
position: absolute; // Centers the button along toggle buttons
|
||||
|
||||
|
|
|
|||
|
|
@ -345,3 +345,9 @@
|
|||
margin-right: var(--spacing-m);
|
||||
}
|
||||
}
|
||||
|
||||
.card__bottom-actions {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -109,6 +109,7 @@ $metadata-z-index: 1;
|
|||
.channel-thumbnail__custom {
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
font-size: 1px; // To hide the alt text on firefox;
|
||||
}
|
||||
|
||||
.channel-thumbnail__default {
|
||||
|
|
@ -280,7 +281,8 @@ $metadata-z-index: 1;
|
|||
|
||||
&[data-selected] {
|
||||
background: transparent;
|
||||
.channel__list-item {
|
||||
.channel__list-item,
|
||||
.channel-staked__wrapper {
|
||||
background-color: var(--color-card-background-highlighted);
|
||||
}
|
||||
}
|
||||
|
|
@ -314,6 +316,7 @@ $metadata-z-index: 1;
|
|||
background-color: var(--color-card-background);
|
||||
padding: var(--spacing-s);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
overflow: hidden;
|
||||
|
||||
.channel-thumbnail {
|
||||
height: 2rem;
|
||||
|
|
@ -362,12 +365,13 @@ $metadata-z-index: 1;
|
|||
.channel-staked__tooltip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1rem;
|
||||
}
|
||||
|
||||
.channel-staked__tooltip-text {
|
||||
margin-left: var(--spacing-xs);
|
||||
font-size: var(--font-xsmall);
|
||||
|
||||
// still needed ?
|
||||
.icon--LBC {
|
||||
opacity: 0.7;
|
||||
margin-top: -2px;
|
||||
|
|
|
|||
|
|
@ -30,9 +30,11 @@
|
|||
transform: translateY(-130%);
|
||||
font-size: var(--font-xsmall);
|
||||
color: var(--color-text-subtitle);
|
||||
overflow: visible;
|
||||
|
||||
.icon {
|
||||
margin-right: var(--spacing-xs);
|
||||
stroke: var(--color-text-subtitle);
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
|
|
@ -179,6 +181,20 @@
|
|||
@include handleChannelGif(5rem);
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview__text {
|
||||
height: 7.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
.channel-thumbnail {
|
||||
@include handleChannelGif(6rem);
|
||||
}
|
||||
|
||||
.claim-preview__text {
|
||||
height: 3.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview--small {
|
||||
|
|
@ -202,12 +218,16 @@
|
|||
|
||||
.claim-preview--inline {
|
||||
.channel-thumbnail {
|
||||
@include handleChannelGif(3rem);
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
@include handleChannelGif(var(--channel-thumbnail-width--small));
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview__actions {
|
||||
align-self: flex-end;
|
||||
margin-top: 0;
|
||||
//margin-top: 0;
|
||||
margin-bottom: auto;
|
||||
justify-content: flex-end;
|
||||
width: auto;
|
||||
|
|
@ -218,11 +238,17 @@
|
|||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-xsmall) {
|
||||
.claim-preview__actions {
|
||||
align-self: flex-start;
|
||||
.claim-preview__primary-actions {
|
||||
.button {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
//align-self: flex-start;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -256,9 +282,9 @@
|
|||
flex-direction: column;
|
||||
flex: 1;
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
margin-bottom: var(--spacing-s);
|
||||
}
|
||||
//@media (max-width: $breakpoint-small) {
|
||||
// margin-bottom: var(--spacing-s);
|
||||
//}
|
||||
}
|
||||
|
||||
.claim-preview-info {
|
||||
|
|
@ -276,7 +302,7 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-top: auto;
|
||||
//margin-top: auto;
|
||||
width: 100%;
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
|
|
@ -286,7 +312,14 @@
|
|||
|
||||
.claim-preview__primary-actions {
|
||||
@extend .section__actions;
|
||||
margin-top: 0;
|
||||
margin-right: 0;
|
||||
margin-top: var(--spacing-s);
|
||||
|
||||
&:first-child {
|
||||
.button {
|
||||
margin-top: var(--spacing-s);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview__actions--header {
|
||||
|
|
@ -387,6 +420,16 @@
|
|||
font-size: var(--font-large);
|
||||
}
|
||||
|
||||
.claim-grid__title--first {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-bottom: var(--spacing-l);
|
||||
|
||||
.no-evil {
|
||||
font-size: var(--font-heading);
|
||||
}
|
||||
}
|
||||
|
||||
.claim-grid__title--secondary {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,6 +33,10 @@ $thumbnailWidthSmall: 1rem;
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.comment__create--bottom {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.comment {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
|
@ -60,6 +64,11 @@ $thumbnailWidthSmall: 1rem;
|
|||
padding: -1rem;
|
||||
margin-left: 0;
|
||||
}
|
||||
.channel-staked__indicator {
|
||||
@media (max-width: $breakpoint-small) {
|
||||
margin-left: 0.1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -308,6 +317,10 @@ $thumbnailWidthSmall: 1rem;
|
|||
padding-bottom: var(--spacing-xs);
|
||||
font-size: var(--font-small);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: var(--spacing-xs);
|
||||
}
|
||||
}
|
||||
|
||||
.comment__menu-help {
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
font-size: var(--font-xsmall);
|
||||
line-height: 1.2;
|
||||
margin-left: 0;
|
||||
margin-top: auto;
|
||||
position: relative;
|
||||
|
||||
.tag {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
.footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-width: 80%;
|
||||
margin: auto;
|
||||
padding: var(--spacing-xl);
|
||||
|
|
@ -9,10 +11,39 @@
|
|||
@media (max-width: $breakpoint-small) {
|
||||
max-width: 100%;
|
||||
padding: var(--spacing-m);
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.footer__links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.navigation-link {
|
||||
font-size: var(--font-small);
|
||||
}
|
||||
|
||||
.button__label {
|
||||
color: var(--color-text-help);
|
||||
}
|
||||
|
||||
.footer__link {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
flex-direction: row;
|
||||
|
||||
.footer__link {
|
||||
margin-left: var(--spacing-m);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer__link {
|
||||
margin-bottom: var(--spacing-s);
|
||||
}
|
||||
|
||||
.footer__section {
|
||||
margin-left: var(--spacing-xl);
|
||||
|
||||
|
|
@ -23,7 +54,7 @@
|
|||
|
||||
.footer__section-title {
|
||||
@extend .help;
|
||||
font-weight: 300;
|
||||
//font-weight: 300;
|
||||
margin-bottom: var(--spacing-m);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -214,6 +214,7 @@ input-submit {
|
|||
border-left: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
border-color: var(--color-input-toggle);
|
||||
border-left-color: var(--color-input-toggle);
|
||||
transform: rotate(-45deg);
|
||||
left: 6px;
|
||||
top: 6px;
|
||||
|
|
@ -240,7 +241,7 @@ input-submit {
|
|||
height: 12px;
|
||||
width: 12px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-secondary);
|
||||
background-color: var(--color-primary);
|
||||
left: 6px;
|
||||
top: 5px;
|
||||
}
|
||||
|
|
@ -356,7 +357,7 @@ fieldset-group {
|
|||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
padding: 0.5rem;
|
||||
padding-right: var(--spacing-s);
|
||||
//padding-right: var(--spacing-s);
|
||||
height: var(--height-input);
|
||||
border: 1px solid;
|
||||
border-top-left-radius: var(--border-radius);
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
.header--minimal {
|
||||
box-shadow: none;
|
||||
background-color: transparent;
|
||||
background-color: var(--color-background);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
|
|
@ -135,11 +135,25 @@
|
|||
}
|
||||
|
||||
.header__navigation-item--lbry {
|
||||
padding: var(--spacing-s);
|
||||
height: 4rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: var(--spacing-m);
|
||||
margin-right: var(--spacing-m);
|
||||
|
||||
.lbry-icon {
|
||||
height: var(--height-button);
|
||||
width: var(--height-button);
|
||||
@media (max-width: $breakpoint-small) {
|
||||
margin-right: var(--spacing-m);
|
||||
height: 5rem;
|
||||
|
||||
.button__label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header--minimal {
|
||||
.header__navigation-item--lbry {
|
||||
height: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -66,3 +66,17 @@
|
|||
.icon__lbc--title {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.icon--Fire {
|
||||
position: relative;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
background-color: red;
|
||||
top: 0;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -258,7 +258,7 @@
|
|||
}
|
||||
|
||||
.file-viewer__embedded-header {
|
||||
padding: 0;
|
||||
padding: var(--spacing-xxs);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -39,12 +39,12 @@
|
|||
align-self: flex-start;
|
||||
color: var(--color-text-subtitle);
|
||||
font-size: var(--font-small);
|
||||
|
||||
.channel-thumbnail {
|
||||
display: inline-block;
|
||||
@include handleChannelGif(1rem);
|
||||
margin-right: var(--spacing-xs);
|
||||
}
|
||||
//
|
||||
//.channel-thumbnail {
|
||||
// display: inline-block;
|
||||
// @include handleChannelGif(1rem);
|
||||
// margin-right: var(--spacing-xs);
|
||||
//}
|
||||
}
|
||||
|
||||
.media__subtitle--centered {
|
||||
|
|
@ -116,7 +116,7 @@
|
|||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
//justify-content: space-between;
|
||||
margin-top: 0;
|
||||
|
||||
> *:not(:last-child) {
|
||||
|
|
@ -124,7 +124,7 @@
|
|||
}
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
justify-content: flex-start;
|
||||
//justify-content: flex-start;
|
||||
padding-top: var(--spacing-s);
|
||||
|
||||
> * {
|
||||
|
|
@ -139,4 +139,9 @@
|
|||
font-size: var(--font-xxsmall);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: var(--spacing-s);
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: var(--spacing-s);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,10 +26,14 @@
|
|||
height: calc(100vh - var(--header-height));
|
||||
border-right: 1px solid var(--color-border);
|
||||
padding-top: var(--spacing-l);
|
||||
padding-bottom: var(--spacing-xl);
|
||||
padding-bottom: var(--spacing-l);
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
overflow-y: hidden;
|
||||
justify-content: space-between;
|
||||
|
||||
&:hover {
|
||||
overflow-y: auto;
|
||||
|
|
@ -221,7 +225,16 @@
|
|||
@extend .navigation-links;
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
margin-top: var(--spacing-xl);
|
||||
margin-bottom: 0;
|
||||
|
||||
.navigation-link {
|
||||
font-size: var(--font-small);
|
||||
}
|
||||
|
||||
.button__label {
|
||||
color: var(--color-text-help);
|
||||
}
|
||||
|
||||
.button__content {
|
||||
align-items: flex-start;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.nudge {
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
//left: 0;
|
||||
top: 4rem;
|
||||
white-space: normal;
|
||||
overflow: visible;
|
||||
|
|
@ -10,6 +10,7 @@
|
|||
box-shadow: var(--card-box-shadow);
|
||||
background-color: var(--color-secondary);
|
||||
color: var(--color-white);
|
||||
font-weight: bold;
|
||||
|
||||
.button--close {
|
||||
.icon {
|
||||
|
|
|
|||
|
|
@ -55,6 +55,7 @@
|
|||
|
||||
.credit-amount {
|
||||
margin: 0 var(--spacing-m);
|
||||
margin-bottom: -0.5rem;
|
||||
}
|
||||
|
||||
&::before {
|
||||
|
|
|
|||
|
|
@ -115,6 +115,7 @@
|
|||
.search__top-link {
|
||||
margin-top: var(--spacing-s);
|
||||
font-weight: var(--font-weight-body);
|
||||
margin-top: var(--spacing-xs);
|
||||
}
|
||||
|
||||
.search__top-links {
|
||||
|
|
|
|||
|
|
@ -228,6 +228,7 @@
|
|||
@extend .button--alt;
|
||||
@extend .header__navigation-item--icon;
|
||||
padding: var(--spacing-xs);
|
||||
margin-right: var(--spacing-m);
|
||||
|
||||
.button__label {
|
||||
color: var(--color-input-placeholder);
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ $nag-error-z-index: 999;
|
|||
}
|
||||
|
||||
.nag--helpful {
|
||||
background-color: var(--color-secondary);
|
||||
background-color: var(--color-primary);
|
||||
color: var(--color-white);
|
||||
z-index: $nag-helpful-z-index;
|
||||
}
|
||||
|
|
@ -82,7 +82,7 @@ $nag-error-z-index: 999;
|
|||
|
||||
.nag__button--helpful {
|
||||
&:hover {
|
||||
background-color: var(--color-secondary-alt);
|
||||
//background-color: var(--color-secondary-alt);
|
||||
color: var(--color-secondary);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue