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

More styles

Browse Source
This commit is contained in:
Gustavo Adolfo Mesa Roldán
2020-03-30 18:28:18 +02:00
parent b3e7a5743f
commit 4f2a08fc03
8 changed files with 51 additions and 1408 deletions
Download Patch File Download Diff File Expand all files Collapse all files
familyark/app/package.json
-2
View File
@@ -10,7 +10,6 @@
"dependencies": { "dependencies": {
"body-parser": "^1.19.0", "body-parser": "^1.19.0",
"bootstrap": "^4.4.1", "bootstrap": "^4.4.1",
"chart.js": "^2.9.3",
"compression": "^1.7.4", "compression": "^1.7.4",
"cookie-parser": "^1.4.4", "cookie-parser": "^1.4.4",
"datatables": "^1.10.18", "datatables": "^1.10.18",
@@ -23,6 +22,5 @@
"popper.js": "^1.16.0", "popper.js": "^1.16.0",
"request": "^2.88.2", "request": "^2.88.2",
"serve-favicon": "^2.5.0", "serve-favicon": "^2.5.0",
"treant-js": "^1.0.1"
} }
} }
familyark/app/public/css/Treant.css
-11
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; }
familyark/app/public/css/main.css
+40 -10
View File
@@ -12,6 +12,7 @@ body{
overflow-y:scroll; overflow-y:scroll;
color: white; color: white;
font-family: ark; font-family: ark;
text-shadow: 0px 0px 1px #000;
} }
body>div:first-child { body>div:first-child {
@@ -19,12 +20,10 @@ body>div:first-child {
} }
#menu{ #menu{
background: rgba(0, 153, 153, 0.6);
width: 150px; width: 150px;
float: left; float: left;
padding-top: 25px; padding-top: 25px;
padding-bottom: 25px; padding-bottom: 25px;
border: 2px solid rgb(0, 153, 153);
position: fixed; position: fixed;
margin: 15px; margin: 15px;
} }
@@ -35,8 +34,9 @@ body>div:first-child {
font-weight: bold; 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; color: black;
text-shadow: 0 0px 4px #FFF, 0 0px 10px #ff0, 0 0px 20px #ff8000, 0 -0px 40px #F00;
} }
h2{ h2{
@@ -45,11 +45,12 @@ h2{
#menu li a:hover, #menu h4 a:hover{ #menu li a:hover, #menu h4 a:hover{
cursor: pointer; cursor: pointer;
color: black;
} }
#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; color: white;
text-shadow: none;
text-decoration: none;
} }
#menu li a{ #menu li a{
@@ -60,8 +61,13 @@ h2{
text-align: center; text-align: center;
} }
#body{ #menu, #body{
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
border: 2px solid rgb(0, 0, 0);
}
#body{
width: calc(100vw - 210px); width: calc(100vw - 210px);
min-height: 518px; min-height: 518px;
margin: 15px;; margin: 15px;;
@@ -69,7 +75,6 @@ h2{
padding-right: 25px; padding-right: 25px;
padding-top: 50px; padding-top: 50px;
padding-bottom: 50px; padding-bottom: 50px;
border: 2px solid rgb(0, 153, 153);
position: absolute; position: absolute;
right: 0; right: 0;
} }
@@ -80,11 +85,11 @@ h2{
table.dataTable tbody tr{ 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){ 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{ .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
@@ -130,7 +135,7 @@ table.info{
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background-color: rgba(0, 153, 153); background-color: rgba(0, 0, 0);
} }
#load img{ #load img{
@@ -140,3 +145,28 @@ table.info{
-moz-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); 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;
}
familyark/app/public/index.html
+1 -3
View File
@@ -2,13 +2,11 @@
<head> <head>
<link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css"/> <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/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/Chart.min.css" rel="stylesheet" type="text/css"/>
<link href="/css/main.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.min.js"></script>
<script src="/js/jquery.dataTables.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="https://rewish.github.io/jquery-bgswitcher/jquery.bgswitcher.js"></script>
<script src="/js/Chart.min.js"></script> <script src="/js/Chart.min.js"></script>
<script src="/js/chart.js"></script> <script src="/js/chart.js"></script>
familyark/app/public/js/Treant.js
-1362
View File
File diff suppressed because it is too large Load Diff
familyark/app/public/js/buttons.js
+3 -1
View File
@@ -37,7 +37,9 @@ $('document').ready(function(){
{ title: "Level" }, { title: "Level" },
{ title: "Specie" }, { title: "Specie" },
{ title: "Options", className: "options-table", orderable: false,data: null, targets: -1, "mRender": function(data, type, full) { { 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"); $("#load").fadeOut("fast");
familyark/app/public/js/chart.js
+4 -4
View File
@@ -10,8 +10,8 @@ function set_chart(data){
label: 'Initial', label: 'Initial',
stack: 'Stack 0', stack: 'Stack 0',
borderWidth: 2, borderWidth: 2,
borderColor: "rgb(0, 153, 153, 0.5)", borderColor: "rgb(0, 0, 0, 0.5)",
backgroundColor: 'rgba(0, 153, 153, 0.9)', backgroundColor: 'rgba(0, 0, 0, 0.9)',
data: [ data: [
data.initial_health ? data.initial_health.$numberDecimal : "", data.initial_health ? data.initial_health.$numberDecimal : "",
data.initial_energy ? data.initial_energy.$numberDecimal : "", data.initial_energy ? data.initial_energy.$numberDecimal : "",
@@ -23,8 +23,8 @@ function set_chart(data){
label: 'Now', label: 'Now',
stack: 'Stack 0', stack: 'Stack 0',
borderWidth: 2, borderWidth: 2,
borderColor: "rgb(0, 153, 153, 1)", borderColor: "rgb(0, 0, 0, 1)",
backgroundColor: 'rgba(0, 153, 153, 0.5)', backgroundColor: 'rgba(0, 0, 0, 0.5)',
data: [ data: [
data.health ? data.health.$numberDecimal : "", data.health ? data.health.$numberDecimal : "",
data.energy ? data.energy.$numberDecimal : "", data.energy ? data.energy.$numberDecimal : "",
familyark/app/public/js/raphael.js
-12
View File
File diff suppressed because one or more lines are too long