Skip to content

Commit 7df8743

Browse files
brunosabencabrunosabenca
committed
Tweaks
1 parent 50ba533 commit 7df8743

File tree

11 files changed

+122
-116
lines changed

11 files changed

+122
-116
lines changed

‎src/assets/stylesheets/common/texts.css

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,7 @@ a {
1616
}
1717

1818
a:hover {
19-
color: var(--tdp-primary);
20-
text-decoration: underline;
19+
color: var(--tdp-link-hover-color);
2120
}
2221

2322
a.breadcrumb-link,

‎src/assets/stylesheets/components/buttons.css

Lines changed: 91 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,36 @@
11
/* Generic buttons */
22

33
.btn {
4-
background-color: transparent;
5-
border: none;
6-
color: var(--tdp-primary-btn-color);
7-
cursor: pointer;
8-
display: inline-block;
9-
text-align: center;
10-
text-decoration: none;
11-
transition: all 0.2s linear;
12-
user-select: none;
13-
vertical-align: middle;
14-
white-space: nowrap;
15-
padding: 7px 20px;
16-
font-size: 14px;
17-
line-height: 19px;
18-
border-radius: var(--tdp-border-radius);
4+
background-color: transparent;
5+
border: none;
6+
color: var(--tdp-primary-btn-color);
7+
cursor: pointer;
8+
display: inline-block;
9+
text-align: center;
10+
text-decoration: none;
11+
transition: all 0.2s linear;
12+
user-select: none;
13+
vertical-align: middle;
14+
white-space: nowrap;
15+
padding: 7px 20px;
16+
font-size: 14px;
17+
line-height: 19px;
18+
border-radius: var(--tdp-border-radius);
1919
}
2020

2121
.btn.focus,
2222
.btn:focus,
2323
.btn:hover {
24-
outline: none;
25-
box-shadow: none;
24+
outline: none;
25+
box-shadow: none;
2626
}
2727

