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

style

master
Gustavo Adolfo Mesa Roldán 5 years ago
parent
c30a8d85f7
commit
cb5008f0ab
8 changed files with 67 additions and 36 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +32
    -5
      familyark/app/public/css/main.css
  2. BIN
      familyark/app/public/font/ARK-Regular.ttf
  3. BIN
      familyark/app/public/images/load.gif
  4. +3
    -0
      familyark/app/public/index.html
  5. +10
    -8
      familyark/app/public/js/buttons.js
  6. +6
    -2
      familyark/app/public/js/functions.js
  7. +9
    -6
      familyark/app/public/js/main.js
  8. +7
    -15
      familyark/app/public/templates/about.html

+ 32
- 5
familyark/app/public/css/main.css View File

@ -1,3 +1,8 @@
@font-face {
font-family: ark;
src: url(/font/ARK-Regular.ttf);
}
body{
background-image: url(/images/bg.jpg);
height: 100%;
@ -8,7 +13,7 @@ body{
overflow-y:scroll;
color: white;
text-shadow: 0px 0px 3px rgb(0, 153, 153);
font-family: 'Palanquin Dark', sans-serif;
font-family: ark;
}
#menu{
@ -24,13 +29,17 @@ body{
#menu h4 a, h1{
color: rgb(0, 153, 153);
text-shadow: 0px 0px 3px rgb(0, 0, 0);
text-decoration: underline;
font-family: ark;
font-weight: bold;
text-shadow: 0px 0px 2px rgb(0, 0, 0);
}
h2{
font-family: ark;
}
#menu h4 a:hover{
cursor: pointer;
color: white;
color: rgb(0, 153, 153);
}
#menu li a{
@ -111,4 +120,22 @@ table.info{
#a-mother button, .Female{
background-color: pink;
}
#load{
position: fixed;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 153, 153);
}
#load img{
border-radius: 50%;
border: 1px solid black;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}

BIN
familyark/app/public/font/ARK-Regular.ttf View File


BIN
familyark/app/public/images/load.gif View File

Before After
Width: 200  |  Height: 200  |  Size: 65 KiB

+ 3
- 0
familyark/app/public/index.html View File

@ -25,5 +25,8 @@
</ul>
</nav>
<article id="body"></article>
<div id="load">
<img src="/images/load.gif">
</div>
<body>
</html>

+ 10
- 8
familyark/app/public/js/buttons.js View File

