Dashboard Additions
This commit is contained in:
Vendored
+3
@@ -0,0 +1,3 @@
|
||||
.getmdl-select{outline:none}.getmdl-select .mdl-textfield__input{cursor:pointer}.getmdl-select .selected{background-color:#ddd}.getmdl-select .mdl-icon-toggle__label{float:right;margin-top:-30px;color:rgba(0,0,0,0.4);transform:rotate(0);transition:transform 0.3s}.getmdl-select.is-focused .mdl-icon-toggle__label{color:#3f51b5;transform:rotate(180deg)}.getmdl-select .mdl-menu__container{width:100% !important;margin-top:2px}.getmdl-select .mdl-menu__container .mdl-menu{width:100%}.getmdl-select .mdl-menu__container .mdl-menu .mdl-menu__item{font-size:16px}.getmdl-select__fix-height .mdl-menu__container .mdl-menu{overflow-y:auto;max-height:288px !important}.getmdl-select__fix-height .mdl-menu.mdl-menu--top-left{bottom:auto;top:0}
|
||||
|
||||
/*# sourceMappingURL=getmdl-select.min.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"getmdl-select.min.css","sources":["getmdl-select.scss"],"sourcesContent":[".getmdl-select {\r\n outline: none;\r\n .mdl-textfield__input {\r\n cursor: pointer;\r\n }\r\n .selected {\r\n background-color: #ddd;\r\n }\r\n .mdl-icon-toggle__label {\r\n float: right;\r\n margin-top: -30px;\r\n color: rgba(0, 0, 0, 0.4);\r\n transform: rotate(0);\r\n transition: transform 0.3s;\r\n }\r\n &.is-focused {\r\n .mdl-icon-toggle__label {\r\n color: #3f51b5;\r\n transform: rotate(180deg);\r\n }\r\n }\r\n\r\n .mdl-menu__container {\r\n width: 100% !important;\r\n margin-top: 2px;\r\n .mdl-menu {\r\n width: 100%;\r\n .mdl-menu__item {\r\n font-size: 16px;\r\n }\r\n }\r\n }\r\n}\r\n\r\n.getmdl-select__fix-height {\r\n .mdl-menu__container .mdl-menu {\r\n overflow-y: auto;\r\n max-height: 288px !important;\r\n }\r\n .mdl-menu.mdl-menu--top-left {\r\n bottom: auto;\r\n top: 0;\r\n }\r\n}"],"mappings":"AAAA,AAAA,cAAc,AAAC,CACb,OAAO,CAAE,IAAK,CA+Bf,AAhCD,AAEE,cAFY,CAEZ,qBAAqB,AAAC,CACpB,MAAM,CAAE,OAAQ,CACjB,AAJH,AAKE,cALY,CAKZ,SAAS,AAAC,CACR,gBAAgB,CAAE,IAAK,CACxB,AAPH,AAQE,cARY,CAQZ,uBAAuB,AAAC,CACtB,KAAK,CAAE,KAAM,CACb,UAAU,CAAE,KAAM,CAClB,KAAK,CAAE,eAAI,CACX,SAAS,CAAE,SAAM,CACjB,UAAU,CAAE,cAAe,CAC5B,AAdH,AAgBI,cAhBU,AAeX,WAAW,CACV,uBAAuB,AAAC,CACtB,KAAK,CAAE,OAAQ,CACf,SAAS,CAAE,cAAM,CAClB,AAnBL,AAsBE,cAtBY,CAsBZ,oBAAoB,AAAC,CACnB,KAAK,CAAE,eAAgB,CACvB,UAAU,CAAE,GAAI,CAOjB,AA/BH,AAyBI,cAzBU,CAsBZ,oBAAoB,CAGlB,SAAS,AAAC,CACR,KAAK,CAAE,IAAK,CAIb,AA9BL,AA2BM,cA3BQ,CAsBZ,oBAAoB,CAGlB,SAAS,CAEP,eAAe,AAAC,CACd,SAAS,CAAE,IAAK,CACjB,AAKP,AACuB,0BADG,CACxB,oBAAoB,CAAC,SAAS,AAAC,CAC7B,UAAU,CAAE,IAAK,CACjB,UAAU,CAAE,gBAAiB,CAC9B,AAJH,AAKW,0BALe,CAKxB,SAAS,AAAA,mBAAmB,AAAC,CAC3B,MAAM,CAAE,IAAK,CACb,GAAG,CAAE,CAAE,CACR","names":[]}
|
||||
Vendored
+2
@@ -0,0 +1,2 @@
|
||||
"use strict";!function(){function e(){getmdlSelect.init(".getmdl-select")}window.addEventListener?window.addEventListener("load",e,!1):window.attachEvent&&window.attachEvent("onload",e)}();var getmdlSelect={_defaultValue:{width:300},_addEventListeners:function(e){var t=e.querySelector("input"),n=e.querySelector('input[type="hidden"]'),l=e.querySelectorAll("li"),a=e.querySelector(".mdl-js-menu"),o=e.querySelector(".mdl-icon-toggle__label"),i="",c="",s="",u=!1,d=function(o){var i=o.textContent.trim();if(t.value=i,l.forEach(function(e){e.classList.remove("selected")}),o.classList.add("selected"),e.MaterialTextfield.change(i),setTimeout(function(){e.MaterialTextfield.updateClasses_()},250),n.value=o.dataset.val||"",c=t.value,s=n.value,"createEvent"in document){var u=document.createEvent("HTMLEvents");u.initEvent("change",!1,!0),a.MaterialMenu.hide(),t.dispatchEvent(u)}else t.fireEvent("onchange")},r=function(){u=!1,t.value=c,n.value=s,e.querySelector(".mdl-menu__container").classList.contains("is-visible")||e.classList.remove("is-focused");var l=document.querySelectorAll(".getmdl-select .mdl-js-menu");[].forEach.call(l,function(e){e.MaterialMenu.hide()});var o=new Event("closeSelect");a.dispatchEvent(o)};document.body.addEventListener("click",r,!1),e.onkeydown=function(l){9==l.keyCode&&(t.value=c,n.value=s,a.MaterialMenu.hide(),e.classList.remove("is-focused"))},t.onfocus=function(e){a.MaterialMenu.show(),a.focus(),u=!0},t.onblur=function(e){e.stopPropagation()},t.onclick=function(t){t.stopPropagation(),a.classList.contains("is-visible")?(a.MaterialMenu.hide(),u=!1):(a.MaterialMenu.show(),r(),e.classList.add("is-focused"),u=!0)},t.onkeydown=function(l){27==l.keyCode&&(t.value=c,n.value=s,a.MaterialMenu.hide(),e.MaterialTextfield.onBlur_(),""!==i&&(e.querySelector(".mdl-textfield__label").textContent=i,i=""))},a.addEventListener("closeSelect",function(l){t.value=c,n.value=s,e.classList.remove("is-focused"),""!==i&&(e.querySelector(".mdl-textfield__label").textContent=i,i="")}),a.onkeydown=function(l){27==l.keyCode&&(t.value=c,n.value=s,e.classList.remove("is-focused"),""!==i&&(e.querySelector(".mdl-textfield__label").textContent=i,i=""))},o&&(o.onclick=function(l){l.stopPropagation(),u?(a.MaterialMenu.hide(),u=!1,e.classList.remove("is-focused"),e.MaterialTextfield.onBlur_(),t.value=c,n.value=s):(r(),e.MaterialTextfield.onFocus_(),t.focus(),a.MaterialMenu.show(),u=!0)}),[].forEach.call(l,function(n){n.onfocus=function(){e.classList.add("is-focused");var l=n.textContent.trim();t.value=l,e.classList.contains("mdl-textfield--floating-label")||""!=i||(i=e.querySelector(".mdl-textfield__label").textContent.trim(),e.querySelector(".mdl-textfield__label").textContent="")},n.onclick=function(){d(n)},n.dataset.selected&&d(n)})},init:function(e){var t=document.querySelectorAll(e);[].forEach.call(t,function(e){getmdlSelect._addEventListeners(e),componentHandler.upgradeElement(e),componentHandler.upgradeElement(e.querySelector("ul"))})}};
|
||||
//# sourceMappingURL=getmdl-select.min.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["src\\js\\getmdl-select.js"],"names":["whenLoaded","getmdlSelect","init","window","addEventListener","attachEvent","_defaultValue","width","_addEventListeners","dropdown","input","querySelector","hiddenInput","list","querySelectorAll","menu","arrow","label","previousValue","previousDataVal","opened","setSlectedItem","li","value","textContent","trim","forEach","classList","remove","add","MaterialTextfield","change","setTimeout","updateClasses_","dataset","val","document","evt","createEvent","initEvent","hide","dispatchEvent","fireEvent","hideAllMenus","contains","menus","call","event","Event","body","onkeydown","keyCode","onfocus","e","show","focus","onblur","stopPropagation","onclick","onBlur_","onFocus_","selected","selector","dropdowns","componentHandler","upgradeElement"],"mappings":"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","file":"getmdl-select.min.js","sourceRoot":"E:\\html5\\GitHub\\getmdl-select"}
|
||||
+78
-17
@@ -51,6 +51,8 @@
|
||||
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.cyan-light_blue.min.css">
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="getmdl-select.min.css">
|
||||
<script defer src="getmdl-select.min.js"></script>
|
||||
|
||||
<style>
|
||||
#view-source {
|
||||
@@ -94,7 +96,7 @@
|
||||
<nav class="demo-navigation mdl-navigation mdl-color--blue-grey-800">
|
||||
<a class="mdl-navigation__link" href="javascript:displayProjects('all')"><i
|
||||
class="mdl-color-text--blue-grey-400 material-icons" role="presentation">home</i>Home</a>
|
||||
<a class="mdl-navigation__link" href="javascript:displayProjects('active')"><i
|
||||
<a class="mdl-navigation__link" href="javascript:openProjects()"><i
|
||||
class="mdl-color-text--blue-grey-400 material-icons" role="presentation">grid_view</i>Projects</a>
|
||||
<a class="mdl-navigation__link" href="javascript:displayProjects('inactive')"><i
|
||||
class="mdl-color-text--blue-grey-400 material-icons" role="presentation">rss_feed</i>Blog Posts</a>
|
||||
@@ -111,30 +113,89 @@
|
||||
</nav>
|
||||
</div>
|
||||
<main class="mdl-layout__content mdl-color--grey-100">
|
||||
<div id="projects_tab">
|
||||
<div id="projects_tab" style="display: none;">
|
||||
<div class="square-left" id="projects">
|
||||
|
||||
</div>
|
||||
<div class="square-right">
|
||||
<h1>Title</h1>
|
||||
<form action="#">
|
||||
<div class="mdl-textfield mdl-js-textfield">
|
||||
<input class="mdl-textfield__input" type="text" id="sample1">
|
||||
<label class="mdl-textfield__label" for="sample1">Link </label>
|
||||
|
||||
<!-- Floating Multiline Textfield -->
|
||||
<form action="#">
|
||||
<div class="mdl-textfield mdl-js-textfield">
|
||||
<textarea class="mdl-textfield__input" type="text" rows="3" id="sample5"></textarea>
|
||||
<label class="mdl-textfield__label" for="sample5">Description</label>
|
||||
</div>
|
||||
</form>
|
||||
<div id="edit-project-box" style="display: none;">
|
||||
<h1 id="edit-project-title">Title</h1>
|
||||
<form action="#">
|
||||
<div class="mdl-textfield mdl-js-textfield">
|
||||
<input class="mdl-textfield__input" type="text" id="edit-project-link">
|
||||
<label class="mdl-textfield__label" for="sample1">Link </label>
|
||||
</div>
|
||||
</form>
|
||||
<div
|
||||
class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label getmdl-select getmdl-select__fix-height">
|
||||
<input type="text" value="" class="mdl-textfield__input" id="edit-project-status" readonly>
|
||||
<input type="hidden" value="" name="edit-project-status" id="edit-project-status-value">
|
||||
<i class="mdl-icon-toggle__label material-icons">keyboard_arrow_down</i>
|
||||
<label for="edit-project-status" class="mdl-textfield__label">Status</label>
|
||||
<ul for="edit-project-status" class="mdl-menu mdl-menu--bottom-left mdl-js-menu">
|
||||
<li class="mdl-menu__item" data-val="active" id="project_edit_active" data-selected="true">Active</li>
|
||||
<li class="mdl-menu__item" data-val="inactive" id="project_edit_inactive">Inactive</li>
|
||||
<li class="mdl-menu__item" data-val="canceled" id="project_edit_canceled">Canceled</li>
|
||||
</ul>
|
||||
</div>
|
||||
</form>
|
||||
<!-- Floating Multiline Textfield -->
|
||||
<h4>Description</h4>
|
||||
<form action="#">
|
||||
<div class="mdl-textfield mdl-js-textfield" id="textfield_input">
|
||||
<textarea class="mdl-textfield__input" type="text" rows="5" id="edit-project-description"
|
||||
style="width: 75%;"></textarea>
|
||||
<label class="mdl-textfield__label" for="edit-project-description" style="width: 75%;"></label>
|
||||
</div>
|
||||
</form>
|
||||
<button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" id="save_button"
|
||||
onclick="saveProject()">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
<div id="new-project-box" style="display: none;">
|
||||
<h2>New Project</h2>
|
||||
<div class="mdl-textfield mdl-js-textfield">
|
||||
<input class="mdl-textfield__input" type="text" id="new-project-title">
|
||||
<label class="mdl-textfield__label" for="new-project-title">Title</label>
|
||||
</div><br>
|
||||
<div class="mdl-textfield mdl-js-textfield">
|
||||
<input class="mdl-textfield__input" type="text" id="new-project-link">
|
||||
<label class="mdl-textfield__label" for="sample1">Link </label>
|
||||
</div><br>
|
||||
<div
|
||||
class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label getmdl-select getmdl-select__fix-height">
|
||||
<input type="text" value="" class="mdl-textfield__input" id="new-project-status" readonly>
|
||||
<input type="hidden" value="" name="new-project-status" id="new-project-status-value">
|
||||
<i class="mdl-icon-toggle__label material-icons">keyboard_arrow_down</i>
|
||||
<label for="new-project-status" class="mdl-textfield__label">Status</label>
|
||||
<ul for="new-project-status" class="mdl-menu mdl-menu--bottom-left mdl-js-menu">
|
||||
<li class="mdl-menu__item" data-val="active" id="project_new_active" data-selected="true">Active</li>
|
||||
<li class="mdl-menu__item" data-val="inactive" id="project_new_inactive">Inactive</li>
|
||||
<li class="mdl-menu__item" data-val="canceled" id="project_new_canceled">Canceled</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Floating Multiline Textfield -->
|
||||
<h4>Description</h4>
|
||||
<div class="mdl-textfield mdl-js-textfield" id="textfield_input">
|
||||
<textarea class="mdl-textfield__input" type="text" rows="5" id="new-project-description"
|
||||
style="width: 75%;"></textarea>
|
||||
<label class="mdl-textfield__label" for="new-project-description" style="width: 75%;"></label>
|
||||
</div>
|
||||
<button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" id="new_button"
|
||||
onclick="newProject()">
|
||||
Create
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect" id="new_button_projects" onclick='openNewProject()'>
|
||||
<i class="material-icons">add</i>
|
||||
</button>
|
||||
<div class="mdl-tooltip mdl-tooltip--top " for="new_button_projects">
|
||||
New Project
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<div id="login_container" style="display: none;">
|
||||
<div class="login-card mdl-card mdl-shadow--2dp">
|
||||
|
||||
+59
-17
@@ -33,9 +33,9 @@ function displayProjects(status) {
|
||||
firebase.database().ref("projects/" + child["key"]).on('value', function (data) {
|
||||
var data1 = data.val();
|
||||
var a = document.createElement("div")
|
||||
var title = "'"+data1["title"]+"'"
|
||||
a.innerHTML = '<div class="project-card mdl-card mdl-shadow--2dp"> <div class="mdl-card__title mdl-card--expand"> <h2 class="mdl-card__title-text">' + data1["title"].replace(/,/g, ".") + '<br>' + data1["status"] + '</h2> </div> <div class="mdl-card__supporting-text">' + data1["description"] + ' </div> <div class="mdl-card__actions mdl-card--border"> <a href="javascript:editProject(' + title + ')" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"> Edit </a> </div> </div>'
|
||||
|
||||
var title = data1["title"]
|
||||
a.innerHTML = "<div class='project-card mdl-card mdl-shadow--2dp'> <div class='mdl-card__title mdl-card--expand'> <h2 class='mdl-card__title-text'>" + data1['title'].replace(/,/g, '.') + "<br>" + data1['status'] + "</h2> </div> <div class='mdl-card__supporting-text'>" + data1['description'] + " </div> <div class='mdl-card__actions mdl-card--border'> <a href=\"javascript:editProject(\'" + title.replace(/'/g, "`") + "\')\" class='mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect'> Edit </a> </div> </div>"
|
||||
|
||||
if (status === "all") {
|
||||
document.getElementById("projects").appendChild(a)
|
||||
} else if (data1["status"] === status) {
|
||||
@@ -46,23 +46,65 @@ function displayProjects(status) {
|
||||
});
|
||||
}
|
||||
|
||||
// Make completly sure user is authenticated.
|
||||
function verify() {
|
||||
firebase.auth().onAuthStateChanged(function (user) {
|
||||
if (user) {
|
||||
readData("users", function (array) {
|
||||
if (array[firebase.auth().currentUser.uid]) {
|
||||
// Do nothing
|
||||
} else {
|
||||
window.location.href = "unauthorized.html"
|
||||
}
|
||||
});
|
||||
} else {
|
||||
window.location.href = "unauthorized.html"
|
||||
}
|
||||
function openProjects() {
|
||||
document.getElementById("projects_tab").style.display = "block"
|
||||
}
|
||||
|
||||
function newProject() {
|
||||
var data = {
|
||||
title: document.getElementById("new-project-title").value.replace(/\./g, ","),
|
||||
link: document.getElementById("new-project-link").value,
|
||||
status: document.getElementById("new-project-status-value").value,
|
||||
description: document.getElementById("new-project-description").value
|
||||
}
|
||||
firebase.database().ref("projects/" + document.getElementById("new-project-title").value.replace(/\./g, ",")).set(data)
|
||||
document.getElementById("new-project-title").value = '';
|
||||
document.getElementById("new-project-link").value = '';
|
||||
document.getElementById("new-project-status-value").value = 'active';
|
||||
document.getElementById("new-project-description").value = '';
|
||||
document.getElementById("new-project-box").style.display = "none"
|
||||
displayProjects("all")
|
||||
}
|
||||
|
||||
function openNewProject() {
|
||||
document.getElementById("new-project-box").style.display = "block"
|
||||
document.getElementById("edit-project-box").style.display = "none"
|
||||
}
|
||||
|
||||
// Edit Selected Project
|
||||
function saveProject() {
|
||||
var title = document.getElementById("edit-project-title").innerHTML.replace(/\./g,",")
|
||||
var data = {
|
||||
title: title,
|
||||
link: document.getElementById("edit-project-link").value,
|
||||
status: document.getElementById("edit-project-status-value").value,
|
||||
description: document.getElementById("edit-project-description").value
|
||||
}
|
||||
firebase.database().ref("projects/" + title).set(data)
|
||||
document.getElementById("edit-project-title").innerHTML = '';
|
||||
document.getElementById("edit-project-link").value = '';
|
||||
// document.getElementById("edit-project-status").value = 'active';
|
||||
document.getElementById("edit-project-description").value = '';
|
||||
document.getElementById("edit-project-box").style.display = "none"
|
||||
displayProjects("all")
|
||||
}
|
||||
|
||||
|
||||
function editProject(name) {
|
||||
var title = name.replace(/`/g, "'")
|
||||
var database = firebase.database().ref("projects/" + title);
|
||||
database.on('value', function(data) {
|
||||
var data1 = data.val()
|
||||
document.getElementById("edit-project-title").innerText = title.replace(/,/g, ".")
|
||||
document.getElementById("edit-project-link").value = data1["link"]
|
||||
document.getElementById("edit-project-status-value").value = data1["status"]
|
||||
document.getElementById("edit-project-description").value = data1["description"]
|
||||
document.getElementById("edit-project-box").style.display = "block"
|
||||
document.getElementById("new-project-box").style.display = "none"
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// Firebase Check Log In Status
|
||||
function checkLogin() {
|
||||
firebase.auth().onAuthStateChanged(function (user) {
|
||||
|
||||
+172
-57
@@ -1,67 +1,182 @@
|
||||
.square-left {
|
||||
|
||||
/* Exact width */
|
||||
@media (width: 360px) {
|
||||
.square-left {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
width: 40%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.square-right {
|
||||
position: absolute;
|
||||
right: 2%;
|
||||
width: 54%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
text-align: center;
|
||||
}
|
||||
#save_button {
|
||||
position: absolute;
|
||||
bottom: 5%;
|
||||
}
|
||||
#textfield_input {
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
left: 25%;
|
||||
}
|
||||
#new_button {
|
||||
position: absolute;
|
||||
bottom: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Minimum width */
|
||||
@media (min-width: 35rem) {
|
||||
.square-left {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
width: 40%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.square-right {
|
||||
position: absolute;
|
||||
right: 2%;
|
||||
width: 54%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#save_button {
|
||||
position: absolute;
|
||||
bottom: 5%;
|
||||
}
|
||||
#textfield_input {
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
left: 25%;
|
||||
}
|
||||
#new_button {
|
||||
position: absolute;
|
||||
bottom: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Maximum width */
|
||||
@media (max-width: 50rem) {
|
||||
.square-left {
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.square-right {
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
|
||||
text-align: center;
|
||||
}
|
||||
#save_button {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
#textfield_input {
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
}
|
||||
#new_button {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
#new_button_projects {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
width: 40%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
overflow: auto;
|
||||
}
|
||||
right: 3%;
|
||||
bottom: 3.5%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.square-right {
|
||||
position: absolute;
|
||||
right: 2%;
|
||||
width: 54%;
|
||||
top: 2%;
|
||||
height: 96%;
|
||||
background-color: white;
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
}
|
||||
#projects_tab {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
;
|
||||
}
|
||||
|
||||
#projects_tab {
|
||||
width: 100%;
|
||||
height: 100%;;
|
||||
}
|
||||
.project-card {
|
||||
width: 90%;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.project-card {
|
||||
width: 90%;
|
||||
margin: 10px;
|
||||
}
|
||||
.login-card {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-card {
|
||||
position: absolute;
|
||||
top: 0; left: 0; bottom: 0; right: 0;
|
||||
margin: auto;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
.unauthorized-card {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.unauthorized-card {
|
||||
position: absolute;
|
||||
top: 0; left: 0; bottom: 0; right: 0;
|
||||
margin: auto;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
#login_container {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#login_container {
|
||||
height: 100%;
|
||||
}
|
||||
#main_content {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#main_content {
|
||||
height: 100%;
|
||||
}
|
||||
#loading {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#loading {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0; left: 0; bottom: 0; right: 0;
|
||||
margin: auto;
|
||||
}
|
||||
.active {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.active {color: green;}
|
||||
.inactive {color: orange;}
|
||||
.canceled {color: red;}
|
||||
.depracated {color: yellow;}
|
||||
.hidden {display: none;}
|
||||
.inactive {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.canceled {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.depracated {
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
+1
-1
@@ -257,7 +257,7 @@ function displayProjects() {
|
||||
if (data1["link"] == "") {
|
||||
a.innerHTML = "<tr><td><div id='titles'>" + data1["title"].replace(/,/g, ".") + "</h4><div class='" + data1["status"] + "'>" + data1["status"] + "</div></td></tr><tr class='spacing'><td>" + data1["description"] + "</td></tr><tr class='separator'></tr>"
|
||||
} else {
|
||||
a.innerHTML = "<tr><td><div id='titles'><a href='" + data1["link"] + "'>" + data1["title"].replace(/,/g, ".") + "</a></h4><div class='" + data1["status"] + "'>" + data1["status"] + "</div></td></tr><tr class='spacing'><td>" + data1["description"] + "</td></tr><tr class='separator'></tr>"
|
||||
a.innerHTML = '<tr><td><div id="titles"><a href="' + data1['link'] + '">' + data1['title'].replace(/,/g, '.') + '</a></h4><div class="' + data1['status'] + '">' + data1['status'] + '</div></td></tr><tr class="spacing"><td>' + data1['description'] + '</td></tr><tr class="separator"></tr>'
|
||||
}
|
||||
if (data1["status"] != "canceled") {
|
||||
document.getElementById("projects").appendChild(a)
|
||||
|
||||
@@ -12,10 +12,10 @@ function displayProjects(status) {
|
||||
var data1 = data.val();
|
||||
var a = document.createElement("div")
|
||||
if (data1["link"] == "") {
|
||||
a.innerHTML = '<div class="project-card mdl-card mdl-shadow--2dp"> <div class="mdl-card__title mdl-card--expand"> <h2 class="mdl-card__title-text">' + data1["title"].replace(/,/g, ".") + '<br>' + data1["status"] + '</h2> </div> <div class="mdl-card__supporting-text">' + data1["description"] + ' </div> </div>'
|
||||
a.innerHTML = '<div class="project-card mdl-card mdl-shadow--2dp"> <div class="mdl-card__title mdl-card--expand"> <h2 class="mdl-card__title-text">' + data1["title"].replace(/,/g, ".") + '<br><span class="' + data1["status"] + '">'+ data1["status"] +'</span></h2> </div> <div class="mdl-card__supporting-text">' + data1["description"] + ' </div> </div>'
|
||||
//a.innerHTML = "<tr><td><div id='titles'>" + data1["title"].replace(/,/g, ".") + "</h4><div class='" + data1["status"] + "'>" + data1["status"] + "</div></td></tr><tr class='spacing'><td>" + data1["description"] + "</td></tr><tr class='separator'></tr>"
|
||||
} else {
|
||||
a.innerHTML = '<div class="project-card mdl-card mdl-shadow--2dp"> <div class="mdl-card__title mdl-card--expand"> <h2 class="mdl-card__title-text">' + data1["title"].replace(/,/g, ".") + '<br>' + data1["status"] + '</h2> </div> <div class="mdl-card__supporting-text">' + data1["description"] + ' </div> <div class="mdl-card__actions mdl-card--border"> <a href="' + data1["link"] + '" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"> See More </a> </div> </div>'
|
||||
a.innerHTML = '<div class="project-card mdl-card mdl-shadow--2dp"> <div class="mdl-card__title mdl-card--expand"> <h2 class="mdl-card__title-text">' + data1["title"].replace(/,/g, ".") + '<br><div style="clear: both" class="' + data1["status"] + '">'+ data1["status"] +'</div></h2> </div> <div class="mdl-card__supporting-text">' + data1["description"] + ' </div> <div class="mdl-card__actions mdl-card--border"> <a href="' + data1["link"] + '" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"> See More </a> </div> </div>'
|
||||
// a.innerHTML = "<tr><td><div id='titles'><a href='" + data1["link"] + "'>" + data1["title"].replace(/,/g, ".") + "</a></h4><div class='" + data1["status"] + "'>" + data1["status"] + "</div></td></tr><tr class='spacing'><td>" + data1["description"] + "</td></tr><tr class='separator'></tr>"
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user