Skip to content

Commit

Permalink
Tweaks
Browse files Browse the repository at this point in the history
  • Loading branch information
@brunosabenca
brunosabenca committed Aug 29, 2024
1 parent 50ba533 commit 7df8743
Show file tree
Hide file tree
Showing 11 changed files with 122 additions and 116 deletions.
3 changes: 1 addition & 2 deletions src/assets/stylesheets/common/texts.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,7 @@ a {
}

a:hover {
color: var(--tdp-primary);
text-decoration: underline;
color: var(--tdp-link-hover-color);
}

a.breadcrumb-link,
Expand Down
179 changes: 91 additions & 88 deletions src/assets/stylesheets/components/buttons.css
View file
Original file line number Diff line number Diff line change
@@ -1,36 +1,36 @@
/* Generic buttons */

.btn {
background-color: transparent;
border: none;
color: var(--tdp-primary-btn-color);
cursor: pointer;
display: inline-block;
text-align: center;
text-decoration: none;
transition: all 0.2s linear;
user-select: none;
vertical-align: middle;
white-space: nowrap;
padding: 7px 20px;
font-size: 14px;
line-height: 19px;
border-radius: var(--tdp-border-radius);
background-color: transparent;
border: none;
color: var(--tdp-primary-btn-color);
cursor: pointer;
display: inline-block;
text-align: center;
text-decoration: none;
transition: all 0.2s linear;
user-select: none;
vertical-align: middle;
white-space: nowrap;
padding: 7px 20px;
font-size: 14px;
line-height: 19px;
border-radius: var(--tdp-border-radius);
}

.btn.focus,
.btn:focus,
.btn:hover {
outline: none;
box-shadow: none;
outline: none;
box-shadow: none;
}

