Merge branch 'master' of github.com:Budibase/budibase
This commit is contained in:
Michael Shanks
commit
1c38beaefd
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
|
|
@ -0,0 +1,31 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 24.1.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#393C44;}
|
||||||
|
.st1{fill:#FFFFFF;}
|
||||||
|
</style>
|
||||||
|
<g>
|
||||||
|
<path class="st0" d="M117.33,128H10.67C4.78,128,0,123.22,0,117.33V10.67C0,4.78,4.78,0,10.67,0h106.67
|
||||||
|
C123.22,0,128,4.78,128,10.67v106.67C128,123.22,123.22,128,117.33,128z"/>
|
||||||
|
<g>
|
||||||
|
<path class="st1" d="M75.94,32v27.84c3.14-3.38,7.07-5.07,11.79-5.07c2.8,0,5.37,0.54,7.7,1.63c2.33,1.09,4.32,2.55,5.97,4.39
|
||||||
|
c1.65,1.84,2.93,4.01,3.87,6.51c0.93,2.5,1.4,5.16,1.4,7.98c0,2.87-0.48,5.57-1.44,8.09c-0.96,2.52-2.3,4.72-4.02,6.58
|
||||||
|
c-1.72,1.87-3.75,3.34-6.08,4.43C92.8,95.46,90.28,96,87.58,96c-4.91,0-8.79-1.84-11.64-5.52v4.31H62.6V32H75.94z M92.74,75.5
|
||||||
|
c0-1.21-0.22-2.36-0.66-3.44c-0.44-1.08-1.06-2.03-1.84-2.84c-0.79-0.81-1.7-1.45-2.73-1.93c-1.03-0.48-2.16-0.72-3.39-0.72
|
||||||
|
c-1.18,0-2.28,0.23-3.32,0.68c-1.03,0.45-1.93,1.09-2.69,1.89c-0.76,0.81-1.38,1.75-1.84,2.84c-0.47,1.09-0.7,2.23-0.7,3.44
|
||||||
|
s0.22,2.34,0.66,3.4c0.44,1.06,1.06,1.98,1.84,2.76c0.79,0.78,1.71,1.41,2.76,1.89c1.06,0.48,2.17,0.72,3.35,0.72
|
||||||
|
c1.18,0,2.28-0.23,3.32-0.68c1.03-0.45,1.93-1.08,2.69-1.89c0.76-0.81,1.37-1.74,1.84-2.8C92.51,77.77,92.74,76.66,92.74,75.5z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path class="st1" d="M34.67,32v27.84c3.14-3.38,7.07-5.07,11.79-5.07c2.8,0,5.37,0.54,7.7,1.63c2.33,1.09,4.32,2.55,5.97,4.39
|
||||||
|
c1.65,1.84,2.93,4.01,3.87,6.51c0.93,2.5,1.4,5.16,1.4,7.98c0,2.87-0.48,5.57-1.44,8.09c-0.96,2.52-2.3,4.72-4.02,6.58
|
||||||
|
c-1.72,1.87-3.75,3.34-6.08,4.43C51.53,95.46,49.01,96,46.31,96c-4.91,0-8.79-1.84-11.64-5.52v4.31H21.33V32H34.67z M51.47,75.5
|
||||||
|
c0-1.21-0.22-2.36-0.66-3.44c-0.44-1.08-1.06-2.03-1.84-2.84c-0.79-0.81-1.7-1.45-2.73-1.93c-1.03-0.48-2.16-0.72-3.39-0.72
|
||||||
|
c-1.18,0-2.28,0.23-3.32,0.68c-1.03,0.45-1.93,1.09-2.69,1.89c-0.76,0.81-1.38,1.75-1.84,2.84c-0.47,1.09-0.7,2.23-0.7,3.44
|
||||||
|
s0.22,2.34,0.66,3.4c0.44,1.06,1.06,1.98,1.84,2.76c0.79,0.78,1.71,1.41,2.76,1.89c1.06,0.48,2.17,0.72,3.35,0.72
|
||||||
|
c1.18,0,2.28-0.23,3.32-0.68c1.03-0.45,1.93-1.08,2.69-1.89c0.76-0.81,1.37-1.74,1.84-2.8C51.24,77.77,51.47,76.66,51.47,75.5z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M7 11.5a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9zm0 10a4.5 4.5 0 1 1 0-9 4.5
|
||||||
|
4.5 0 0 1 0 9zm10-10a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9zm0 10a4.5 4.5 0 1 1
|
||||||
|
0-9 4.5 4.5 0 0 1 0 9z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 370 B |
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M5.07 16A7.06 7.06 0 0 1 5
|
||||||
|
15v-1H3v-2h2v-1c0-.34.024-.673.07-1H3V8h2.674a7.03 7.03 0 0 1
|
||||||
|
2.84-3.072l-1.05-1.05L8.88 2.465l1.683 1.684a7.03 7.03 0 0 1 2.876
|
||||||
|
0l1.683-1.684 1.415 1.415-1.05 1.05A7.03 7.03 0 0 1 18.326
|
||||||
|
8H21v2h-2.07c.046.327.07.66.07 1v1h2v2h-2v1c0 .34-.024.673-.07
|
||||||
|
1H21v2h-2.674a7 7 0 0 1-12.652 0H3v-2h2.07zM9 10v2h6v-2H9zm0 4v2h6v-2H9z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 561 B |
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M12 11a5 5 0 0 1 5 5v6H7v-6a5 5 0 0 1 5-5zm-6.712 3.006a6.983 6.983 0 0
|
||||||
|
0-.28 1.65L5 16v6H2v-4.5a3.5 3.5 0 0 1 3.119-3.48l.17-.014zm13.424 0A3.501
|
||||||
|
3.501 0 0 1 22 17.5V22h-3v-6c0-.693-.1-1.362-.288-1.994zM5.5 8a2.5 2.5 0 1 1
|
||||||
|
0 5 2.5 2.5 0 0 1 0-5zm13 0a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM12 2a4 4 0
|
||||||
|
1 1 0 8 4 4 0 0 1 0-8z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 529 B |
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M14.121 10.48a1 1 0 0 0-1.414 0l-.707.706a2 2 0 1
|
||||||
|
1-2.828-2.828l5.63-5.632a6.5 6.5 0 0 1 6.377 10.568l-2.108
|
||||||
|
2.135-4.95-4.95zM3.161 4.468a6.503 6.503 0 0 1 8.009-.938L7.757 6.944a4 4 0
|
||||||
|
0 0 5.513 5.794l.144-.137 4.243 4.242-4.243 4.243a2 2 0 0 1-2.828 0L3.16
|
||||||
|
13.66a6.5 6.5 0 0 1 0-9.192z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 493 B |
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M20 22H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1
|
||||||
|
1zM8 7v2h8V7H8zm0 4v2h8v-2H8zm0 4v2h5v-2H8z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 309 B |
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M3 3h18a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1
|
||||||
|
1-1zm9.06 8.683L5.648 6.238 4.353 7.762l7.72 6.555
|
||||||
|
7.581-6.56-1.308-1.513-6.285 5.439z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 352 B |
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M7 20.981a6.5 6.5 0 0 1-2.936-12 8.001 8.001 0 0 1 15.872 0 6.5 6.5 0 0
|
||||||
|
1-2.936 12V21H7v-.019zM13 13h3l-4-5-4 5h3v4h2v-4z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 316 B |
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M13 16.938V19h5v2H6v-2h5v-2.062A8.001 8.001 0 0 1 4 9V3h16v6a8.001 8.001
|
||||||
|
0 0 1-7 7.938zM1 5h2v4H1V5zm20 0h2v4h-2V5z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 310 B |
|
|
@ -0,0 +1,16 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M22.162 5.656a8.384 8.384 0 0 1-2.402.658A4.196 4.196 0 0 0 21.6
|
||||||
|
4c-.82.488-1.719.83-2.656 1.015a4.182 4.182 0 0 0-7.126 3.814 11.874 11.874
|
||||||
|
0 0 1-8.62-4.37 4.168 4.168 0 0 0-.566 2.103c0 1.45.738 2.731 1.86
|
||||||
|
3.481a4.168 4.168 0 0 1-1.894-.523v.052a4.185 4.185 0 0 0 3.355 4.101 4.21
|
||||||
|
4.21 0 0 1-1.89.072A4.185 4.185 0 0 0 7.97 16.65a8.394 8.394 0 0 1-6.191
|
||||||
|
1.732 11.83 11.83 0 0 0 6.41 1.88c7.693 0 11.9-6.373 11.9-11.9
|
||||||
|
0-.18-.005-.362-.013-.54a8.496 8.496 0 0 0 2.087-2.165z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 689 B |
|
|
@ -0,0 +1,13 @@
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="24"
|
||||||
|
height="24">
|
||||||
|
<path fill="none" d="M0 0h24v24H0z" />
|
||||||
|
<path
|
||||||
|
d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10
|
||||||
|
10zm4.82-4.924A7 7 0 0 0 9.032 5.658l.975 1.755A5 5 0 0 1 17 12h-3l2.82
|
||||||
|
5.076zm-1.852 1.266l-.975-1.755A5 5 0 0 1 7 12h3L7.18 6.924a7 7 0 0 0 7.788
|
||||||
|
11.418z"
|
||||||
|
fill="rgba(128,129,146,1)" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 428 B |
|
|
@ -19,3 +19,13 @@ export { default as AddIcon } from "./Add.svelte"
|
||||||
export { default as JavaScriptIcon } from "./JavaScript.svelte"
|
export { default as JavaScriptIcon } from "./JavaScript.svelte"
|
||||||
export { default as PreviewIcon } from "./Preview.svelte"
|
export { default as PreviewIcon } from "./Preview.svelte"
|
||||||
export { default as SettingsIcon } from "./Settings.svelte"
|
export { default as SettingsIcon } from "./Settings.svelte"
|
||||||
|
export { default as AppsIcon } from "./Apps.svelte"
|
||||||
|
export { default as UpdatesIcon } from "./Updates.svelte"
|
||||||
|
export { default as HostingIcon } from "./Hosting.svelte"
|
||||||
|
export { default as DocumentationIcon } from "./Documentation.svelte"
|
||||||
|
export { default as TutorialsIcon } from "./Tutorials.svelte"
|
||||||
|
export { default as CommunityIcon } from "./Community.svelte"
|
||||||
|
export { default as ContributionIcon } from "./Contribution.svelte"
|
||||||
|
export { default as BugIcon } from "./Bug.svelte"
|
||||||
|
export { default as EmailIcon } from "./Email.svelte"
|
||||||
|
export { default as TwitterIcon } from "./Twitter.svelte"
|
||||||
|
|
|
||||||
|
|
@ -81,12 +81,10 @@
|
||||||
|
|
||||||
.hierarchy-title {
|
.hierarchy-title {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
text-transform: uppercase;
|
font-size: 18px;
|
||||||
font-size: 13px;
|
font-weight: 700;
|
||||||
font-weight: bold;
|
|
||||||
opacity: 0.6;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hierarchy {
|
.hierarchy {
|
||||||
|
|
|
||||||
|
|
@ -125,12 +125,10 @@
|
||||||
|
|
||||||
.hierarchy-title {
|
.hierarchy-title {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
text-transform: uppercase;
|
font-size: 18px;
|
||||||
font-size: 13px;
|
font-weight: 700;
|
||||||
font-weight: bold;
|
|
||||||
opacity: 0.6;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hierarchy {
|
.hierarchy {
|
||||||
|
|
|
||||||
|
|
@ -1,19 +1,32 @@
|
||||||
<script>
|
<script>
|
||||||
import Button from "components/common/Button.svelte"
|
import Button from "components/common/Button.svelte"
|
||||||
export let apps
|
export let apps
|
||||||
|
|
||||||
|
function myFunction() {
|
||||||
|
var x = new Date(document.lastModified)
|
||||||
|
document.getElementById("demo").innerHTML = x
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="root">
|
<div class="root">
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<img
|
|
||||||
src="/_builder/assets/budibase-logo.png"
|
|
||||||
class="logo"
|
|
||||||
alt="budibase logo" />
|
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<h4 style="margin-bottom: 20px">Choose an Application</h4>
|
<div class="app-section-title">Your Web Apps</div>
|
||||||
{#each apps as app}
|
{#each apps as app}
|
||||||
<a href={`/_builder/${app._id}`} class="app-link">{app.name}</a>
|
<div class="apps-card">
|
||||||
|
<h3 class="app-title">{app.name}</h3>
|
||||||
|
<p class="app-desc">
|
||||||
|
A minimalist CRM which removes the noise and allows you to focus
|
||||||
|
on your business.
|
||||||
|
</p>
|
||||||
|
<div class="card-footer">
|
||||||
|
<div class="modified-date">Last Edited - 25th May 2020</div>
|
||||||
|
<a href={`/_builder/${app._id}`} class="app-button">
|
||||||
|
Open Web App
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -22,31 +35,68 @@
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.root {
|
.root {
|
||||||
position: fixed;
|
margin: 40px 80px;
|
||||||
margin: 0 auto;
|
|
||||||
text-align: center;
|
|
||||||
top: 20%;
|
|
||||||
/*color: #333333;
|
|
||||||
background-color: #fdfdfd;*/
|
|
||||||
width: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner {
|
.app-section-title {
|
||||||
display: inline-block;
|
font-size: 20px;
|
||||||
margin: auto;
|
color: var(--ink);
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.apps {
|
||||||
width: 300px;
|
display: flex;
|
||||||
margin-bottom: 40px;
|
flex-wrap: wrap;
|
||||||
|
gap: 40px;
|
||||||
|
}
|
||||||
|
.apps-card {
|
||||||
|
background-color: var(--white);
|
||||||
|
padding: 20px;
|
||||||
|
max-width: 400px;
|
||||||
|
max-height: 150px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 1px solid var(--grey-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.root :global(.option) {
|
.app-button:hover {
|
||||||
width: 250px;
|
background-color: var(--grey-light);
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-link {
|
.app-title {
|
||||||
margin-top: 10px;
|
font-size: 18px;
|
||||||
display: block;
|
font-weight: 700;
|
||||||
|
color: var(--ink);
|
||||||
|
text-transform: capitalize;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-desc {
|
||||||
|
color: var(--ink-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-footer {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: baseline;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modified-date {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--ink-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-button {
|
||||||
|
background-color: var(--white);
|
||||||
|
color: var(--ink);
|
||||||
|
padding: 12px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 1px var(--grey) solid;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -24,7 +24,7 @@
|
||||||
<button
|
<button
|
||||||
class:selected={selected === COMPONENT_SELECTION_TAB}
|
class:selected={selected === COMPONENT_SELECTION_TAB}
|
||||||
on:click={() => selectTab(COMPONENT_SELECTION_TAB)}>
|
on:click={() => selectTab(COMPONENT_SELECTION_TAB)}>
|
||||||
Components
|
Add
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
|
|
@ -50,37 +50,24 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.root {
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.switcher {
|
.switcher {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
margin: 0px 20px 20px 20px;
|
||||||
margin: 20px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.switcher > button {
|
.switcher > button {
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
border: none;
|
border: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 14px;
|
font-size: 18px;
|
||||||
text-transform: uppercase;
|
font-weight: 700;
|
||||||
background: rgba(0, 0, 0, 0);
|
color: var(--ink-lighter);
|
||||||
font-weight: 500;
|
|
||||||
color: var(--secondary40);
|
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
letter-spacing: 1px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.switcher > .selected {
|
.switcher > .selected {
|
||||||
color: var(--secondary100);
|
color: var(--ink);
|
||||||
font-weight: 600;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,20 @@
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
|
||||||
|
--white: #FFFFFF;
|
||||||
|
|
||||||
|
--blue: #0055ff;
|
||||||
|
--blue-light: #F1F4FC;
|
||||||
|
--blue-dark: #2F4C9B;
|
||||||
|
|
||||||
|
--ink: #393C44;
|
||||||
|
--ink-light: #808192;
|
||||||
|
--ink-lighter: #ADAEC4;
|
||||||
|
|
||||||
|
--grey: #F2F2F2;
|
||||||
|
--grey-light: #FBFBFB;
|
||||||
|
--grey-dark: #E6E6E6;
|
||||||
|
|
||||||
--primary100: #0055ff;
|
--primary100: #0055ff;
|
||||||
--primary80: rgba(0, 85, 255, 0.8);
|
--primary80: rgba(0, 85, 255, 0.8);
|
||||||
--primary60: #rgba(0, 85, 255, 0.6);
|
--primary60: #rgba(0, 85, 255, 0.6);
|
||||||
|
|
@ -9,7 +24,7 @@
|
||||||
--primary5: #rgba(0, 85, 255, 0.05);
|
--primary5: #rgba(0, 85, 255, 0.05);
|
||||||
--primarydark: #0044cc;
|
--primarydark: #0044cc;
|
||||||
|
|
||||||
--secondary100:#000333;
|
--secondary100:#393C44;
|
||||||
--secondary80: rgba(0, 3, 51, 0.8);
|
--secondary80: rgba(0, 3, 51, 0.8);
|
||||||
--secondary60: rgba(0, 3, 51, 0.6);
|
--secondary60: rgba(0, 3, 51, 0.6);
|
||||||
--secondary40: rgba(0, 3, 51, 0.4);
|
--secondary40: rgba(0, 3, 51, 0.4);
|
||||||
|
|
@ -34,7 +49,7 @@
|
||||||
--deletion10: #F2545B1A;
|
--deletion10: #F2545B1A;
|
||||||
--deletiondark: #CF4046;
|
--deletiondark: #CF4046;
|
||||||
|
|
||||||
--white: #FFFFFF;
|
|
||||||
--darkslate: #1a202c;
|
--darkslate: #1a202c;
|
||||||
--slate: #d8d8d8;
|
--slate: #d8d8d8;
|
||||||
--lightslate: #f9f9f9;
|
--lightslate: #f9f9f9;
|
||||||
|
|
@ -95,7 +110,7 @@ h3 {
|
||||||
h4 {
|
h4 {
|
||||||
font-family: var(--fontbold);
|
font-family: var(--fontbold);
|
||||||
font-size: 18pt;
|
font-size: 18pt;
|
||||||
color: var(--secondary100);
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
h5 {
|
h5 {
|
||||||
|
|
|
||||||
|
|
@ -31,8 +31,9 @@
|
||||||
<div class="topleftnav">
|
<div class="topleftnav">
|
||||||
<button class="home-logo">
|
<button class="home-logo">
|
||||||
<img
|
<img
|
||||||
src="/_builder/assets/budibase-emblem-white.svg"
|
src="/_builder/assets/bb-logo.svg"
|
||||||
alt="budibase icon" />
|
alt="budibase icon"
|
||||||
|
on:click={() => $goto(`/`)} />
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<!-- This gets all indexable subroutes and sticks them in the top nav. -->
|
<!-- This gets all indexable subroutes and sticks them in the top nav. -->
|
||||||
|
|
@ -85,13 +86,14 @@
|
||||||
|
|
||||||
.top-nav {
|
.top-nav {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
height: 48px;
|
height: 60px;
|
||||||
background: #0d203b;
|
background: #fff;
|
||||||
padding: 0px 20px 0 20px;
|
padding: 0px 20px 0 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
border-bottom: 1px solid var(--grey);
|
||||||
}
|
}
|
||||||
|
|
||||||
.content > div {
|
.content > div {
|
||||||
|
|
@ -110,8 +112,8 @@
|
||||||
|
|
||||||
.topnavitem {
|
.topnavitem {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: rgb(255, 255, 255, 0.6);
|
color: var(--ink-lighter);
|
||||||
margin: 0px 10px;
|
margin: 0px 00px 0px 20px;
|
||||||
padding-top: 4px;
|
padding-top: 4px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
@ -121,19 +123,19 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnavitem:hover {
|
.topnavitem:hover {
|
||||||
color: rgb(255, 255, 255, 0.8);
|
color: var(--ink-light);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.active {
|
.active {
|
||||||
color: white;
|
color: var(--ink);
|
||||||
font-weight: 600;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnavitemright {
|
.topnavitemright {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: rgb(255, 255, 255, 0.6);
|
color: var(--ink-light);
|
||||||
margin: 0px 5px;
|
margin: 0px 20px 0px 0px;
|
||||||
padding-top: 4px;
|
padding-top: 4px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
@ -155,7 +157,8 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
outline: none;
|
outline: none;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
padding: 8px 10px 8px 0;
|
padding: 0px 10px 8px 0;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.home-logo:hover {
|
.home-logo:hover {
|
||||||
|
|
@ -167,7 +170,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.home-logo img {
|
.home-logo img {
|
||||||
height: 100%;
|
height: 40px;
|
||||||
}
|
}
|
||||||
span:first-letter {
|
span:first-letter {
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
|
|
|
||||||
|
|
@ -37,4 +37,13 @@
|
||||||
width: 275px;
|
width: 275px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 1800px) {
|
||||||
|
.nav {
|
||||||
|
overflow: auto;
|
||||||
|
flex: 0 1 auto;
|
||||||
|
width: 300px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -54,9 +54,7 @@
|
||||||
|
|
||||||
<div class="pages-list-container">
|
<div class="pages-list-container">
|
||||||
<div class="nav-header">
|
<div class="nav-header">
|
||||||
<span class="navigator-title">Navigator</span>
|
<span class="navigator-title">Navigate</span>
|
||||||
<div class="border-line" />
|
|
||||||
|
|
||||||
<span class="components-nav-page">Pages</span>
|
<span class="components-nav-page">Pages</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -131,7 +129,7 @@
|
||||||
grid-template-columns: 275px 1fr 275px;
|
grid-template-columns: 275px 1fr 275px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #fafafa;
|
background: var(--grey-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (min-width: 1800px) {
|
@media only screen and (min-width: 1800px) {
|
||||||
|
|
@ -140,7 +138,7 @@
|
||||||
grid-template-columns: 300px 1fr 300px;
|
grid-template-columns: 300px 1fr 300px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #fafafa;
|
background: var(--grey-light);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -159,7 +157,6 @@
|
||||||
margin: 40px;
|
margin: 40px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
box-shadow: 0 0px 6px rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.components-pane {
|
.components-pane {
|
||||||
|
|
@ -171,8 +168,7 @@
|
||||||
|
|
||||||
.components-nav-page {
|
.components-nav-page {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: #000333;
|
color: var(--ink);
|
||||||
text-transform: uppercase;
|
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|
@ -182,8 +178,7 @@
|
||||||
|
|
||||||
.components-nav-header {
|
.components-nav-header {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: #000333;
|
color: var(--ink);
|
||||||
text-transform: uppercase;
|
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
|
|
@ -235,13 +230,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.navigator-title {
|
.navigator-title {
|
||||||
font-size: 14px;
|
font-size: 18px;
|
||||||
color: var(--secondary100);
|
color: var(--ink);
|
||||||
font-weight: 600;
|
font-weight: bold;
|
||||||
text-transform: uppercase;
|
|
||||||
padding: 0 20px 20px 20px;
|
padding: 0 20px 20px 20px;
|
||||||
line-height: 1rem !important;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.border-line {
|
.border-line {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,21 @@
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import AppList from "components/start/AppList.svelte"
|
import AppList from "components/start/AppList.svelte"
|
||||||
import { onMount } from "svelte"
|
import { onMount } from "svelte"
|
||||||
|
import ActionButton from "components/common/ActionButton.svelte"
|
||||||
import IconButton from "components/common/IconButton.svelte"
|
import IconButton from "components/common/IconButton.svelte"
|
||||||
|
import {
|
||||||
|
SettingsIcon,
|
||||||
|
AppsIcon,
|
||||||
|
UpdatesIcon,
|
||||||
|
HostingIcon,
|
||||||
|
DocumentationIcon,
|
||||||
|
TutorialsIcon,
|
||||||
|
CommunityIcon,
|
||||||
|
ContributionIcon,
|
||||||
|
BugIcon,
|
||||||
|
EmailIcon,
|
||||||
|
TwitterIcon,
|
||||||
|
} from "components/common/Icons/"
|
||||||
import Spinner from "components/common/Spinner.svelte"
|
import Spinner from "components/common/Spinner.svelte"
|
||||||
|
|
||||||
let promise = getApps()
|
let promise = getApps()
|
||||||
|
|
@ -19,23 +33,275 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<main>
|
<div class="root">
|
||||||
{#await promise}
|
<div class="ui-nav">
|
||||||
<div class="spinner-container">
|
<div class="home-logo">
|
||||||
<Spinner />
|
<img src="/_builder/assets/bb-logo.svg" alt="Budibase icon" />
|
||||||
</div>
|
</div>
|
||||||
{:then result}
|
|
||||||
<AppList apps={result} />
|
<div class="nav-section">
|
||||||
{:catch err}
|
<div class="nav-section-title">Build</div>
|
||||||
<h1 style="color:red">{err}</h1>
|
<div class="nav-item-home">
|
||||||
{/await}
|
<span class="nav-item-icon">
|
||||||
</main>
|
<AppsIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Apps</div>
|
||||||
|
</div>
|
||||||
|
<div class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<SettingsIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Settings</div>
|
||||||
|
</div>
|
||||||
|
<a href="https://budibase.con/login" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<UpdatesIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Updates</div>
|
||||||
|
</a>
|
||||||
|
<a href="https://budibase.con/login" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<HostingIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Hosting</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="nav-section">
|
||||||
|
<div class="nav-section-title">Learn</div>
|
||||||
|
<a href="https://docs.budibase.com/" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<DocumentationIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Documentation</div>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://docs.budibase.com/tutorial/quick-start"
|
||||||
|
target="_blank"
|
||||||
|
class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<TutorialsIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Tutorials</div>
|
||||||
|
</a>
|
||||||
|
<a href="https://forum.budibase.com/" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<CommunityIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Community</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="nav-section">
|
||||||
|
<div class="nav-section-title">Contact</div>
|
||||||
|
<a
|
||||||
|
href="https://github.com/Budibase/budibase/blob/master/CONTRIBUTING.md"
|
||||||
|
target="_blank"
|
||||||
|
class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<ContributionIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Contribute to our product</div>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://github.com/Budibase/budibase/issues"
|
||||||
|
target="_blank"
|
||||||
|
class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<BugIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Report bug</div>
|
||||||
|
</a>
|
||||||
|
<a href="mailto:support@budibase.com" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<EmailIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Email</div>
|
||||||
|
</a>
|
||||||
|
<a href="https://twitter.com/budibase" target="_blank" class="nav-item">
|
||||||
|
<span class="nav-item-icon">
|
||||||
|
<TwitterIcon />
|
||||||
|
</span>
|
||||||
|
<div class="nav-item-title">Twitter</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="main">
|
||||||
|
<div class="welcome">Welcome to Budibase</div>
|
||||||
|
<div class="banner">
|
||||||
|
<div class="banner-content">
|
||||||
|
<div class="banner-header">
|
||||||
|
Every accomplishment starts with a decision to try.
|
||||||
|
</div>
|
||||||
|
<button class="banner-button" type="button">
|
||||||
|
<i class="ri-add-circle-fill" />
|
||||||
|
Create New Web App
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="banner-image">
|
||||||
|
<img src="/_builder/assets/banner-image.png" alt="Bannerimage" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{#await promise}
|
||||||
|
<div class="spinner-container">
|
||||||
|
<Spinner />
|
||||||
|
</div>
|
||||||
|
{:then result}
|
||||||
|
<AppList apps={result} />
|
||||||
|
{:catch err}
|
||||||
|
<h1 style="color:red">{err}</h1>
|
||||||
|
{/await}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
main {
|
.root {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 275px 1fr;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-family: "Roboto", Helvetica, Arial, sans-serif;
|
background: var(--grey-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 1800px) {
|
||||||
|
.root {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 300px 1fr;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: var(--grey-light);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
grid-column: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui-nav {
|
||||||
|
grid-column: 1;
|
||||||
|
background-color: var(--white);
|
||||||
|
padding: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
border-right: 1px solid var(--grey-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-logo {
|
||||||
|
cursor: pointer;
|
||||||
|
height: 40px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-logo img {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-section {
|
||||||
|
margin: 20px 0px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-section-title {
|
||||||
|
font-size: 20px;
|
||||||
|
color: var(--ink);
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
cursor: pointer;
|
||||||
|
margin: 0px 0px 4px 0px;
|
||||||
|
padding: 0px 0px 0px 12px;
|
||||||
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item-home {
|
||||||
|
cursor: pointer;
|
||||||
|
margin: 0px 0px 4px 0px;
|
||||||
|
padding: 0px 0px 0px 12px;
|
||||||
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: var(--blue-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item:hover {
|
||||||
|
background-color: var(--grey-light);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item::selection {
|
||||||
|
background-color: var(--blue-light);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item-title {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--ink);
|
||||||
|
font-weight: 500;
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item-icon {
|
||||||
|
color: var(--ink-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.welcome {
|
||||||
|
margin: 60px 80px 0px 80px;
|
||||||
|
font-size: 42px;
|
||||||
|
color: var(--ink);
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
margin: 20px 80px 40px 80px;
|
||||||
|
background-image: linear-gradient(-45deg, #7f9ceb, #1d2f77);
|
||||||
|
border-radius: 10px;
|
||||||
|
max-height: 280px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-content {
|
||||||
|
padding: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 1800px) {
|
||||||
|
.banner-content {
|
||||||
|
padding: 80px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-header {
|
||||||
|
font-size: 24px;
|
||||||
|
color: var(--white);
|
||||||
|
font-weight: 500;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 1800px) {
|
||||||
|
.banner-header {
|
||||||
|
font-size: 36px;
|
||||||
|
color: var(--white);
|
||||||
|
font-weight: 500;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-image {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-image img {
|
||||||
|
max-height: 400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner-container {
|
.spinner-container {
|
||||||
|
|
@ -45,4 +311,28 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.banner-button {
|
||||||
|
background-color: var(--white);
|
||||||
|
color: var(--ink);
|
||||||
|
padding: 12px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 0px transparent solid;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 400;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
box-sizing: border-box;
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ri-add-circle-fill {
|
||||||
|
margin-right: 4px;
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-button:hover {
|
||||||
|
background-color: var(--grey);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
|
|
@ -0,0 +1,31 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 24.1.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#393C44;}
|
||||||
|
.st1{fill:#FFFFFF;}
|
||||||
|
</style>
|
||||||
|
<g>
|
||||||
|
<path class="st0" d="M117.33,128H10.67C4.78,128,0,123.22,0,117.33V10.67C0,4.78,4.78,0,10.67,0h106.67
|
||||||
|
C123.22,0,128,4.78,128,10.67v106.67C128,123.22,123.22,128,117.33,128z"/>
|
||||||
|
<g>
|
||||||
|
<path class="st1" d="M75.94,32v27.84c3.14-3.38,7.07-5.07,11.79-5.07c2.8,0,5.37,0.54,7.7,1.63c2.33,1.09,4.32,2.55,5.97,4.39
|
||||||
|
c1.65,1.84,2.93,4.01,3.87,6.51c0.93,2.5,1.4,5.16,1.4,7.98c0,2.87-0.48,5.57-1.44,8.09c-0.96,2.52-2.3,4.72-4.02,6.58
|
||||||
|
c-1.72,1.87-3.75,3.34-6.08,4.43C92.8,95.46,90.28,96,87.58,96c-4.91,0-8.79-1.84-11.64-5.52v4.31H62.6V32H75.94z M92.74,75.5
|
||||||
|
c0-1.21-0.22-2.36-0.66-3.44c-0.44-1.08-1.06-2.03-1.84-2.84c-0.79-0.81-1.7-1.45-2.73-1.93c-1.03-0.48-2.16-0.72-3.39-0.72
|
||||||
|
c-1.18,0-2.28,0.23-3.32,0.68c-1.03,0.45-1.93,1.09-2.69,1.89c-0.76,0.81-1.38,1.75-1.84,2.84c-0.47,1.09-0.7,2.23-0.7,3.44
|
||||||
|
s0.22,2.34,0.66,3.4c0.44,1.06,1.06,1.98,1.84,2.76c0.79,0.78,1.71,1.41,2.76,1.89c1.06,0.48,2.17,0.72,3.35,0.72
|
||||||
|
c1.18,0,2.28-0.23,3.32-0.68c1.03-0.45,1.93-1.08,2.69-1.89c0.76-0.81,1.37-1.74,1.84-2.8C92.51,77.77,92.74,76.66,92.74,75.5z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path class="st1" d="M34.67,32v27.84c3.14-3.38,7.07-5.07,11.79-5.07c2.8,0,5.37,0.54,7.7,1.63c2.33,1.09,4.32,2.55,5.97,4.39
|
||||||
|
c1.65,1.84,2.93,4.01,3.87,6.51c0.93,2.5,1.4,5.16,1.4,7.98c0,2.87-0.48,5.57-1.44,8.09c-0.96,2.52-2.3,4.72-4.02,6.58
|
||||||
|
c-1.72,1.87-3.75,3.34-6.08,4.43C51.53,95.46,49.01,96,46.31,96c-4.91,0-8.79-1.84-11.64-5.52v4.31H21.33V32H34.67z M51.47,75.5
|
||||||
|
c0-1.21-0.22-2.36-0.66-3.44c-0.44-1.08-1.06-2.03-1.84-2.84c-0.79-0.81-1.7-1.45-2.73-1.93c-1.03-0.48-2.16-0.72-3.39-0.72
|
||||||
|
c-1.18,0-2.28,0.23-3.32,0.68c-1.03,0.45-1.93,1.09-2.69,1.89c-0.76,0.81-1.38,1.75-1.84,2.84c-0.47,1.09-0.7,2.23-0.7,3.44
|
||||||
|
s0.22,2.34,0.66,3.4c0.44,1.06,1.06,1.98,1.84,2.76c0.79,0.78,1.71,1.41,2.76,1.89c1.06,0.48,2.17,0.72,3.35,0.72
|
||||||
|
c1.18,0,2.28-0.23,3.32-0.68c1.03-0.45,1.93-1.08,2.69-1.89c0.76-0.81,1.37-1.74,1.84-2.8C51.24,77.77,51.47,76.66,51.47,75.5z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 241 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 381 KiB |
Loading…
Reference in New Issue