MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Replace font-weight 500 with 600 as source sans pro does not have a 500 weight, and update autoscreens and templates to use source sans pro

This commit is contained in:
Andrew Kingston 2021-05-25 10:11:41 +01:00
parent 3c5696199a
commit 6c960dd9e2
37 changed files with 51 additions and 204 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/bbui/src/Avatar/Avatar.svelte
View File

@ -39,7 +39,7 @@
color: white; color: white;
display: grid; display: grid;
place-items: center; place-items: center;
font-weight: 500; font-weight: 600;
background: #3aab87; background: #3aab87;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;

2
packages/bbui/src/DetailSummary/DetailSummary.svelte
View File

@ -50,7 +50,7 @@
.name { .name {
text-align: left; text-align: left;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 600;
letter-spacing: 0.14px; letter-spacing: 0.14px;
color: var(--ink); color: var(--ink);
flex: 1 1 auto; flex: 1 1 auto;

2
packages/bbui/src/Form/Core/Dropzone.svelte
View File

@ -343,7 +343,7 @@
.extension { .extension {
color: var(--spectrum-global-color-gray-600); color: var(--spectrum-global-color-gray-600);
text-transform: uppercase; text-transform: uppercase;
font-weight: 500; font-weight: 600;
margin-bottom: 5px; margin-bottom: 5px;
} }

2
packages/bbui/src/Table/AttachmentRenderer.svelte
View File

@ -49,7 +49,7 @@
border: 1px solid var(--spectrum-global-color-gray-300); border: 1px solid var(--spectrum-global-color-gray-300);
border-radius: 2px; border-radius: 2px;
text-transform: uppercase; text-transform: uppercase;
font-weight: 500; font-weight: 600;
font-size: 11px; font-size: 11px;
} }
</style> </style>

157
packages/builder/src/budibase.css
View File

