diff --git a/src/index.html b/src/index.html index dd471dfa0c..815b77589e 100644 --- a/src/index.html +++ b/src/index.html @@ -20,7 +20,7 @@ href="https://fonts.gstatic.com" /> @@ -31,7 +31,7 @@ > phtot of i-mac diff --git a/src/styles/index.scss b/src/styles/index.scss index f5af3a5113..6dc9ed92e1 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -1,8 +1,9 @@ -$bc-image: url(/src/images/star-active.svg); $btn-color: #00acdc; +$btn-text-color: #fff; $main-acent: #060b35; $secondary: #616070; $btn-hover-color: #fff; +$card-border-color: #f3f3f3; body { margin: 0; @@ -13,14 +14,9 @@ body { } .card { - font-family: Roboto, sans-serif; - font-weight: 400; - font-size: 10px; - line-height: 14px; - box-sizing: border-box; width: 200px; - border: 1px solid #f3f3f3; + border: 1px solid $card-border-color; border-radius: 5px; padding: 32px 16px 16px; @@ -30,11 +26,12 @@ body { width: 160px; height: 134px; } + &__btn { display: flex; align-items: center; justify-content: center; - color: #fff; + color: $btn-text-color; text-transform: uppercase; text-decoration: none; font-size: 14px; @@ -99,8 +96,7 @@ body { flex-direction: row; &__star { - background-image: url(/src/images/star.svg); - background-position: center; + background: url(/src/images/star.svg); height: 16px; margin-right: 4px; width: 16px; @@ -108,7 +104,7 @@ body { } &.stars--4 :nth-child(-n + 4) { - background-image: $bc-image; + background-image: url('/src/images/star-active.svg'); } & :last-of-type {