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

Merge pull request #194 from Budibase/page-layout-nav-redesigned 

Changes to page layout in navbar
This commit is contained in:
Joe 2020-04-02 17:12:52 +01:00 committed by GitHub
parent 79f47da4ef b8788b187f
commit 38cc711718
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 54 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -37,7 +37,7 @@
.budibase__label--medium { .budibase__label--medium {
font-weight: 500; font-weight: 500;
font-size: 12px; font-size: 13px;
opacity: 0.6; opacity: 0.6;
text-transform: uppercase; text-transform: uppercase;
} }
@ -64,7 +64,7 @@
display: flex; display: flex;
align-items: baseline; align-items: baseline;
font-weight: 500; font-weight: 500;
font-size: 12px; font-size: 13px;
} }
.budibase__nav-item.selected { .budibase__nav-item.selected {

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

@ -63,7 +63,7 @@
} }
:global(.refresh-page-button) { :global(.refresh-page-button) {
font-size: 12px; font-size: 13px;
font-weight: 600; font-weight: 600;
border-radius: 5px; border-radius: 5px;
border: none; border: none;

2
packages/builder/src/components/common/Inputs/InputGroup.svelte
View File

@ -30,7 +30,7 @@
input { input {
width: 83px; width: 83px;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
color: #163057; color: #163057;
opacity: 0.7; opacity: 0.7;

2
packages/builder/src/components/database/DatabaseRoot.svelte
View File

@ -94,7 +94,7 @@
.breadcrumb { .breadcrumb {
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: 500; font-weight: 500;
color: var(--secondary60); color: var(--secondary60);
} }

2
packages/builder/src/components/nav/BackendNav.svelte
View File

@ -63,7 +63,7 @@
.hierarchy-title { .hierarchy-title {
align-items: center; align-items: center;
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: bold; font-weight: bold;
opacity: 0.6; opacity: 0.6;
letter-spacing: 1px; letter-spacing: 1px;

4
packages/builder/src/components/nav/DatabasesList.svelte
View File

@ -57,7 +57,7 @@
<style> <style>
.root { .root {
font-size: 12px; font-size: 13px;
color: var(--secondary100); color: var(--secondary100);
position: relative; position: relative;
padding-left: 20px; padding-left: 20px;
@ -85,7 +85,7 @@
padding: 0; padding: 0;
border: none; border: none;
font-family: Roboto; font-family: Roboto;
font-size: 12px; font-size: 13px;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
background: rgba(0, 0, 0, 0); background: rgba(0, 0, 0, 0);

2
packages/builder/src/components/nav/HierarchyRow.svelte
View File

@ -52,7 +52,7 @@
<style> <style>
.hierarchy-item { .hierarchy-item {
font-size: 12px; font-size: 13px;
font-weight: 400; font-weight: 400;
margin-bottom: 10px; margin-bottom: 10px;
} }

2
packages/builder/src/components/nav/SchemaManagementDrawer.svelte
View File

@ -68,7 +68,7 @@
.hierarchy-title { .hierarchy-title {
align-items: center; align-items: center;
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: bold; font-weight: bold;
opacity: 0.6; opacity: 0.6;
letter-spacing: 1px; letter-spacing: 1px;

2
packages/builder/src/components/nav/UsersList.svelte
View File

@ -68,7 +68,7 @@
padding: 0; padding: 0;
border: none; border: none;
font-family: Roboto; font-family: Roboto;
font-size: 0.8rem; font-size: 13px;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
background: rgba(0, 0, 0, 0); background: rgba(0, 0, 0, 0);

4
packages/builder/src/components/userInterface/CodeEditor.svelte
View File

@ -86,14 +86,14 @@
<style> <style>
h3 { h3 {
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
color: #8997ab; color: #8997ab;
margin-bottom: 10px; margin-bottom: 10px;
} }
p { p {
font-size: 12px; font-size: 13px;
color: #333; color: #333;
margin-top: 0; margin-top: 0;
} }

4
packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte
View File

@ -120,11 +120,11 @@
.detail-prop label { .detail-prop label {
word-wrap: break-word; word-wrap: break-word;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
color: #163057; color: #163057;
opacity: 0.6; opacity: 0.6;
padding-top: 12px; padding-top: 13px;
margin-bottom: 0; margin-bottom: 0;
} }

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

@ -258,7 +258,7 @@
.component > .name { .component > .name {
color: #000333; color: #000333;
display: inline-block; display: inline-block;
font-size: 12px; font-size: 13px;
opacity: 0.8; opacity: 0.8;
} }
@ -282,7 +282,7 @@
} }
.preset-menu > span { .preset-menu > span {
font-size: 12px; font-size: 13px;
text-transform: uppercase; text-transform: uppercase;
margin-top: 5px; margin-top: 5px;
} }
@ -308,7 +308,7 @@
background: none; background: none;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
padding: 12px; padding: 13px;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
} */ } */

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

@ -98,12 +98,13 @@
<style> <style>
.root { .root {
font-weight: 400; font-weight: 400;
color: #333; color: #000333;
} }
.title { .title {
margin-left: 10px; margin-left: 10px;
margin-top: 2px; margin-top: 2px;
font-size: 13px;
} }
.icon { .icon {

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

@ -95,6 +95,7 @@
height: 35px; height: 35px;
align-items: center; align-items: center;
font-weight: 400; font-weight: 400;
font-size: 13px;
} }
.item button { .item button {

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

@ -85,6 +85,6 @@
background: none; background: none;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
padding: 12px; padding: 13px;
} }
</style> </style>

2
packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte
View File

@ -160,7 +160,7 @@
a { a {
color: rgba(22, 48, 87, 0.6); color: rgba(22, 48, 87, 0.6);
font-size: 12px; font-size: 13px;
margin-top: 0; margin-top: 0;
} }
</style> </style>

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

@ -88,7 +88,7 @@
<style> <style>
h3 { h3 {
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
color: #8997ab; color: #8997ab;
margin-bottom: 10px; margin-bottom: 10px;

2
packages/builder/src/components/userInterface/EventsEditor/HandlerSelector.svelte
View File

@ -139,7 +139,7 @@
} }
span { span {
font-size: 12px; font-size: 13px;
margin-bottom: 5px; margin-bottom: 5px;
} }
</style> </style>

2
packages/builder/src/components/userInterface/EventsEditor/StateBindingCascader.svelte
View File

@ -68,7 +68,7 @@
} }
span { span {
font-size: 12px; font-size: 13px;
margin-bottom: 5px; margin-bottom: 5px;
} }
</style> </style>

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

@ -131,7 +131,7 @@
<style> <style>
h3 { h3 {
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
color: #000333; color: #000333;
opacity: 0.6; opacity: 0.6;
@ -149,11 +149,11 @@
} }
h5 { h5 {
font-size: 12px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #000333; color: #000333;
opacity: 0.8; opacity: 0.8;
padding-top: 12px; padding-top: 13px;
margin-bottom: 0; margin-bottom: 0;
} }

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

@ -50,7 +50,8 @@
} }
</script> </script>
<div> <div class="pagelayoutSection">
<div class="components-nav-page">Page Layout</div>
<div <div
class="budibase__nav-item root" class="budibase__nav-item root"
class:selected={$store.currentComponentInfo._id === _layout.component.props._id} class:selected={$store.currentComponentInfo._id === _layout.component.props._id}
@ -88,12 +89,27 @@
onOk={() => store.deleteComponent(componentToDelete)} /> onOk={() => store.deleteComponent(componentToDelete)} />
<style> <style>
.components-nav-page {
font-size: 13px;
color: #000333;
text-transform: uppercase;
margin-bottom: 10px;
padding-left: 20px;
font-weight: 600;
opacity: 0.4;
letter-spacing: 1px;
}
.pagelayoutSection {
margin: 20px 0px 20px 0px;
}
.root { .root {
} }
.title { .title {
margin-left: 10px; margin-left: 10px;
margin-top: 2px; font-size: 13px;
} }
.icon { .icon {
@ -101,7 +117,7 @@
transition: 0.2s; transition: 0.2s;
width: 20px; width: 20px;
margin-top: 2px; margin-top: 2px;
color: #333; color: #000333;
} }
.icon:nth-of-type(2) { .icon:nth-of-type(2) {

4
packages/builder/src/components/userInterface/PropControl.svelte
View File

@ -39,11 +39,11 @@
h5 { h5 {
word-wrap: break-word; word-wrap: break-word;
font-size: 12px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #000333; color: #000333;
opacity: 0.8; opacity: 0.8;
padding-top: 12px; padding-top: 13px;
margin-bottom: 0; margin-bottom: 0;
} }
</style> </style>

2
packages/builder/src/components/userInterface/PropertyCascader/StateBindingOptions.svelte
View File

@ -45,7 +45,7 @@
.name { .name {
color: rgba(22, 48, 87, 0.6); color: rgba(22, 48, 87, 0.6);
font-size: 12px; font-size: 13px;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
margin-top: 5px; margin-top: 5px;

4
packages/builder/src/components/userInterface/UserInterfaceRoot.svelte
View File

@ -157,7 +157,7 @@
} }
.components-nav-page { .components-nav-page {
font-size: 12px; font-size: 13px;
color: #000333; color: #000333;
text-transform: uppercase; text-transform: uppercase;
padding-left: 20px; padding-left: 20px;
@ -168,7 +168,7 @@
} }
.components-nav-header { .components-nav-header {
font-size: 12px; font-size: 13px;
color: #000333; color: #000333;
text-transform: uppercase; text-transform: uppercase;
margin-top: 20px; margin-top: 20px;