@ -1,157 +0,0 @@
/* Budibase Component Styles */
.budibase__title {
font-weight: 900;
font-size: 42px;
}
.budibase__title--2 {
font-weight: 700;
font-size: 32px;
}
.budibase__title--3 {
font-weight: 700;
font-size: 24px;
}
.budibase__title--4 {
font-weight: 700;
font-size: 18px;
}
.budibase__label--big {
font-weight: 400;
font-size: 14px;
opacity: 0.6;
text-transform: uppercase;
}
.budibase__label--medium {
font-weight: 500;
font-size: 13px;
opacity: 0.6;
text-transform: uppercase;
}
.budibase__label--small {
font-weight: 500;
font-size: 10px;
opacity: 0.6;
text-transform: uppercase;
}
.budibase__sub-heading {
font-weight: 500;
font-size: 16px;
opacity: 0.6;
}
.budibase__nav-item {
cursor: pointer;
padding: 0 4px 0 2px;
height: 36px;
margin: 0px 0px 0px 0px;
border-radius: 5px;
display: flex;
align-items: center;
font-size: 14px;
transition: 0.2s;
border-top: var(--grey-1) .5px solid;
}
.budibase__nav-item.selected {
color: var(--ink);
background: var(--grey-2);
}
.budibase__nav-item:hover {
background: var(--grey-1);
}
.budibase__input {
height: 36px;
background-color: var(--grey-2);
border: none;
border-radius: 5px;
width: 100%;
text-align: left;
color: var(--ink);
font-size: 14px;
padding-left: 8px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.budibase__table {
border: 1px solid var(--grey-4);
background: #fff;
border-radius: 2px;
}
.budibase__table thead {
background: var(--blue-light);
}
.budibase__table thead > tr > th {
color: var(--ink);
text-transform: capitalize;
font-weight: 500;
}
.budibase__table tr {
border-bottom: 1px solid var(--grey-1);
}
.button--toggled {
background: var(--blue-light);
color: var(--grey-7);
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
}
/* Table styles */
.bb-table {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
margin-bottom: var(--spacing-xl);
}
* + .bb-table {
margin-top: var(--spacing-xl)
}
.bb-table th {
padding: var(--spacing-l) var(--spacing-m);
text-align: left;
vertical-align: bottom;
}
.bb-table td {
padding: var(--spacing-l) var(--spacing-m);
vertical-align: top;
}
.bb-table td > :last-child { margin-bottom: 0; }
.bb__alert {
position: relative;
margin-bottom: var(--spacing-m);
padding: var(--spacing-l);
}
.bb__alert--danger {
background: #fef4f6;
color: #f0506e;
}
a {
text-decoration: none;
}

4
packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js
View File

@ -32,7 +32,7 @@ function generateTitleContainer(table, title, formId, repeaterId) {
"border-width": "0", "border-width": "0",
"border-style": "None", "border-style": "None",
color: "#fff", color: "#fff",
"font-weight": "500", "font-weight": "600",
"font-size": "14px", "font-size": "14px",
}) })
@ -42,7 +42,7 @@ function generateTitleContainer(table, title, formId, repeaterId) {
"border-width": "0", "border-width": "0",
"border-style": "None", "border-style": "None",
color: "#9e9e9e", color: "#9e9e9e",
"font-weight": "500", "font-weight": "600",
"font-size": "14px", "font-size": "14px",
"margin-right": "8px", "margin-right": "8px",
"margin-left": "16px", "margin-left": "16px",

4
packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js
View File

@ -24,7 +24,7 @@ function generateTitleContainer(table) {
"border-width": "0", "border-width": "0",
"border-style": "None", "border-style": "None",
color: "#fff", color: "#fff",
"font-weight": "500", "font-weight": "600",
"font-size": "14px", "font-size": "14px",
}) })
.hoverStyle({ .hoverStyle({
@ -110,7 +110,7 @@ const createScreen = table => {
.instanceName("View Button") .instanceName("View Button")
.normalStyle({ .normalStyle({
background: "transparent", background: "transparent",
"font-weight": "500", "font-weight": "600",
color: "#888", color: "#888",
"border-width": "0", "border-width": "0",
}) })

2
packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItem.svelte
View File

@ -67,7 +67,7 @@
header { header {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 600;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;

2
packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte
View File

@ -130,7 +130,7 @@
} }
.block-label { .block-label {
font-weight: 500; font-weight: 600;
font-size: var(--font-size-s); font-size: var(--font-size-s);
color: var(--grey-7); color: var(--grey-7);
} }

2
packages/builder/src/components/automation/SetupPanel/SetupPanel.svelte
View File

@ -99,7 +99,7 @@
.block-label { .block-label {
font-size: var(--spectrum-global-dimension-font-size-75); font-size: var(--spectrum-global-dimension-font-size-75);
font-weight: 500; font-weight: 600;
color: var(--grey-7); color: var(--grey-7);
} }
</style> </style>

2
packages/builder/src/components/automation/Shared/CreateWebhookModal.svelte
View File

@ -88,7 +88,7 @@
text-align: justify; text-align: justify;
} }
.finished-text { .finished-text {
font-weight: 500; font-weight: 600;
text-align: center; text-align: center;
color: var(--blue); color: var(--blue);
} }

4
packages/builder/src/components/backend/DataTable/Table.svelte
View File

@ -143,7 +143,7 @@
} }
.table-title h1 { .table-title h1 {
font-size: var(--font-size-m); font-size: var(--font-size-m);
font-weight: 500; font-weight: 600;
margin: 0; margin: 0;
} }
.table-title > div { .table-title > div {
@ -158,7 +158,7 @@
gap: var(--spacing-s); gap: var(--spacing-s);
} }
.popovers :global(button) { .popovers :global(button) {
font-weight: 500; font-weight: 600;
margin-top: var(--spacing-l); margin-top: var(--spacing-l);
} }
.popovers :global(button svg) { .popovers :global(button svg) {

4
packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
View File

@ -170,7 +170,7 @@
.field-status { .field-status {
color: var(--green); color: var(--green);
justify-self: center; justify-self: center;
font-weight: 500; font-weight: 600;
} }
.error { .error {
@ -192,7 +192,7 @@
label { label {
font-family: var(--font-sans); font-family: var(--font-sans);
cursor: pointer; cursor: pointer;
font-weight: 500; font-weight: 600;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; overflow: hidden;
border-radius: var(--border-radius-s); border-radius: var(--border-radius-s);

4
packages/builder/src/components/backend/TableNavigator/popovers/EditTablePopover.svelte
View File

@ -115,7 +115,7 @@
div.delete-items div { div.delete-items div {
margin-top: 4px; margin-top: 4px;
font-weight: 500; font-weight: 600;
} }
.actions { .actions {
@ -127,7 +127,7 @@
h5 { h5 {
margin: 0; margin: 0;
font-weight: 500; font-weight: 600;
} }
footer { footer {

2
packages/builder/src/components/common/Dropdowns/DropdownItem.svelte
View File

@ -48,7 +48,7 @@
} }
.title { .title {
font-weight: 500; font-weight: 600;
} }
.subtitle { .subtitle {

2
packages/builder/src/components/common/ErrorsBox.svelte
View File

@ -23,7 +23,7 @@
.error { .error {
font-size: var(--font-size-xs); font-size: var(--font-size-xs);
font-weight: 500; font-weight: 600;
} }
.error:first-letter { .error:first-letter {
text-transform: uppercase; text-transform: uppercase;

2
packages/builder/src/components/common/NavItem.svelte
View File

@ -98,7 +98,7 @@
.text { .text {
flex: 1 1 auto; flex: 1 1 auto;
font-weight: 500; font-weight: 600;
font-size: var(--spectrum-global-dimension-font-size-75); font-size: var(--spectrum-global-dimension-font-size-75);
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;

4
packages/builder/src/components/common/bindings/ServerBindingPanel.svelte
View File

@ -141,7 +141,7 @@
cursor: pointer; cursor: pointer;
} }
.binding__label { .binding__label {
font-weight: 500; font-weight: 600;
text-transform: capitalize; text-transform: capitalize;
} }
.binding__description { .binding__description {
@ -160,7 +160,7 @@
border-radius: var(--border-radius-m); border-radius: var(--border-radius-m);
padding: 2px; padding: 2px;
margin-left: 2px; margin-left: 2px;
font-weight: 500; font-weight: 600;
} }
.syntax-error { .syntax-error {

6
packages/builder/src/components/deploy/DeploymentHistory.svelte
View File

@ -209,7 +209,7 @@
.deploy-time { .deploy-time {
color: var(--grey-7); color: var(--grey-7);
font-weight: 500; font-weight: 600;
font-size: var(--font-size-s); font-size: var(--font-size-s);
} }
@ -224,7 +224,7 @@
font-size: var(--font-size-s); font-size: var(--font-size-s);
padding: var(--spacing-s); padding: var(--spacing-s);
border-radius: var(--border-radius-s); border-radius: var(--border-radius-s);
font-weight: 500; font-weight: 600;
text-transform: lowercase; text-transform: lowercase;
width: 80px; width: 80px;
text-align: center; text-align: center;
@ -235,7 +235,7 @@
a { a {
color: var(--blue); color: var(--blue);
font-weight: 500; font-weight: 600;
font-size: var(--font-size-s); font-size: var(--font-size-s);
} }

2
packages/builder/src/components/design/PropertiesPanel/CategoryTab.svelte
View File

@ -24,7 +24,7 @@
align-items: center; align-items: center;
list-style: none; list-style: none;
font-size: var(--font-size-m); font-size: var(--font-size-m);
font-weight: 500; font-weight: 600;
height: 24px; height: 24px;
} }

2
packages/builder/src/components/design/PropertiesPanel/PropertiesPanel.svelte
View File

@ -87,7 +87,7 @@
font-size: var(--spectrum-global-dimension-font-size-75); font-size: var(--spectrum-global-dimension-font-size-75);
margin-bottom: var(--spacing-m); margin-bottom: var(--spacing-m);
margin-top: var(--spacing-xs); margin-top: var(--spacing-xs);
font-weight: 500; font-weight: 600;
color: var(--grey-7); color: var(--grey-7);
} }
</style> </style>

2
packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
View File

@ -252,7 +252,7 @@
i:hover { i:hover {
transform: scale(1.1); transform: scale(1.1);
font-weight: 500; font-weight: 600;
cursor: pointer; cursor: pointer;
} }
</style> </style>

2
packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte
View File

@ -144,7 +144,7 @@
margin-bottom: var(--spacing-m); margin-bottom: var(--spacing-m);
font-size: var(--font-size-s); font-size: var(--font-size-s);
color: var(--grey-7); color: var(--grey-7);
font-weight: 500; font-weight: 600;
} }
.action-header:hover, .action-header:hover,

2
packages/builder/src/components/design/PropertiesPanel/PropertyControls/FlatButtonGroup/FlatButton.svelte
View File

@ -30,7 +30,7 @@
color: var(--grey-7); color: var(--grey-7);
border-radius: var(--border-radius-m); border-radius: var(--border-radius-m);
font-size: var(--spectrum-global-dimension-font-size-75); font-size: var(--spectrum-global-dimension-font-size-75);
font-weight: 500; font-weight: 600;
transition: all 0.3s; transition: all 0.3s;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
} }

2
packages/builder/src/components/feedback/FeedbackNavLink.svelte
View File

@ -36,7 +36,7 @@
cursor: pointer; cursor: pointer;
color: var(--grey-7); color: var(--grey-7);
margin: 0 12px 0 0; margin: 0 12px 0 0;
font-weight: 500; font-weight: 600;
font-size: 1rem; font-size: 1rem;
display: flex; display: flex;
flex-direction: row; flex-direction: row;

2
packages/builder/src/components/settings/Link.svelte
View File

@ -25,7 +25,7 @@
cursor: pointer; cursor: pointer;
color: var(--grey-7); color: var(--grey-7);
margin: 0 12px 0 0; margin: 0 12px 0 0;
font-weight: 500; font-weight: 600;
font-size: 1rem; font-size: 1rem;
display: flex; display: flex;
flex-direction: row; flex-direction: row;

2
packages/builder/src/components/settings/tabs/APIKeys.svelte
View File

@ -57,6 +57,6 @@
span { span {
font-size: var(--font-size-xs); font-size: var(--font-size-xs);
font-weight: 500; font-weight: 600;
} }
</style> </style>

5
packages/builder/src/global.css
View File

@ -36,6 +36,9 @@ body {
.hoverable:hover { .hoverable:hover {
cursor: pointer; cursor: pointer;
} }
a {
text-decoration: none;
}
/* Top bottom spacing */ /* Top bottom spacing */
.bb-margin-m { .bb-margin-m {
@ -44,11 +47,9 @@ body {
* + .bb-margin-m { * + .bb-margin-m {
margin-top: var(--spacing-m); margin-top: var(--spacing-m);
} }
.bb-margin-xl { .bb-margin-xl {
margin-bottom: var(--spacing-xl); margin-bottom: var(--spacing-xl);
} }
* + .bb-margin-xl { * + .bb-margin-xl {
margin-top: var(--spacing-xl); margin-top: var(--spacing-xl);
} }

1
packages/builder/src/main.js
View File

@ -7,7 +7,6 @@ import "@spectrum-css/vars/dist/spectrum-light.css"
import "@spectrum-css/vars/dist/spectrum-lightest.css" import "@spectrum-css/vars/dist/spectrum-lightest.css"
import "@spectrum-css/page/dist/index-vars.css" import "@spectrum-css/page/dist/index-vars.css"
import "./global.css" import "./global.css"
import "./budibase.css"
import loadSpectrumIcons from "@budibase/bbui/spectrum-icons-vite.js" import loadSpectrumIcons from "@budibase/bbui/spectrum-icons-vite.js"
loadSpectrumIcons() loadSpectrumIcons()

2
packages/builder/src/pages/builder/app/[application]/_layout.svelte
View File

@ -172,7 +172,7 @@
.topnavitemright a:hover { .topnavitemright a:hover {
color: var(--ink); color: var(--ink);
font-weight: 500; font-weight: 600;
} }
.home-logo { .home-logo {

2
packages/builder/src/pages/builder/portal/_layout.svelte
View File

@ -186,7 +186,7 @@
span { span {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
font-weight: 500; font-weight: 600;
} }
.content { .content {
overflow: auto; overflow: auto;

2
packages/client/src/components/NotificationDisplay.svelte
View File

@ -55,6 +55,6 @@
padding: 10px; padding: 10px;
display: block; display: block;
color: white; color: white;
font-weight: 500; font-weight: 600;
} }
</style> </style>

5
packages/server/src/constants/layouts.js
View File

@ -98,7 +98,6 @@ const BASE_LAYOUTS = [
"margin-left": "auto", "margin-left": "auto",
"margin-right": "auto", "margin-right": "auto",
padding: "20px", padding: "20px",
color: "#757575",
"font-weight": "400", "font-weight": "400",
"font-size": "16px", "font-size": "16px",
flex: "1 1 auto", flex: "1 1 auto",
@ -120,9 +119,7 @@ const BASE_LAYOUTS = [
_component: "@budibase/standard-components/link", _component: "@budibase/standard-components/link",
_styles: { _styles: {
normal: { normal: {
"font-family": "Inter", "font-weight": "600",
"font-weight": "500",
color: "#000000",
"text-decoration-line": "none", "text-decoration-line": "none",
"font-size": "16px", "font-size": "16px",
}, },

1
packages/standard-components/src/Button.svelte
View File

@ -33,5 +33,6 @@
user-select: none; user-select: none;
white-space: nowrap; white-space: nowrap;
text-align: center; text-align: center;
font-family: var(--font-sans);
} }
</style> </style>

4
packages/standard-components/src/CardStat.svelte
View File

@ -28,14 +28,14 @@
.title { .title {
font-size: 0.85rem; font-size: 0.85rem;
color: #9e9e9e; color: #9e9e9e;
font-weight: 500; font-weight: 600;
margin: 1rem 1.5rem 0.5rem 1.5rem; margin: 1rem 1.5rem 0.5rem 1.5rem;
white-space: pre-wrap; white-space: pre-wrap;
} }
.value { .value {
font-size: 2rem; font-size: 2rem;
font-weight: 500; font-weight: 600;
margin: 0 1.5rem 1.5rem 1.5rem; margin: 0 1.5rem 1.5rem 1.5rem;
color: inherit; color: inherit;
white-space: pre-wrap; white-space: pre-wrap;

2
packages/standard-components/src/ErrorsBox.svelte
View File

@ -22,7 +22,7 @@
.error { .error {
font-size: var(--font-size-xs); font-size: var(--font-size-xs);
font-weight: 500; font-weight: 600;
color: var(--red-dark); color: var(--red-dark);
} }
.error:first-letter { .error:first-letter {

6
packages/standard-components/src/Link.svelte
View File

@ -23,3 +23,9 @@
<slot /> <slot />
</a> </a>
{/if} {/if}
<style>
a {
color: var(--spectrum-alias-text-color);
}
</style>