@ -1,8 +1,7 @@
$('document').ready(function(){
$( "#body" ).load( "/templates/home.html" );
// Botones
$("#home").click(function(){
$("#load").fadeIn(0);
$( "#body" ).load( "/templates/home.html" );
$.get("/info", function( data ) {
var text = "<table class=\"info\">"
@ -11,10 +10,12 @@ $('document').ready(function(){
});
text += "</table>"
$( "#info" ).html( text );
$("#load").fadeOut("fast");
});
});
$("#animals").click(function(){
$("#load").fadeIn(0);
$.get( "/animal", function( data ) {
$.get( "/species", function( species_r ) {
var species = {};
@ -22,7 +23,7 @@ $('document').ready(function(){
species[item._id] = item.name
});
$( "#body" ).html("<h1>Yours Dinos</h1><button id='animal-add' class='btn btn-success btn-sm float-right'>+ New Dino</button><br><br><table id='animals-table'></table>");
$( "#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("");
@ -50,10 +51,12 @@ $('document').ready(function(){
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) {
@ -64,17 +67,16 @@ $('document').ready(function(){
responsive: true,
columns: [
{ title: "Name" },
{ title: "Description" },
{ title: "Options", className: "options-table-species", orderable: false,data: null, targets: -1, "mRender": function(data, type, full) {
return '<button class="btn btn-primary btn-sm" onclick="alert(\'En desarollo\')">Show</button>'
}}
{ title: "Description" }
]
});
$("#load").fadeOut("fast");
});
});
$("#about").click(function(){
$( "#body" ).load( "/templates/about.html" );
$("#load").fadeIn(0);
$( "#body" ).load( "/templates/about.html", function(){$("#load").fadeOut("fast");} );
});
});

+ 6
- 2
familyark/app/public/js/functions.js View File

@ -29,6 +29,7 @@ function onSubmitAnimal(form){
};
function editAnimal(id){
$("#load").fadeIn(0);
$( "#body" ).load( "/templates/animal-form.html", function(){
var animal;
$.get( "/animal/"+id, function( data ) {
@ -48,19 +49,21 @@ function editAnimal(id){
}
set_animal_include(animal._id);
paint_male_female(animal.specie, animal._id);
$("#load").fadeOut("slow");
});
});
}
function showAnimal(id){
$( "#body" ).load( "/templates/animal-show.html", function(){
$("#load").fadeIn(0);
$( "#body" ).load( "/templates/animal-show.html", function(){
var text = "<table>";
$.get( "/animal/"+ id, function( data ) {
var animal = data.data,
j = 1;
$.each(animal, function(i, val) {
if(i != "_id" && i != "__v" && i.indexOf("initial") < 0)
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++;
@ -73,6 +76,7 @@ function showAnimal(id){
get_parrents(animal);
get_childrens(animal);
$("#load").fadeOut("slow");
});
});


+ 9
- 6
familyark/app/public/js/main.js View File

@ -1,10 +1,13 @@
$('document').ready(function(){
$.get("/info", function( data ) {
var text = "<table class=\"info\">"
$.each(data, function(i, obj) {
text += "<tr><td>"+i+"</td><td> "+obj+"</td></tr>";
$( "#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 );
});
})

+ 7
- 15
familyark/app/public/templates/about.html View File

@ -1,17 +1,9 @@
<h1>About</h1>
<div id="lipsum">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum mollis venenatis vulputate. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis magna leo, porta vel egestas vitae, aliquam at nunc. Ut non lobortis orci. Donec mi mi, vestibulum dapibus mauris at, sagittis lobortis dui. Proin non diam congue, lobortis ex vel, malesuada velit. Vivamus pulvinar est ut mollis mattis. Ut eget dapibus felis. Etiam tempor blandit dictum. Morbi lobortis diam vitae quam ullamcorper porttitor. Morbi vitae justo nec nisl placerat lobortis in id lorem. In nec volutpat sem. Donec nulla urna, feugiat convallis commodo sed, suscipit non lectus. Curabitur pulvinar nulla quis nulla placerat, id eleifend urna sagittis. Phasellus efficitur nunc non turpis tincidunt aliquet. Sed a nunc arcu.
</p>
<p>
Nullam eget nunc vitae arcu scelerisque luctus. In neque ipsum, gravida sit amet nulla eu, fringilla ornare lacus. Cras justo justo, sodales at metus eget, luctus congue risus. Integer consequat dui ut augue commodo hendrerit. Vivamus sollicitudin pellentesque orci at commodo. Nullam nec felis quis purus porttitor auctor. Ut posuere sem quam, quis finibus elit semper sed. Nulla ut lectus enim. Ut dignissim ante metus, eget rutrum diam dignissim sit amet. Proin purus risus, tristique at massa et, maximus malesuada erat. Integer eget fringilla nunc. Aenean mattis volutpat vehicula. Aenean in nibh eget nulla elementum congue eget ac metus. Curabitur diam nunc, iaculis a aliquam ut, porta at lorem. Praesent convallis tincidunt nibh et vehicula. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
</p>
<p>
Nam imperdiet ultrices mi. Sed volutpat laoreet interdum. Aenean rutrum, urna nec suscipit maximus, nibh lacus lacinia massa, maximus commodo turpis felis ut magna. Aliquam erat volutpat. Pellentesque ultricies aliquam convallis. Sed vel finibus nibh. In congue nisl nec blandit tristique. Etiam eros odio, convallis sit amet quam a, mattis convallis metus.
</p>
<p>
Suspendisse consequat laoreet leo et vehicula. Morbi id tortor id magna sagittis consectetur. Pellentesque ac arcu sit amet odio iaculis rutrum. Praesent nec pulvinar mi. Nulla facilisi. Phasellus at purus euismod, eleifend neque molestie, vehicula eros. Vestibulum lobortis neque libero, vitae bibendum felis consectetur sit amet. Nullam ullamcorper at magna vel sollicitudin. Aenean feugiat ante ac venenatis feugiat. Aliquam sodales dapibus dui. Cras neque ante, dignissim ac porta rutrum, eleifend vel elit. Fusce sollicitudin nulla non dui gravida hendrerit. Aliquam erat volutpat. Vestibulum malesuada ante erat, nec porta tellus condimentum in. Aenean tincidunt ipsum id urna laoreet congue. In sed augue eget purus tempor tempus.
</p>
<p>
Vestibulum quam magna, cursus in dui at, sodales rhoncus lorem. Aliquam egestas tellus hendrerit velit commodo, eget porttitor purus viverra. Nulla facilisi. Etiam vulputate gravida quam id condimentum. Mauris dapibus arcu vitae ornare sollicitudin. Nam eros mauris, semper eget rutrum eget, pretium in dui. Pellentesque id feugiat risus. Donec mattis diam nulla, sed finibus urna hendrerit id. Donec vitae posuere sem, quis rhoncus libero. Vivamus congue, tortor egestas aliquam tempus, tortor sapien accumsan lacus, vel iaculis nunc ligula vitae erat. Pellentesque lacus mauris, tristique id leo id, ultrices eleifend enim. Vestibulum consequat elit id dui suscipit, ac consectetur ligula viverra. In ut tellus ut turpis congue mattis vel sit amet tellus.
</p></div>
<p>
FamilyArk es una aplicacion para gestion de la crianza en Ark - Survival Evolved.
</p>
<p>
Esta mantenida por <a href="https://hatthieves.es">hatthieves.es</a> sin animo de lucro. Y no se da ninguna garantia o soporte de la misma.
</p>
</div>

Write Preview
Loading…
Cancel
Save