Browse Source

More styles

master
Gustavo Adolfo Mesa Roldán 5 years ago
parent
commit
4f2a08fc03
8 changed files with 51 additions and 1408 deletions
  1. +0
    -2
      familyark/app/package.json
  2. +0
    -11
      familyark/app/public/css/Treant.css
  3. +43
    -13
      familyark/app/public/css/main.css
  4. +1
    -3
      familyark/app/public/index.html
  5. +0
    -1362
      familyark/app/public/js/Treant.js
  6. +3
    -1
      familyark/app/public/js/buttons.js
  7. +4
    -4
      familyark/app/public/js/chart.js
  8. +0
    -12
      familyark/app/public/js/raphael.js

+ 0
- 2
familyark/app/package.json View File

@ -10,7 +10,6 @@
"dependencies": {
"body-parser": "^1.19.0",
"bootstrap": "^4.4.1",
"chart.js": "^2.9.3",
"compression": "^1.7.4",
"cookie-parser": "^1.4.4",
"datatables": "^1.10.18",
@ -23,6 +22,5 @@
"popper.js": "^1.16.0",
"request": "^2.88.2",
"serve-favicon": "^2.5.0",
"treant-js": "^1.0.1"
}
}

+ 0
- 11
familyark/app/public/css/Treant.css View File

@ -1,11 +0,0 @@
/* required LIB STYLES */
/* .Treant se automatski dodaje na svaki chart conatiner */
.Treant { position: relative; overflow: hidden; padding: 0 !important; }
.Treant > .node,
.Treant > .pseudo { position: absolute; display: block; visibility: hidden; }
.Treant.Treant-loaded .node,
.Treant.Treant-loaded .pseudo { visibility: visible; }
.Treant > .pseudo { width: 0; height: 0; border: none; padding: 0; }
.Treant .collapse-switch { width: 3px; height: 3px; display: block; border: 1px solid black; position: absolute; top: 1px; right: 1px; cursor: pointer; }
.Treant .collapsed .collapse-switch { background-color: #868DEE; }
.Treant > .node img { border: none; float: left; }

+ 43
- 13
familyark/app/public/css/main.css View File

@ -12,6 +12,7 @@ body{
overflow-y:scroll;
color: white;
font-family: ark;
text-shadow: 0px 0px 1px #000;
}
body>div:first-child {
@ -19,12 +20,10 @@ body>div:first-child {
}
#menu{
background: rgba(0, 153, 153, 0.6);
width: 150px;
float: left;
padding-top: 25px;
padding-bottom: 25px;
border: 2px solid rgb(0, 153, 153);
position: fixed;
margin: 15px;
}
@ -35,8 +34,9 @@ body>div:first-child {
font-weight: bold;
}
#menu h4 a span, h1 span, .black{
#menu h4 a span, h1 span, .black, #menu li a:hover, #menu h4 a:hover{
color: black;
text-shadow: 0 0px 4px #FFF, 0 0px 10px #ff0, 0 0px 20px #ff8000, 0 -0px 40px #F00;
}
h2{
@ -44,12 +44,13 @@ h2{
}
#menu li a:hover, #menu h4 a:hover{
cursor: pointer;
color: black;
cursor: pointer;
}
#menu li a:hover span, #menu h4 a:hover span{
#menu li a:hover span, #menu h4 a:hover span, a.black:hover{
color: white;
text-shadow: none;
text-decoration: none;
}
#menu li a{
@ -60,16 +61,20 @@ h2{
text-align: center;
}
#body{
#menu, #body{
background: rgba(0, 0, 0, 0.5);
border: 2px solid rgb(0, 0, 0);
}
#body{
width: calc(100vw - 210px);
min-height: 518px;
margin: 15px;;
padding-left: 25px;
padding-right: 25px;
padding-top: 50px;
padding-bottom: 50px;
border: 2px solid rgb(0, 153, 153);
padding-bottom: 50px;
position: absolute;
right: 0;
}
@ -80,11 +85,11 @@ h2{
table.dataTable tbody tr{
background-color: rgba(0, 153, 153, 0.7) !important;
background-color: rgba(0, 0, 0, 0.9) !important;
}
table.dataTable tbody tr:nth-child(2n){
background-color: rgba(0, 153, 153, 0.5) !important;
background-color: rgba(0, 0, 0, 0.7) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
@ -130,7 +135,7 @@ table.info{
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 153, 153);
background-color: rgba(0, 0, 0);
}
#load img{
@ -139,4 +144,29 @@ table.info{
-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);
}
}
.btn-circle.btn-sm {
width: 30px;
height: 30px;
padding: 6px 0px;
border-radius: 15px;
font-size: 8px;
text-align: center;
}
.btn-circle.btn-md {
width: 50px;
height: 50px;
padding: 7px 10px;
border-radius: 25px;
font-size: 10px;
text-align: center;
}
.btn-circle.btn-xl {
width: 70px;
height: 70px;
padding: 10px 16px;
border-radius: 35px;
font-size: 12px;
text-align: center;
}

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

