Changes to page layout in navbar
Also changed 12px fonts to 13px fonts
This commit is contained in:
parent
28abb6f312
commit
b99b5fa7b1
|
@ -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 {
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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);
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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);
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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;
|
||||||
} */
|
} */
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
|
@ -85,6 +85,6 @@
|
||||||
background: none;
|
background: none;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
padding: 12px;
|
padding: 13px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -139,7 +139,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
font-size: 12px;
|
font-size: 13px;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -68,7 +68,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
font-size: 12px;
|
font-size: 13px;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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) {
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
|
|
Loading…
Reference in New Issue