g/familyARK
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

more style

Browse Source
This commit is contained in:
Gustavo Adolfo Mesa Roldán
2020-03-30 03:44:12 +02:00
parent cb5008f0ab
commit 223572f952
12 changed files with 87 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
familyark/app/public/css/main.css
+19 -22
View File
@@ -4,7 +4,6 @@
}
body{
background-image: url(/images/bg.jpg);
height: 100%;
background-position: center;
background-repeat: no-repeat;
@@ -12,12 +11,11 @@ body{
background-attachment: fixed;
overflow-y:scroll;
color: white;
text-shadow: 0px 0px 3px rgb(0, 153, 153);
font-family: ark;
}
#menu{
background: rgba(0, 153, 153, 0.5);
background: rgba(0, 153, 153, 0.6);
width: 150px;
float: left;
padding-top: 50px;
@@ -30,27 +28,30 @@ body{
#menu h4 a, h1{
font-family: ark;
font-weight: bold;
text-shadow: 0px 0px 2px rgb(0, 0, 0);
font-weight: bold;
}
#menu h4 a span, h1 span{
color: black;
}
h2{
font-family: ark;
}
#menu h4 a:hover{
#menu li a:hover, #menu h4 a:hover{
cursor: pointer;
color: rgb(0, 153, 153);
color: black;
}
#menu li a:hover span, #menu h4 a:hover span{
color: white;
}
#menu li a{
cursor: pointer;
}
#menu li a:hover{
color: rgb(0, 153, 153);
text-shadow: 0px 0px 3px rgb(0, 0, 0);
}
#menu li h4{
text-align: center;
}
@@ -64,8 +65,8 @@ h2{
padding-right: 25px;
padding-top: 50px;
padding-bottom: 50px;
border: 2px solid rgb(0, 153, 153);
position: absolute;
border: 2px solid rgb(0, 153, 153);
position: absolute;
right: 0;
}
@@ -79,7 +80,7 @@ table.dataTable tbody tr{
}
table.dataTable tbody tr:nth-child(2n){
background-color: rgba(0, 153, 153, 0.5) !important;
background-color: rgba(0, 153, 153, 0.5) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
@@ -97,16 +98,12 @@ label, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_pag
width: 176px;
}
td.options-table{
text-align: center;
td.options-table-species, td.options-table{
text-align: center;
}
.options-table-species{
width: 60px;
}
td.options-table-species{
text-align: center;
width: 60px;
}
table.info{
familyark/app/public/images/bg0.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 551 KiB

familyark/app/public/images/bg1.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 354 KiB

familyark/app/public/images/bg2.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 510 KiB

familyark/app/public/images/bg3.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 388 KiB

familyark/app/public/images/bg4.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 612 KiB

familyark/app/public/index.html
+3 -2
View File
@@ -9,13 +9,14 @@
<script src="/js/jquery.dataTables.min.js"></script>
<script src="/js/raphael.js"></script>
<script src="/js/Treant.js"></script>
<script src="https://rewish.github.io/jquery-bgswitcher/jquery.bgswitcher.js"></script>
<script src="/js/main.js"></script>
<script src="/js/buttons.js"></script>
<script src="/js/functions.js"></script>
<script src="/js/main.js"></script>
</head>
<body>
<nav id="menu" class="text-center">
<h4><a id="home">FamilyARK</a></h4>
<h4><a id="home">Family<span>ARK</span></a></h4>
<ul class="list-unstyled text-center">
<li>&nbsp;</li>
<li><a id="animals">Dinos</a></li>
familyark/app/public/js/buttons.js
+38 -47
View File
@@ -17,61 +17,52 @@ $('document').ready(function(){
$("#animals").click(function(){
$("#load").fadeIn(0);
$.get( "/animal", function( data ) {
$.get( "/species", function( species_r ) {
var species = {};
species_r.data.map(function(item) {
species[item._id] = item.name
$( "#body" ).html("<h1>Yours <span>Dinos</span> <button id='animal-add' class='btn btn-success btn-sm float-right'>+ New Dino</button></h1><table id='animals-table'></table>");
$( "#animal-add").click(function(){
$( "#body" ).load( "/templates/animal-form.html", function (){
set_animal_include("");
});
})
$( "#body" ).html("<h1>Yours Dinos <button id='animal-add' class='btn btn-success btn-sm float-right'>+ New Dino</button></h1><table id='animals-table'></table>");
$( "#animal-add").click(function(){
$( "#body" ).load( "/templates/animal-form.html", function (){
set_animal_include("");
});
})
dataSet = data.data.map(function(item) {
return [item._id, item.name, item.initial_level + " - " + item.level, species[item.specie]];
});
// dataSet = data.data.reduce(function(acc, item, i) {
// if(i == 1) acc = []
// acc.push([item._id, item.name, item.initial_level + " - " + item.level, species[item.specie]]);
// return acc
// });
$('#animals-table').DataTable({
data: dataSet,
responsive: true,
columns: [
{ title: "id", visible: false},
{ title: "Name" },
{ title: "Level" },
{ title: "Specie" },
{ title: "Options", className: "options-table", orderable: false,data: null, targets: -1, "mRender": function(data, type, full) {
return '<button class="btn btn-primary btn-sm" onclick="showAnimal(\''+ full[0] +'\')">Show</button>&nbsp;&nbsp;<button class="btn btn-info btn-sm" onclick="editAnimal(\''+ full[0] +'\')">Edit</button>&nbsp;&nbsp;<button class="btn btn-danger btn-sm" onclick="removeAnimal(\''+full[0]+'\')">Remove</button>';
}}
]});
$("#load").fadeOut("fast");
dataSet = data.data.map(function(item) {
return [item._id, item.name, item.initial_level + " - " + item.level, species[item.specie].name];
});
$('#animals-table').DataTable({
data: dataSet,
responsive: true,
columns: [
{ title: "id", visible: false},
{ title: "Name" },
{ title: "Level" },
{ title: "Specie" },
{ title: "Options", className: "options-table", orderable: false,data: null, targets: -1, "mRender": function(data, type, full) {
return '<button class="btn btn-primary btn-sm" onclick="showAnimal(\''+ full[0] +'\')">Show</button>&nbsp;&nbsp;<button class="btn btn-info btn-sm" onclick="editAnimal(\''+ full[0] +'\')">Edit</button>&nbsp;&nbsp;<button class="btn btn-danger btn-sm" onclick="removeAnimal(\''+full[0]+'\')">Remove</button>';
}}
]});
$("#load").fadeOut("fast");
});
});
$("#species").click(function(){
$("#load").fadeIn(0);
$.get( "/species", function( data ) {
$( "#body" ).html("<h1>All Species</h1><table id='species-table'></table>");
dataSet = data.data.map(function(item) {
return [item.name, item.description];
});
$('#species-table').DataTable({
data: dataSet,
responsive: true,
columns: [
{ title: "Name" },
{ title: "Description" }
]
});
$("#load").fadeOut("fast");
$( "#body" ).html("<h1>All <span>Species</span></h1><table id='species-table'></table>")
dataSet = [];
for(var i in species){
dataSet.push([species[i].name, species[i].description]);
}
$('#species-table').DataTable({
data: dataSet,
responsive: true,
columns: [
{ title: "Name" },
{ title: "Description" }
]
});
$("#load").fadeOut("fast");
});
$("#about").click(function(){
familyark/app/public/js/functions.js
+4 -2
View File
@@ -57,13 +57,15 @@ function editAnimal(id){
function showAnimal(id){
$("#load").fadeIn(0);
$( "#body" ).load( "/templates/animal-show.html", function(){
var text = "<table>";
var text = "<table class=\"dataTable\">";
$.get( "/animal/"+ id, function( data ) {
var animal = data.data,
j = 1;
$.each(animal, function(i, val) {
if(i != "_id" && i != "__v" && i != "father" && i != "mother" && i != "name" && i.indexOf("initial") < 0)
if(i == "specie")
text += "<tr><td>"+i+"</td><td>" + species[val].name + "</td></tr>";
else if(i != "_id" && i != "__v" && i != "father" && i != "mother" && i != "name" && i.indexOf("initial") < 0)
text += "<tr><td>"+i+"</td><td>"+(val ? val.$numberDecimal ? val.$numberDecimal : val : "")+"</td></tr>";
// if(j % 3 == 0) text += "</tr><tr>"
j++;
familyark/app/public/js/main.js
+21 -9
View File
@@ -1,13 +1,25 @@
var species = {};
$('document').ready(function(){
$( "#body" ).load( "/templates/home.html", function(){$("#load").fadeOut("slow");
$.get("/info", function( data ) {
var text = "<table class=\"info\">"
$.each(data, function(i, obj) {
text += "<tr><td>"+i+"</td><td> "+obj+"</td></tr>";
$.get( "/species", function( species_r ) {
species_r.data.map(function(item) {
species[item._id] = item
});
$( "#body" ).load( "/templates/home.html", function(){$("#load").fadeOut("slow");
$.get("/info", function( data ) {
var text = "<table class=\"info\">"
$.each(data, function(i, obj) {
text += "<tr><td>"+i+"</td><td> "+obj+"</td></tr>";
});
text += "</table>"
$( "#info" ).html( text );
$("#load").fadeOut("slow");
});
text += "</table>"
$( "#info" ).html( text );
$("#load").fadeOut("slow");
});
$("body").bgswitcher({
images: ["/images/bg0.jpg", "/images/bg1.jpg", "/images/bg2.jpg", "/images/bg3.jpg", "/images/bg4.jpg"],
loop: true,
duration: 1500
});
});
})
});
familyark/app/public/templates/home.html
+1 -1
View File
@@ -1,4 +1,4 @@
<h1>Welcome to FamilyARK</h1>
<h1>Welcome to Family<span>ARK</span></h1>
<div class="text-center">
<h4>Your app for your dinos.</h4>
<h4>Inventory, breeding and family.</h4>