@ -2,13 +2,11 @@
<head>
<link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css"/>
<link href="/css/Treant.css" rel="stylesheet" type="text/css"/>
<link href="https://cdn.jsdelivr.net/npm/fork-awesome@1.1.7/css/fork-awesome.min.css" rel="stylesheet" integrity="sha256-gsmEoJAws/Kd3CjuOQzLie5Q3yshhvmo7YNtBG7aaEY=" crossorigin="anonymous">
<link href="/css/Chart.min.css" rel="stylesheet" type="text/css"/>
<link href="/css/main.css" rel="stylesheet" type="text/css"/>
<script src="/js/jquery.min.js"></script>
<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/Chart.min.js"></script>
<script src="/js/chart.js"></script>


+ 0
- 1362
familyark/app/public/js/Treant.js
File diff suppressed because it is too large
View File


+ 3
- 1
familyark/app/public/js/buttons.js View File

@ -37,7 +37,9 @@ $('document').ready(function(){
{ 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>';
return '<button class="btn btn-primary btn-sm" onclick="showAnimal(\''+ full[0] +'\')"><i class="fa fa-eye" aria-hidden="true"></i></button>&nbsp;&nbsp;'
+ '<button class="btn btn-info btn-sm" onclick="editAnimal(\''+ full[0] +'\')"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></button>&nbsp;&nbsp;'
+ '<button class="btn btn-danger btn-sm" onclick="removeAnimal(\''+full[0]+'\')"><i class="fa fa-times" aria-hidden="true"></i></button>';
}}
]});
$("#load").fadeOut("fast");


+ 4
- 4
familyark/app/public/js/chart.js View File

@ -10,8 +10,8 @@ function set_chart(data){
label: 'Initial',
stack: 'Stack 0',
borderWidth: 2,
borderColor: "rgb(0, 153, 153, 0.5)",
backgroundColor: 'rgba(0, 153, 153, 0.9)',
borderColor: "rgb(0, 0, 0, 0.5)",
backgroundColor: 'rgba(0, 0, 0, 0.9)',
data: [
data.initial_health ? data.initial_health.$numberDecimal : "",
data.initial_energy ? data.initial_energy.$numberDecimal : "",
@ -23,8 +23,8 @@ function set_chart(data){
label: 'Now',
stack: 'Stack 0',
borderWidth: 2,
borderColor: "rgb(0, 153, 153, 1)",
backgroundColor: 'rgba(0, 153, 153, 0.5)',
borderColor: "rgb(0, 0, 0, 1)",
backgroundColor: 'rgba(0, 0, 0, 0.5)',
data: [
data.health ? data.health.$numberDecimal : "",
data.energy ? data.energy.$numberDecimal : "",


+ 0
- 12
familyark/app/public/js/raphael.js
File diff suppressed because it is too large
View File


Loading…
Cancel
Save