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

Selected pseudo class removed, workflow panels updated

This commit is contained in:
Joe 2020-06-23 21:29:18 +01:00
parent 28fadac7f7
commit d95c4c7a54
18 changed files with 52 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -57,9 +57,9 @@
.budibase__nav-item { .budibase__nav-item {
cursor: pointer; cursor: pointer;
padding: 0 4px 0 2px; padding: 0 4px 0 2px;
height: 35px; height: 40px;
margin: 5px 0px 4px 0px; margin: 0px 0px 0px 0px;
border-radius: 0 5px 5px 0; border-radius: 5px;
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;

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

@ -55,7 +55,7 @@
} }
:global(.uk-notification-message-danger) { :global(.uk-notification-message-danger) {
background: var(--grey-7) !important; background: var(--grey-9) !important;
color: #fff !important; color: #fff !important;
font-size: 16px !important; font-size: 16px !important;
} }

8
packages/builder/src/components/common/Input.svelte
View File

@ -38,16 +38,16 @@
height: 32px; height: 32px;
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
margin: 0px 0px 0px 1px; margin: 0px 0px 0px 2px;
color: var(--ink); color: var(--ink);
opacity: 0.7; opacity: 0.7;
padding: 0px 4px; padding: 0px 4px;
line-height: 1.3; line-height: 1.3;
/* padding: 12px; */
width: 164px; width: 164px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid var(--grey-2); background-color: var(--grey-3);
border-radius: 2px; border-radius: 4px;
border: 1px solid var(--grey-3);
outline: none; outline: none;
} }

6
packages/builder/src/components/userInterface/ComponentsHierarchy.svelte
View File

@ -77,8 +77,7 @@
} }
.title { .title {
margin-left: 10px; margin-left: 14px;
margin-top: 2px;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
} }
@ -87,8 +86,7 @@
display: inline-block; display: inline-block;
transition: 0.2s; transition: 0.2s;
font-size: 24px; font-size: 24px;
width: 20px; width: 18px;
margin-top: 2px;
color: var(--grey-7); color: var(--grey-7);
} }

2
packages/builder/src/components/userInterface/ComponentsHierarchyChildren.svelte
View File

@ -39,7 +39,7 @@
<div <div
class="budibase__nav-item item" class="budibase__nav-item item"
class:selected={currentComponent === component} class:selected={currentComponent === component}
style="padding-left: {level * 20 + 53}px"> style="padding-left: {level * 16 + 32}px">
<div class="nav-item"> <div class="nav-item">
<i class="icon ri-arrow-right-circle-fill" /> <i class="icon ri-arrow-right-circle-fill" />
{get_capitalised_name(component._component)} {get_capitalised_name(component._component)}

1
packages/builder/src/components/userInterface/DesignView.svelte
View File

@ -19,7 +19,6 @@
{ value: "normal", text: "Normal" }, { value: "normal", text: "Normal" },
{ value: "hover", text: "Hover" }, { value: "hover", text: "Hover" },
{ value: "active", text: "Active" }, { value: "active", text: "Active" },
{ value: "selected", text: "Selected" },
] ]
$: propertyGroupNames = Object.keys(panelDefinition) $: propertyGroupNames = Object.keys(panelDefinition)

9
packages/builder/src/components/userInterface/FlatButton.svelte
View File