28-
.btn i+span {
29-
margin-left: 5px;
28+
.btn i + span {
29+
margin-left: 5px;
3030
}
3131

3232
.btn + .btn {
33-
margin-left: 10px;
33+
margin-left: 10px;
3434
}
3535

3636
/*
@@ -39,154 +39,157 @@
3939

4040
/* Primary */
4141

42-
.btn-primary {
43-
border: var(--tdp-primary-btn-border);
44-
background-color: var(--tdp-primary-btn-bg-color);
45-
color: var(--tdp-primary-btn-color);
42+
.btn-primary, .btn-primary:hover {
43+
border: var(--tdp-primary-btn-border);
44+
background-color: var(--tdp-primary-btn-bg-color);
45+
color: var(--tdp-primary-btn-color);
4646
}
4747

4848
.btn-primary:focus,
4949
.btn-primary:hover,
5050
.btn-primary:not(:disabled):not(.disabled).active,
5151
.btn-primary:not(:disabled):not(.disabled):active,
5252
.show > .btn-primary.dropdown-toggle {
53-
background-color: var(--tdp-primary);
54-
border: var(--tdp-primary-btn-border);
53+
border: var(--tdp-primary-btn-border);
54+
background-color: var(--tdp-primary-btn-bg-color);
55+
color: var(--tdp-secondary-btn-color);
5556
}
5657

5758
.btn:hover.btn-primary-link:hover {
58-
color: var(--tdp-primary-btn-color);
59-
text-decoration: underline;
59+
color: var(--tdp-primary-btn-color);
6060
}
6161

6262
/* Secondary */
6363
.btn-secondary {
64-
border: var(--tdp-secondary-btn-border);
65-
background: var(--tdp-secondary-btn-bg-color);
66-
color: var(--tdp-secondary-btn-color);
64+
border: var(--tdp-secondary-btn-border);
65+
background: var(--tdp-secondary-btn-bg-color);
66+
color: var(--tdp-secondary-btn-color);
67+
}
68+
.btn-secondary:hover {
69+
border: var(--tdp-secondary-btn-border);
70+
background: white;
71+
color: var(--tdp-secondary-btn-color);
6772
}
6873

6974
/* Warning */
7075

7176
.btn-warning {
72-
border: var(--tdp-warning-btn-border);
73-
background-color: var(--tdp-warning-btn-color);
74-
color: white;
77+
border: var(--tdp-warning-btn-border);
78+
background-color: var(--tdp-warning-btn-color);
79+
color: white;
7580
}
7681

7782
.btn-warning:hover {
78-
color: white;
79-
background-color: var(--tdp-warning-dark);
83+
color: white;
84+
background-color: var(--tdp-warning-dark);
8085
}
8186

8287
.btn-warning-outline {
83-
border: var(--tdp-warning-outline-btn-border);
84-
background-color: transparent;
85-
color: var(--tdp-warning-btn-color);
88+
border: var(--tdp-warning-outline-btn-border);
89+
background-color: transparent;
90+
color: var(--tdp-warning-btn-color);
8691
}
8792

8893
.btn-warning-outline:hover {
89-
border: var(--tdp-warning-outline-btn-border);
90-
background-color: var(--tdp-warning-dark);
91-
color: white;
94+
border: var(--tdp-warning-outline-btn-border);
95+
background-color: var(--tdp-warning-dark);
96+
color: white;
9297
}
9398

9499
/* Danger */
95100

96101
.btn-danger {
97-
border: var(--tdp-danger-outline-btn-border);
98-
background-color: var(--tdp-danger-btn-color);
99-
color: white;
102+
border: var(--tdp-danger-outline-btn-border);
103+
background-color: var(--tdp-danger-btn-color);
104+
color: white;
100105
}
101106

102107
.btn-danger:hover {
103-
color: white;
104-
background-color: var(--tdp-danger-dark);
108+
color: white;
109+
background-color: var(--tdp-danger-dark);
105110
}
106111

107112
.btn-danger-outline {
108-
border: var(--tdp-danger-outline-btn-border);
109-
background-color: transparent;
110-
color: var(--tdp-danger-btn-color);
113+
border: var(--tdp-danger-outline-btn-border);
114+
background-color: transparent;
115+
color: var(--tdp-danger-btn-color);
111116
}
112117

113118
.btn-danger-outline:hover {
114-
border: var(--tdp-danger-outline-btn-border);
115-
background-color: var(--tdp-danger-dark);
116-
color: white;
119+
border: var(--tdp-danger-outline-btn-border);
120+
background-color: var(--tdp-danger-dark);
121+
color: white;
117122
}
118123

119124
/*
120125
Sizes
121126
*/
122127

123128
.btn.btn-sm {
124-
padding: 3px 15px;
125-
font-size: var(--tdp-size-xs);
126-
line-height: 16px;
129+
padding: 3px 15px;
130+
font-size: var(--tdp-size-xs);
131+
line-height: 16px;
127132
}
128133

129134
.btn-btn-md {
130-
padding: 8px 23px;
131-
font-size: var(--tdp-size-sm);
132-
line-height: 19px;
135+
padding: 8px 23px;
136+
font-size: var(--tdp-size-sm);
137+
line-height: 19px;
133138
}
134139

135140
.btn.btn-lg {
136-
padding: 13px 23px;
137-
font-size: var(--tdp-size-md);
138-
line-height: 22px;
141+
padding: 13px 23px;
142+
font-size: var(--tdp-size-md);
143+
line-height: 22px;
139144
}
140145

141146
/* Button as link */
142147
.btn-primary-link {
143-
background-color: transparent;
144-
border-color: transparent;
145-
color: var(--tdp-link-color);
148+
background-color: transparent;
149+
border-color: transparent;
150+
color: var(--tdp-link-color);
146151
}
147152

148153
.btn-secondary-link {
149-
background-color: transparent;
150-
color: var(--tdp-secondary-btn-color);
151-
border: 2px solid transparent;
154+
background-color: transparent;
155+
color: var(--tdp-secondary-btn-color);
156+
border: 2px solid transparent;
152157
}
153158

154159
.btn-secondary-link:hover {
155-
color: var(--tdp-secondary-btn-color);
156-
border: var(--tdp-secondary-btn-border);
157-
background-color: white;
160+
color: var(--tdp-secondary-btn-color);
161+
border: var(--tdp-secondary-btn-border);
162+
background-color: white;
158163
}
159164

160165
/* Add to Cart dropdown button */
161166
.view-docs-dropdown {
162-
padding: 0;
163-
border-radius: var(--tdp-border-radius);
164-
margin-top: 4px;
165-
border: 1px solid var(--tdp-primary-light);
167+
padding: 0;
168+
border-radius: var(--tdp-border-radius);
169+
margin-top: 4px;
170+
border: 1px solid var(--tdp-primary-light);
166171
}
167172

168173
/* On disabled state */
169174
.btn.disabled,
170175
.btn[disabled] {
171-
cursor: not-allowed;
172-
opacity: 0.7;
176+
cursor: not-allowed;
177+
opacity: 0.7;
173178
}
179+
174180
.btn-edit-user-detail {
175-
margin-right: -20px;
176-
background-color: transparent;
177-
color: var(--tdp-text-color);
178-
border: 2px solid transparent;
179-
padding-top: 7px;
180-
padding-right: 20px;
181-
padding-bottom: 7px;
182-
padding-left: 7px;
181+
margin-right: -20px;
182+
background-color: transparent;
183+
color: var(--tdp-text-color);
184+
border: 2px solid transparent;
185+
padding: 7px 20px 7px 7px;
183186
}
184187

185188
.btn-edit-user-detail:hover {
186-
color: var(--tdp-text-color);
189+
color: var(--tdp-text-color);
187190
}
188191

189192
.access-btn-link {
190-
text-decoration: none !important;
191-
color: white !important;
193+
text-decoration: none !important;
194+
color: white !important;
192195
}

‎src/assets/stylesheets/components/card.css

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66

77
.card {
88
border-radius: var(--tdp-card-border-radius);
9+
background-color: white;
910
color: var(--tdp-text-color);
1011
}
1112

@@ -106,8 +107,8 @@
106107
/* Blog cards */
107108

108109
.card.dark-background {
109-
background-color: var(--tdp-secondary-dark);
110-
color: white;
110+
background-color: white;
111+
color: var(--tdp-text-color);
111112
}
112113

113114
.card.blog .card-cta {
@@ -211,4 +212,4 @@ ul.card-ul {
211212
}
212213
ul.card-ul li::marker {
213214
font-size: 12px;
214-
}
215+
}

‎src/assets/stylesheets/main.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,8 @@
6565
--tdp-light-red: #ffd1ce;
6666
/* Text colors */
6767
--tdp-text-color: #2c3030;
68-
--tdp-link-color: #34d9c3;
68+
--tdp-link-color: rgb(37, 125, 162);
69+
--tdp-link-hover-color: rgb(12, 72, 97);
6970
--tdp-nav-link-color: white;
7071
--tbd-text-color-dark: #1a1a1a;
7172
--tdb-text-color-gray: #828282;

‎src/assets/stylesheets/pages/api-product.css

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,7 @@
121121
}
122122

123123
.labeled-card {
124+
background: var(--tdp-light-gray);
124125
border: var(--tdp-light-border);
125126
border-radius: 10px;
126127
min-width: 274px;
@@ -129,10 +130,6 @@
129130
max-height: 166px;
130131
cursor: pointer;
131132
}
132-
.labeled-card:hover {
133-
background: var(--tdp-light-gray);
134-
border: 1px solid var(--tdp-secondary);
135-
}
136133

137134
.labeled-card-plan {
138135
border: var(--tdp-light-border);
@@ -161,10 +158,10 @@
161158
}
162159

163160
.labeled-card__title {
164-
background-color: var(--tdp-primary-dark);
165-
color: white;
166-
border-bottom-left-radius: 20px;
167-
border-bottom-right-radius: 20px;
161+
background-color: var(--tdp-primary);
162+
color: var(--tdp-primary-btn-color);
163+
border-bottom-left-radius: 10px;
164+
border-bottom-right-radius: 10px;
168165
text-align: center;
169166
align-self: center;
170167
padding: 7px 17px;

‎src/assets/stylesheets/pages/blog.css

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.page-wrapper .blog-page-wrapper {
2-
padding-top: 0;
2+
padding-top: 30px;
33
}
44

55
.blog-page-wrapper .text-container {
@@ -41,3 +41,8 @@
4141
top: -1px;
4242
left: 10px;
4343
}
44+
45+
.blog-detail-page-wrapper > .container > .row > .col-lg-12 {
46+
background-color: white;
47+
border-radius: var(--tdp-card-border-radius);
48+
}

0 commit comments

Comments
 (0)