3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-24 13:17:18 +02:00
Code Issues Projects Releases Packages Wiki Activity

🐛 Fix several fronted errors related with new UI (#3691)

Browse source 
* 🐛 Fix title toggle arrow without content
* 🐛 Fix export dropdowns
* 🐛 Fix colorpicker eyedrop
* 🐛 Fix hover state on color row
* 🐛 Fix color bullet on color row
* 🐛 Fix some css errors in new UI
* 🐛 Fix text and typography component
* 🐛 Fix some icons
* 💄 Update ui in feedback page, webhooks page and access token page
This commit is contained in:
Eva Marco 2023-10-16 15:07:36 +02:00 • committed by GitHub
parent 25c60f3e0f
commit c9ba4aea46
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
75 changed files with 896 additions and 454 deletions
Download patch file Download diff file Expand all files Collapse all files

189
frontend/resources/styles/main/layouts/main-layout.scss
View file

@ -353,7 +353,10 @@
color: $df-secondary;
}
.form-container {
width: 800px;
margin: 80px auto auto 120px;
form {
width: 468px;
.fields-row {
.custom-input,
.custom-select {
@ -364,6 +367,7 @@
color: $df-primary;
font-size: 11px;
margin-bottom: 12px;
margin-left: -4px;
}
input,
select {
@ -411,8 +415,43 @@
border: 1px solid $da-primary;
}
}
textarea {
border-radius: 8px;
padding: 12px 14px;
background-color: $db-tertiary;
color: $df-primary;
border: none;
&:focus {
outline: 1px solid $da-primary;
}
}
}
}
.field-title {
color: $df-primary;
}
.field-title:not(:first-child) {
margin-top: 64px;
}
.field-text {
color: $df-secondary;
}
button,
.btn-secondary {
width: 100%;
font-size: 11px;
text-transform: uppercase;
background-color: $db-tertiary;
color: $df-primary;
&:hover {
color: $da-primary;
background-color: $db-cuaternary;
}
}
hr {
display: none;
}
}
.links {
margin-top: 12px;
@ -420,6 +459,156 @@
}
}
//Access tokens
.dashboard-access-tokens {
width: 800px;
margin-left: 120px;
margin-top: 80px;
.access-tokens-hero-container {
background-color: transparent;
.access-tokens-hero {
width: 468px;
flex-direction: column;
gap: 32px;
background-color: transparent;
margin: 0;
padding: 0;
.desc {
background-color: transparent;
width: 100%;
h2 {
color: $df-primary;
font-size: 24px;
font-weight: regular;
margin-bottom: 32px;
}
p {
color: $df-secondary;
margin-bottom: 0;
font-size: 14px;
}
}
button {
width: 100%;
font-size: 11px;
text-transform: uppercase;
background-color: $db-tertiary;
color: $df-primary;
&:hover {
color: $da-primary;
background-color: $db-cuaternary;
}
}
}
}
.dashboard-table {
width: 800px;
.table-rows {
padding-top: 0;
.table-row {
font-size: 14px;
min-height: 40px;
height: fit-content;
.name {
color: $df-primary;
max-width: 480px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.expiration-date {
color: $df-secondary;
}
}
}
}
.access-tokens-empty {
width: 468px;
border: 1px solid $db-cuaternary;
border-radius: 8px;
margin-top: 32px;
font-size: 14px;
background-color: transparent;
color: $df-secondary;
}
}
// Team webhooks
&.dashboard-team-webhooks {
width: 800px;
margin-left: 120px;
margin-top: 80px;
border: none;
align-items: flex-start;
.webhooks-hero-container {
width: 468px;
background-color: transparent;
.webhooks-hero {
width: 468px;
flex-direction: column;
gap: 32px;
background-color: transparent;
margin: 0;
padding: 0;
.desc {
background-color: transparent;
width: 100%;
h2 {
color: $df-primary;
font-size: 24px;
font-weight: regular;
margin-bottom: 32px;
}
p {
color: $df-secondary;
margin-bottom: 0;
font-size: 14px;
}
}
.btn-primary {
width: 100%;
font-size: 11px;
text-transform: uppercase;
background-color: $db-tertiary;
color: $df-primary;
&:hover {
color: $da-primary;
background-color: $db-cuaternary;
}
}
}
}
.dashboard-table {
width: 800px;
.table-rows {
padding-top: 0;
.table-row {
font-size: 14px;
min-height: 40px;
height: fit-content;
.name {
color: $df-primary;
max-width: 480px;
}
.expiration-date {
color: $df-secondary;
}
}
}
}
.webhooks-empty {
width: 468px;
border: 1px solid $db-cuaternary;
border-radius: 8px;
margin-top: 32px;
font-size: 14px;
background-color: transparent;
color: $df-secondary;
}
}
// Members section
.dashboard-table {
.table-header {