@ -3,18 +3,14 @@
export let value = "" export let value = ""
export let text = "" export let text = ""
export let icon = "" export let icon = ""
export let padding = "8px 5px;"
export let onClick = value => {} export let onClick = value => {}
export let selected = false export let selected = false
export let fontWeight = ""
$: style = buildStyle({ padding, fontWeight })
$: useIcon = !!icon $: useIcon = !!icon
</script> </script>
<div <div
class="flatbutton" class="flatbutton"
{style}
class:selected class:selected
on:click={() => onClick(value || text)}> on:click={() => onClick(value || text)}>
{#if useIcon} {#if useIcon}
@ -29,7 +25,11 @@
<style> <style>
.flatbutton { .flatbutton {
cursor: pointer; cursor: pointer;
max-height: 36px;
padding: 8px 2px; padding: 8px 2px;
display: flex;
align-items: center;
justify-content: center;
text-align: center; text-align: center;
background: #ffffff; background: #ffffff;
color: var(--grey-7); color: var(--grey-7);
@ -37,7 +37,6 @@
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
transition: all 0.3s; transition: all 0.3s;
margin-left: 5px;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
} }

1
packages/builder/src/components/userInterface/FlatButtonGroup.svelte
View File

@ -46,6 +46,7 @@
<style> <style>
.flatbutton-group { .flatbutton-group {
display: flex; display: flex;
width: 100%
} }
.button-container { .button-container {

16
packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
View File

@ -15,7 +15,6 @@
<PagesList /> <PagesList />
<button class="newscreen" on:click={newScreen}> <button class="newscreen" on:click={newScreen}>
<i class="icon ri-add-circle-fill" />
Create New Screen Create New Screen
</button> </button>
@ -30,23 +29,26 @@
<style> <style>
.newscreen { .newscreen {
cursor: pointer; cursor: pointer;
border: 1px solid var(--grey-4); border: 1px solid var(--purple);
border-radius: 3px; border-radius: 5px;
width: 100%; width: 100%;
height: 36px;
padding: 8px 16px; padding: 8px 16px;
margin: 20px 0px 12px 0px; margin: 20px 0px 12px 0px;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: white; background: var(--purple);
color: var(--ink); color: var(--white);
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
transition: all 2ms; transition: all 3ms;
outline: none;
} }
.newscreen:hover { .newscreen:hover {
background: var(--grey-1); background: var(--purple-light);
color: var(--purple);
} }
.icon { .icon {

7
packages/builder/src/components/userInterface/OptionSelect.svelte
View File

@ -142,15 +142,16 @@
position: relative; position: relative;
outline: none; outline: none;
width: 160px; width: 160px;
height: 32px; height: 36px;
cursor: pointer; cursor: pointer;
font-size: 12px; font-size: 14px;
} }
.bb-select-anchor { .bb-select-anchor {
cursor: pointer; cursor: pointer;
display: flex; display: flex;
padding: 5px 10px; padding: 0px 12px;
height: 36px;
background-color: var(--grey-2); background-color: var(--grey-2);
border-radius: 5px; border-radius: 5px;
align-items: center; align-items: center;

2
packages/builder/src/components/userInterface/PageLayout.svelte
View File

@ -77,7 +77,7 @@
} }
.icon-big { .icon-big {
font-size: 24px; font-size: 20px;
color: var(--grey-7); color: var(--grey-7);
} }

3
packages/builder/src/components/userInterface/PagesList.svelte
View File

@ -43,7 +43,8 @@
button { button {
cursor: pointer; cursor: pointer;
padding: 8px 16px; padding: 0px 16px;
height: 36px;
text-align: center; text-align: center;
background: #ffffff; background: #ffffff;
color: var(--grey-7); color: var(--grey-7);

1
packages/builder/src/components/userInterface/PropertyControl.svelte
View File

@ -54,7 +54,6 @@
flex: 0 0 50px; flex: 0 0 50px;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0px 5px;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
text-align: left; text-align: left;

13
packages/builder/src/components/userInterface/propertyCategories.js
View File

@ -262,15 +262,10 @@ export const typography = [
key: "text-transform", key: "text-transform",
control: FlatButtonGroup, control: FlatButtonGroup,
buttonProps: [ buttonProps: [
{ text: "BB", padding: "0px 5px", fontWeight: 500, value: "uppercase" }, { text: "BB", value: "uppercase" },
{ text: "Bb", padding: "0px 5px", fontWeight: 500, value: "capitalize" }, { text: "Bb", value: "capitalize" },
{ text: "bb", padding: "0px 5px", fontWeight: 500, value: "lowercase" }, { text: "bb", value: "lowercase" },
{ { text: "&times;", value: "none" },
text: "&times;",
padding: "0px 5px",
fontWeight: 500,
value: "none",
},
], ],
}, },
{ {

8
packages/builder/src/components/workflow/SetupPanel/SetupPanel.svelte
View File

@ -180,15 +180,15 @@
.config-item { .config-item {
margin: 0px 0px 4px 0px; margin: 0px 0px 4px 0px;
padding: 12px; padding: 12px 0px;
background: var(--grey-1);
} }
.budibase_input { .budibase_input {
height: 35px; height: 35px;
width: 220px; width: 244px;
border-radius: 3px; border-radius: 3px;
border: 1px solid var(--grey-4); background-color: var(--grey-2);
border: 1px solid var(--grey-2);
text-align: left; text-align: left;
color: var(--ink); color: var(--ink);
font-size: 14px; font-size: 14px;

20
packages/builder/src/components/workflow/WorkflowPanel/BlockList/BlockList.svelte
View File

@ -53,29 +53,31 @@
<style> <style>
.subtabs { .subtabs {
margin-top: 27px; margin-top: 20px;
display: grid; display: grid;
grid-gap: 5px;
grid-auto-flow: column; grid-auto-flow: column;
grid-auto-columns: 1fr 1fr 1fr; grid-auto-columns: 1fr 1fr 1fr;
margin-bottom: 10px; margin-bottom: 12px;
} }
.subtabs span { .subtabs span {
transition: 0.3s all; transition: 0.3s all;
text-align: center; text-align: center;
color: var(--grey-7); color: var(--grey-7);
font-weight: 500; font-weight: 400;
padding: 10px; padding: 8px 16px;
text-rendering: optimizeLegibility;
border: none !important;
outline: none;
} }
.subtabs span.selected { .subtabs span.selected {
background: var(--grey-7); background: var(--grey-3);
color: var(--white); color: var(--ink);
border-radius: 2px; border-radius: 5px;
} }
.subtabs span:not(.selected) { .subtabs span:not(.selected) {
color: var(--grey-7); color: var(--ink);
} }
</style> </style>

1
packages/builder/src/pages/_layout.svelte
View File

@ -36,7 +36,6 @@
<Link icon={DocumentationIcon} title="Documentation" href="/" /> <Link icon={DocumentationIcon} title="Documentation" href="/" />
<Link icon={TutorialsIcon} title="Tutorials" href="/" /> <Link icon={TutorialsIcon} title="Tutorials" href="/" />
<Link icon={CommunityIcon} title="Community" href="/" /> <Link icon={CommunityIcon} title="Community" href="/" />
<Link icon={ContributionIcon} title="Contact" href="/" />
</div> </div>
<div class="nav-section"> <div class="nav-section">

2
packages/builder/src/pages/index.svelte
View File

@ -73,7 +73,7 @@
.welcome { .welcome {
font-size: 42px; font-size: 42px;
color: var(--ink); color: var(--ink);
font-weight: 900; font-weight: 700;
margin: 40px 0px 0px 80px; margin: 40px 0px 0px 80px;
} }