.btn i+span {
margin-left: 5px;
.btn i + span {
margin-left: 5px;
}

.btn + .btn {
margin-left: 10px;
margin-left: 10px;
}

/*
Expand All @@ -39,154 +39,157 @@

/* Primary */

.btn-primary {
border: var(--tdp-primary-btn-border);
background-color: var(--tdp-primary-btn-bg-color);
color: var(--tdp-primary-btn-color);
.btn-primary, .btn-primary:hover {
border: var(--tdp-primary-btn-border);
background-color: var(--tdp-primary-btn-bg-color);
color: var(--tdp-primary-btn-color);
}

.btn-primary:focus,
.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
background-color: var(--tdp-primary);
border: var(--tdp-primary-btn-border);
border: var(--tdp-primary-btn-border);
background-color: var(--tdp-primary-btn-bg-color);
color: var(--tdp-secondary-btn-color);
}

.btn:hover.btn-primary-link:hover {
color: var(--tdp-primary-btn-color);
text-decoration: underline;
color: var(--tdp-primary-btn-color);
}

/* Secondary */
.btn-secondary {
border: var(--tdp-secondary-btn-border);
background: var(--tdp-secondary-btn-bg-color);
color: var(--tdp-secondary-btn-color);
border: var(--tdp-secondary-btn-border);
background: var(--tdp-secondary-btn-bg-color);
color: var(--tdp-secondary-btn-color);
}
.btn-secondary:hover {
border: var(--tdp-secondary-btn-border);
background: white;
color: var(--tdp-secondary-btn-color);
}

/* Warning */

.btn-warning {
border: var(--tdp-warning-btn-border);
background-color: var(--tdp-warning-btn-color);
color: white;
border: var(--tdp-warning-btn-border);
background-color: var(--tdp-warning-btn-color);
color: white;
}

.btn-warning:hover {
color: white;
background-color: var(--tdp-warning-dark);
color: white;
background-color: var(--tdp-warning-dark);
}

.btn-warning-outline {
border: var(--tdp-warning-outline-btn-border);
background-color: transparent;
color: var(--tdp-warning-btn-color);
border: var(--tdp-warning-outline-btn-border);
background-color: transparent;
color: var(--tdp-warning-btn-color);
}

.btn-warning-outline:hover {
border: var(--tdp-warning-outline-btn-border);
background-color: var(--tdp-warning-dark);
color: white;
border: var(--tdp-warning-outline-btn-border);
background-color: var(--tdp-warning-dark);
color: white;
}

/* Danger */

.btn-danger {
border: var(--tdp-danger-outline-btn-border);
background-color: var(--tdp-danger-btn-color);
color: white;
border: var(--tdp-danger-outline-btn-border);
background-color: var(--tdp-danger-btn-color);
color: white;
}

.btn-danger:hover {
color: white;
background-color: var(--tdp-danger-dark);
color: white;
background-color: var(--tdp-danger-dark);
}

.btn-danger-outline {
border: var(--tdp-danger-outline-btn-border);
background-color: transparent;
color: var(--tdp-danger-btn-color);
border: var(--tdp-danger-outline-btn-border);
background-color: transparent;
color: var(--tdp-danger-btn-color);
}

.btn-danger-outline:hover {
border: var(--tdp-danger-outline-btn-border);
background-color: var(--tdp-danger-dark);
color: white;
border: var(--tdp-danger-outline-btn-border);
background-color: var(--tdp-danger-dark);
color: white;
}

/*
Sizes
*/

.btn.btn-sm {
padding: 3px 15px;
font-size: var(--tdp-size-xs);
line-height: 16px;
padding: 3px 15px;
font-size: var(--tdp-size-xs);
line-height: 16px;
}

.btn-btn-md {
padding: 8px 23px;
font-size: var(--tdp-size-sm);
line-height: 19px;
padding: 8px 23px;
font-size: var(--tdp-size-sm);
line-height: 19px;
}

.btn.btn-lg {
padding: 13px 23px;
font-size: var(--tdp-size-md);
line-height: 22px;
padding: 13px 23px;
font-size: var(--tdp-size-md);
line-height: 22px;
}

/* Button as link */
.btn-primary-link {
background-color: transparent;
border-color: transparent;
color: var(--tdp-link-color);
background-color: transparent;
border-color: transparent;
color: var(--tdp-link-color);
}

.btn-secondary-link {
background-color: transparent;
color: var(--tdp-secondary-btn-color);
border: 2px solid transparent;
background-color: transparent;
color: var(--tdp-secondary-btn-color);
border: 2px solid transparent;
}

.btn-secondary-link:hover {
color: var(--tdp-secondary-btn-color);
border: var(--tdp-secondary-btn-border);
background-color: white;
color: var(--tdp-secondary-btn-color);
border: var(--tdp-secondary-btn-border);
background-color: white;
}

/* Add to Cart dropdown button */
.view-docs-dropdown {
padding: 0;
border-radius: var(--tdp-border-radius);
margin-top: 4px;
border: 1px solid var(--tdp-primary-light);
padding: 0;
border-radius: var(--tdp-border-radius);
margin-top: 4px;
border: 1px solid var(--tdp-primary-light);
}

/* On disabled state */
.btn.disabled,
.btn[disabled] {
cursor: not-allowed;
opacity: 0.7;
cursor: not-allowed;
opacity: 0.7;
}

.btn-edit-user-detail {
margin-right: -20px;
background-color: transparent;
color: var(--tdp-text-color);
border: 2px solid transparent;
padding-top: 7px;
padding-right: 20px;
padding-bottom: 7px;
padding-left: 7px;
margin-right: -20px;
background-color: transparent;
color: var(--tdp-text-color);
border: 2px solid transparent;
padding: 7px 20px 7px 7px;
}

.btn-edit-user-detail:hover {
color: var(--tdp-text-color);
color: var(--tdp-text-color);
}

.access-btn-link {
text-decoration: none !important;
color: white !important;
text-decoration: none !important;
color: white !important;
}
7 changes: 4 additions & 3 deletions src/assets/stylesheets/components/card.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@

.card {
border-radius: var(--tdp-card-border-radius);
background-color: white;
color: var(--tdp-text-color);
}

Expand Down Expand Up @@ -106,8 +107,8 @@
/* Blog cards */

.card.dark-background {
background-color: var(--tdp-secondary-dark);
color: white;
background-color: white;
color: var(--tdp-text-color);
}

.card.blog .card-cta {
Expand Down Expand Up @@ -211,4 +212,4 @@ ul.card-ul {
}
ul.card-ul li::marker {
font-size: 12px;
}
}
3 changes: 2 additions & 1 deletion src/assets/stylesheets/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,8 @@
--tdp-light-red: #ffd1ce;
/* Text colors */
--tdp-text-color: #2c3030;
--tdp-link-color: #34d9c3;
--tdp-link-color: rgb(37, 125, 162);
--tdp-link-hover-color: rgb(12, 72, 97);
--tdp-nav-link-color: white;
--tbd-text-color-dark: #1a1a1a;
--tdb-text-color-gray: #828282;
Expand Down
13 changes: 5 additions & 8 deletions src/assets/stylesheets/pages/api-product.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,7 @@
}

.labeled-card {
background: var(--tdp-light-gray);
border: var(--tdp-light-border);
border-radius: 10px;
min-width: 274px;
Expand All @@ -129,10 +130,6 @@
max-height: 166px;
cursor: pointer;
}
.labeled-card:hover {
background: var(--tdp-light-gray);
border: 1px solid var(--tdp-secondary);
}

.labeled-card-plan {
border: var(--tdp-light-border);
Expand Down Expand Up @@ -161,10 +158,10 @@
}

.labeled-card__title {
background-color: var(--tdp-primary-dark);
color: white;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
background-color: var(--tdp-primary);
color: var(--tdp-primary-btn-color);
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
text-align: center;
align-self: center;
padding: 7px 17px;
Expand Down
7 changes: 6 additions & 1 deletion src/assets/stylesheets/pages/blog.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
.page-wrapper .blog-page-wrapper {
padding-top: 0;
padding-top: 30px;
}

.blog-page-wrapper .text-container {
Expand Down Expand Up @@ -41,3 +41,8 @@
top: -1px;
left: 10px;
}

.blog-detail-page-wrapper > .container > .row > .col-lg-12 {
background-color: white;
border-radius: var(--tdp-card-border-radius);
}
Loading

0 comments on commit 7df8743

Please sign in to comment.