opdavies/rebuilding-acquia
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wip

Browse source
This commit is contained in:
Oliver Davies 2018-12-26 01:21:54 +00:00
parent 864529e950
commit 85b70fd33f
8 changed files with 0 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

54
src/components/Environment/EnvironmentCards.vue Normal file
View file

@ -0,0 +1,54 @@
<template>
<div class="mb-6">
<div class="flex flex-wrap -mx-4 -mb-6">
<div v-for="(environment, key) in environments" class="w-full md:w-1/2 xl:w-1/3 px-4 mb-6" :key="key">
<div class="border border-grey rounded overflow-hidden">
<div class="bg-white">
<div class="border-t-4 border-teal p-3">
<a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">
<h2 class="mb-1">{{ environment.name }}</h2>
</a>
<div class="text-grey-darker mb-2">
<a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">{{ environment.url }}</a>
</div>
<div class="text-grey-darker">{{ environment.label }}</div>
</div>
</div>
<div>
<button type="button" class="flex items-center justify-between text-white pl-1 bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline text-sm w-full text-left">
<svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
<span class="flex-1">Code</span>
<span class="border-l border-grey p-2">
<svg class="h-6 w-6 text-white fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__switch"></use></svg>
</span>
</button>
<button type="button" class="flex items-center justify-between text-white pl-1 bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline text-sm w-full text-left border-t border-grey">
<svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
<span class="flex-1">Databases</span>
<span class="border-l border-grey p-2">
<svg class="h-6 w-6 text-white fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__backup"></use></svg>
</span>
</button>
<button type="button" class="flex items-center text-white bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline px-1 py-3 text-sm w-full text-left border-t border-grey">
<svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
Files
</button>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
environments: Object,
},
}
</script>

71
src/components/Environment/QuickHelp.vue Normal file
View file

@ -0,0 +1,71 @@
<template>
<div class="bg-white border-t-10 border-purple mb-6" :class="[hidden ? 'hidden' : 'block lg:flex']">
<div class="flex-none py-3 pl-3 pr-8 border-b lg:border-r border-grey-lighter">
<div class="flex items-center">
<svg class="h-6 w-6 mr-1 text-purple fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__info"></use></svg>
Quick help
</div>
</div>
<div class="p-4">
<div class="block lg:hidden leading-normal -mb-5">
<div v-for="item in items" :key="item.subject">
<p class="text-sm mb-3 font-bold">{{ item.subject }}</p>
<p class="text-sm mb-5">{{ item.text }}</p>
</div>
</div>
<div class="hidden lg:block">
<div class="w-full lg:w-auto lg:flex mb-6">
<button
v-for="(item, i) in items"
:key="item.subject"
type="button"
class="hover:underline focus:underline mr-6 focus:outline-none"
:class="[ i === selected ? 'text-grey-darkest' : 'text-blue-dark' ]"
@click="selected = i"
>{{ item.subject }}</button>
</div>
<div class="leading-normal">
<p class="text-sm text-grey-darker">
{{ items[selected].text }}
<a href="#0" class="text-blue-dark no-underline hover:underline focus:underline">Learn more</a>
</p>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
hidden: Boolean,
},
data() {
return {
selected: 0,
items: [
{
subject: 'Deploying code',
text: 'Drag a code element from one environment to another environment, which creates a new tag for the HEAD of that branch and then deploys the tag.',
},
{
subject: 'Copying files',
text: 'Drag a file element from one environment to another environment, which writes new files, overwrites existing files, and ignores files already in place.',
},
{
subject: 'Copying database',
text: 'Drag a database element from one environment to another environment, which overwrites the target database(s). Dragging database elements with more than one database displays a dialog box that allows you to select the databases to deploy',
},
{
subject: 'Task Log',
text: 'The Task Log is displayed below your Acquia Cloud environments and contains information on all of the actions taken against your application, including code deployments, configuration updates and environment specific changes.',
},
]
}
}
}
</script>

16
src/components/Environment/ToggleHelp.vue Normal file
View file

@ -0,0 +1,16 @@
<template>
<div class="hidden lg:block">
<button type="button" class="text-blue text-sm font-hairline flex items-center hover:underline focus:underline focus:outline-none" @click="$emit('toggle')">
<svg class="h-5 w-5 mr-1 text-blue-dark fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#actions__info"></use></svg>
{{ hidden ? 'Show quick help' : 'Hide quick help' }}
</button>
</div>
</template>
<script>
export default {
props: {
hidden: Boolean,
},
}
</script>