Skip to content

C
cbdiscord
Commit 445ba9bf authored by Geovanny's avatar Geovanny
Browse files
Options

House creation and update done

parent 6e88953c
Hide whitespace changes
Inline Side-by-side
Showing with 516 additions and 55 deletions
server/house/model.js
View file @ 445ba9bf
...@@ -13,9 +13,14 @@ model.getAll = async () => { ...@@ -13,9 +13,14 @@ model.getAll = async () => {
return data; return data;
} }
model.getHouse = async() => { model.getHouse = async(house_id) => {
// implement getting house details const sql_text = `SELECT h.*, u.username as liege_username
throw Error('Not Implemented'); FROM houses as h
LEFT JOIN users as u on u.id = h.liege_id
WHERE h.id = ? LIMIT 1`;
const data = await db.con.query(sql_text, house_id);
return data[0];
} }
model.insertHouse = async(body, liege_id) => { model.insertHouse = async(body, liege_id) => {
......
server/house/route.js
View file @ 445ba9bf
...@@ -258,9 +258,10 @@ authRouter.delete('/leave-house', async (context, next) => { ...@@ -258,9 +258,10 @@ authRouter.delete('/leave-house', async (context, next) => {
} }
}); });
router.get('/', async (context, next) => { authRouter.get('/', async (context, next) => {
hasHouse(context);
try{ try{
const data = await houseModel.getHouse(); const data = await houseModel.getHouse(context.user.house_id);
context.response.status = 200; context.response.status = 200;
context.response.body = data; context.response.body = data;
}catch(error){ }catch(error){
...@@ -288,13 +289,16 @@ authRouter.post('/', async (context, next) => { ...@@ -288,13 +289,16 @@ authRouter.post('/', async (context, next) => {
}); });
authRouter.put('/:house_id', async (context, next) => { authRouter.put('/:house_id', async (context, next) => {
console.log('asd')
checkHouse(context); checkHouse(context);
checkPermissions(context, HOUSE_ROLES.LIEGE) checkPermissions(context, HOUSE_ROLES.LIEGE)
try{ try{
console.log('dsa')
const body = context.request.body; const body = context.request.body;
if(!body){ if(!body){
throw Error('No params') throw Error('No params')
} }
console.log(body)
await houseModel.modifyHouse(context.user.house_id, body); await houseModel.modifyHouse(context.user.house_id, body);
context.response.status = 204; context.response.status = 204;
}catch(error){ }catch(error){
......
web/myhouse/controller.js
View file @ 445ba9bf
import Sync from "./sync.js"; import Sync from "./sync.js";
function isEquivalent(a, b) {
// Create arrays of property names
var aProps = Object.getOwnPropertyNames(a);
var bProps = Object.getOwnPropertyNames(b);
// If number of properties is different,
// objects are not equivalent
if (aProps.length != bProps.length) {
return false;
}
for (var i = 0; i < aProps.length; i++) {
var propName = aProps[i];
// If values of same property are not equal,
// objects are not equivalent
if (a[propName] !== b[propName]) {
return false;
}
}
// If we made it this far, objects
// are considered equivalent
return true;
}
class MyHouseController{ class MyHouseController{
constructor(view){ constructor(view){
...@@ -8,6 +34,10 @@ class MyHouseController{ ...@@ -8,6 +34,10 @@ class MyHouseController{
this.permission_level = 1000; this.permission_level = 1000;
this.members = []; this.members = [];
this.requests = []; this.requests = [];
this.house = {};
this.view.addEventListener("create_house", (event) => this.createHouse(event.detail));
this.view.addEventListener("modify_house", (event) => this.modifyHouse(event.detail));
this.view.addEventListener("participation_attemp", (event) => this.attempParticipate(event.detail)); this.view.addEventListener("participation_attemp", (event) => this.attempParticipate(event.detail));
this.view.addEventListener("member_select", (event) => this.selectMember(event.detail)); this.view.addEventListener("member_select", (event) => this.selectMember(event.detail));
this.view.addEventListener("modify_member_role", (event) => this.modifyMemberRole(event.detail.member_id, event.detail.role)); this.view.addEventListener("modify_member_role", (event) => this.modifyMemberRole(event.detail.member_id, event.detail.role));
...@@ -20,6 +50,30 @@ class MyHouseController{ ...@@ -20,6 +50,30 @@ class MyHouseController{
setInterval(() => { setInterval(() => {
this.refresh(); this.refresh();
}, 10000); }, 10000);
this.view.updateViews(undefined);
}
async createHouse(house){
try{
await this.sync.createHouse(house);
alert('House Created');
this.refresh();
}catch(error){
console.log(error);
alert('Failed to Create House')
}
}
async modifyHouse(house){
try{
await this.sync.modifyHouse(house);
alert('House Modified');
this.refresh();
}catch(error){
console.log(error);
alert('Failed to Modify House')
}
} }
async modifyMemberRole(member_id, role){ async modifyMemberRole(member_id, role){
...@@ -45,6 +99,7 @@ class MyHouseController{ ...@@ -45,6 +99,7 @@ class MyHouseController{
} }
async refresh(){ async refresh(){
this.getHouse();
this.getParticipation(); this.getParticipation();
this.getMembers(); this.getMembers();
this.getPermissionLevel(); this.getPermissionLevel();
...@@ -139,6 +194,20 @@ class MyHouseController{ ...@@ -139,6 +194,20 @@ class MyHouseController{
console.log(error); console.log(error);
} }
} }
async getHouse(){
try{
const house = await this.sync.getHouse();
if(!isEquivalent(this.house, house)){
this.house = house;
this.view.updateViews(house);
}
}catch(error){
this.house = {};
this.view.updateViews();
console.log(error);
}
}
} }
export default MyHouseController; export default MyHouseController;
\ No newline at end of file
web/myhouse/house_view.js 0 → 100644
View file @ 445ba9bf
class HouseView extends EventTarget{
constructor(element){
super();
this.element = element;
this.is_editing = false;
this.modify_btn = this.element.querySelector('#modify_btn');
this.create_btn = this.element.querySelector('#create_btn')
this.edit_btn = this.element.querySelector('#edit_btn');
this.title = this.element.querySelector('#title');
this.house = {};
this.display_fields = {
element: this.element.querySelector('#house_text'),
name: this.element.querySelector('#house_name'),
house_level: this.element.querySelector('#house_level'),
liege_name: this.element.querySelector('#liege_name'),
camp_location: this.element.querySelector('#camp_location'),
// members: this.element.querySelector('.members'),
}
this.edit_fields = {
element: this.element.querySelector('#house_edit'),
name: this.element.querySelector('input#house_name'),
house_level: this.element.querySelector('input#house_level'),
camp_location: this.element.querySelector('input#camp_location'),
// liege_name: this.element.querySelector('input.liege_name'),
// members: this.element.querySelector('input.members'),
}
this.edit_btn.addEventListener("click", () => {
this.toggleEdit();
});
this.create_btn.addEventListener("click", () => {
this.dispatchEvent(new CustomEvent("create_house", {detail: {
house_name: this.edit_fields.name.value,
house_level: this.edit_fields.house_level.value,
camp_location: this.edit_fields.camp_location.value,
}}))
});
this.modify_btn.addEventListener("click", () => {
this.dispatchEvent(new CustomEvent("modify_house", {detail: {
house_id: this.house.id,
house_name: this.edit_fields.name.value ? this.edit_fields.name.value : this.house.name,
house_level: this.edit_fields.house_level.value ? this.edit_fields.house_level.value : this.house.house_level,
camp_location: this.edit_fields.camp_location.value ? this.edit_fields.camp_location.name.value : this.house.camp_location,
}}))
});
}
selectHouse(house){
this.house = house;
this.toggleView();
}
toggleView(){
this.title.innerText = 'House';
this.refreshText();
this.hideEdit();
this.showText();
this.create_btn.style.display = "none";
}
updatePermissions(permission_level){
if(permission_level<2){
this.edit_btn.style.display = "";
}else{
this.edit_btn.style.display = "none";
}
}
toggleCreate(){
this.title.innerText = 'Create a House';
this.hideText();
this.showEdit();
this.edit_btn.style.display = "none";
this.modify_btn.style.display = "none";
this.create_btn.style.display = "";
}
toggleEdit(){
this.is_editing = !this.is_editing;
this.refresh();
}
refresh(){
if(this.is_editing){
this.hideText();
this.showEdit();
}else{
this.refreshText();
this.hideEdit();
this.showText();
}
}
refreshText(){
this.display_fields.name.innerText = `House Name: ${this.house.house_name}`;
this.display_fields.house_level.innerText = `House Level: ${this.house.house_level}`;
this.display_fields.liege_name.innerText = `Liege: ${this.house.liege_username}`;
this.display_fields.camp_location.innerText = `Camp Location: ${this.house.camp_location}`;
}
showText(){
this.display_fields.element.style.display = "";
}
hideText(){
this.display_fields.element.style.display = "none"
}
showEdit(){
this.edit_fields.element.style.display = "";
this.modify_btn.style.display = "";
}
hideEdit(){
this.edit_fields.element.style.display = "none";
this.modify_btn.style.display = "none";
}
}
export default HouseView;
\ No newline at end of file
web/myhouse/index.html
View file @ 445ba9bf
...@@ -15,14 +15,44 @@ ...@@ -15,14 +15,44 @@
<nav-placeholder></nav-placeholder> <nav-placeholder></nav-placeholder>
<script src="/navbar/navbar.js"></script> <script src="/navbar/navbar.js"></script>
<content-body id="my_house"> <content-body id="my_house">
<div id="area_1"> <house-area>
<div class="table_header">
<p id="title" class="header_title">---</p>
<button id="modify_btn" class="modify_button one" style="display: none;">Update</button>
<button id="create_btn" class="add_button one" style="display: none;">Create</button>
<button id="edit_btn" class="two">Edit</button>
</div>
<div id="house_details">
<div id="house_text">
<span id="house_name">House Name: ---</span>
<span id="house_level">House Level: ---</span>
<span id="liege_name">Liege: ---</span>
<span id="camp_location">Camp Location: ---</span>
</div>
<div id="house_edit" style="display: none;">
<div>
<span>Name:&nbsp;</span>
<input id="house_name" type="text"/>
</div>
<div>
<span>House Level:&nbsp;</span>
<input id="house_level" type="number"/>
</div>
<div>
<span>Camp Location:&nbsp;</span>
<input id="camp_location" type="text"/>
</div>
</div>
</div>
</house-area>
<div id="area_1" style="display: none;">
<war-participation> <war-participation>
<table-wrapper> <table-wrapper>
<div class="table_header"> <div class="table_header">
<span>Participation:</span> <p class="header_title">Participation:</p>
<button id="yes">Yes</button> <button id="yes" class="one">Yes</button>
<button id="no">No</button> <button id="no" class="two">No</button>
<button id="maybe">Maybe</button> <button id="maybe" class="three">Maybe</button>
</div> </div>
<table id="data_table" class="display"></table> <table id="data_table" class="display"></table>
</table-wrapper> </table-wrapper>
...@@ -31,7 +61,7 @@ ...@@ -31,7 +61,7 @@
<table-detail style="display: initial;"> <table-detail style="display: initial;">
<table-wrapper> <table-wrapper>
<div class="table_header"> <div class="table_header">
<p>Members</p> <p class="header_title">Members</p>
</div> </div>
<table id="data_table" class="display"></table> <table id="data_table" class="display"></table>
</table-wrapper> </table-wrapper>
...@@ -53,18 +83,19 @@ ...@@ -53,18 +83,19 @@
</table-detail> </table-detail>
</members-area> </members-area>
</div> </div>
<div id="area_2"> <div id="area_2" style="display: none;">
<requests-area style="display: none;"> <requests-area>
<div class="table_header"> <div class="table_header">
<div class="title"><span>House</span></div> <!-- <div class="title"><span>House</span></div> -->
<button id="reject">Reject</button> <p class="header_title">House</p>
<button id="accept">Accept</button> <button id="reject" class="one">Reject</button>
<button id="accept" class="two">Accept</button>
</div> </div>
<table id="data_table" class="display"></table> <table id="data_table" class="display"></table>
</requests-area> </requests-area>
<member-units style="display: none;"> <member-units style="display: none;">
<div class="table_header"> <div class="table_header">
<div class="title"><span>Units</span></div> <p class="header_title">Units</p>
</div> </div>
<table id="data_table" class="display"></table> <table id="data_table" class="display"></table>
</member-units> </member-units>
......
web/myhouse/sync.js
View file @ 445ba9bf
class Sync{ class Sync{
async getHouse(){
const response = await fetch("/api/house/");
if(!response.ok){
throw Error('Failed to get requests');
}
const data = await response.json();
return data;
}
async createHouse(house){
const response = await fetch("/api/house", {
method: "POST",
body: JSON.stringify(house),
headers: {
'Content-Type': 'application/json'
}
});
if(!response.ok){
throw Error('Failed to Create House');
}
}
async modifyHouse(house){
const response = await fetch(`/api/house/${house.id}`, {
method: "PUT",
body: JSON.stringify(house),
headers: {
'Content-Type': 'application/json'
}
});
if(!response.ok){
throw Error('Failed to Modify House');
}
}
async getRequests(){ async getRequests(){
const response = await fetch("/api/house/requests"); const response = await fetch("/api/house/requests");
......
web/myhouse/view.js
View file @ 445ba9bf
import HouseView from "./house_view.js";
import ParticipationView from "./participation_view.js"; import ParticipationView from "./participation_view.js";
import MembersView from "./members_view.js"; import MembersView from "./members_view.js";
import RequestsView from "./requests_view.js"; import RequestsView from "./requests_view.js";
...@@ -8,15 +9,24 @@ class MyHouseController extends EventTarget{ ...@@ -8,15 +9,24 @@ class MyHouseController extends EventTarget{
constructor(){ constructor(){
super(); super();
this.house_view = new HouseView(document.querySelector('house-area'));
this.participation_view = new ParticipationView(document.querySelector('war-participation')); this.participation_view = new ParticipationView(document.querySelector('war-participation'));
this.members_view = new MembersView(document.querySelector('members-area')); this.members_view = new MembersView(document.querySelector('members-area'));
this.requests_view = new RequestsView(document.querySelector('requests-area')); this.requests_view = new RequestsView(document.querySelector('requests-area'));
this.member_units_view = new MemberUnitsView(document.querySelector('member-units')) this.member_units_view = new MemberUnitsView(document.querySelector('member-units'))
this.area_1 = document.querySelector('#area_1');
this.area_2 = document.querySelector('#area_2');
this.house_view.addEventListener("create_house", (event) => {
this.dispatchEvent(new CustomEvent("create_house", {detail: event.detail}));
});
this.house_view.addEventListener("modify_house", (event) => {
this.dispatchEvent(new CustomEvent("modify_house", {detail: event.detail}));
});
this.participation_view.addEventListener("participation_atempt", (event) => { this.participation_view.addEventListener("participation_atempt", (event) => {
this.dispatchEvent(new CustomEvent("participation_attemp", {detail: event.detail})); this.dispatchEvent(new CustomEvent("participation_attemp", {detail: event.detail}));
}); });
this.members_view.addEventListener("member_select", (event) => { this.members_view.addEventListener("member_select", (event) => {
this.dispatchEvent(new CustomEvent("member_select", {detail: event.detail})); this.dispatchEvent(new CustomEvent("member_select", {detail: event.detail}));
}); });
...@@ -35,6 +45,9 @@ class MyHouseController extends EventTarget{ ...@@ -35,6 +45,9 @@ class MyHouseController extends EventTarget{
this.requests_view.addEventListener("reject_request", (event) => { this.requests_view.addEventListener("reject_request", (event) => {
this.dispatchEvent(new CustomEvent("reject_request", {detail: event.detail})); this.dispatchEvent(new CustomEvent("reject_request", {detail: event.detail}));
}); });
this.hideArea1();
this.hideArea2();
} }
drawParticipationTable(data){ drawParticipationTable(data){
...@@ -62,13 +75,40 @@ class MyHouseController extends EventTarget{ ...@@ -62,13 +75,40 @@ class MyHouseController extends EventTarget{
updatePermissions(permission_level){ updatePermissions(permission_level){
if(permission_level<2){ if(permission_level<2){
this.showArea2();
this.requests_view.show(); this.requests_view.show();
this.member_units_view.show(); this.member_units_view.show();
}else{ }else{
this.hideArea2();
this.requests_view.hide(); this.requests_view.hide();
this.member_units_view.hide(); this.member_units_view.hide();
} }
this.members_view.updatePermissions(permission_level); this.members_view.updatePermissions(permission_level);
this.house_view.updatePermissions(permission_level);
}
updateViews(house){
if(!house){
this.hideArea1();
this.hideArea2();
this.house_view.toggleCreate();
}else{
this.showArea1();
this.house_view.selectHouse(house);
}
}
showArea1(){
this.area_1.style.display = "grid";
}
hideArea1(){
this.area_1.style.display = "none";
}
showArea2(){
this.area_2.style.display = "grid";
}
hideArea2(){
this.area_2.style.display = "none";
} }
} }
......
web/sass/house.scss
View file @ 445ba9bf
...@@ -33,10 +33,37 @@ ...@@ -33,10 +33,37 @@
#my_house{ #my_house{
display: grid; display: grid;
grid-template: grid-template:
"house_area" 150px
"area-1" 500px "area-1" 500px
"area-2" 500px "area-2" 500px
/1fr /1fr
; ;
house-area{
grid-area: house_area;
border: 2px solid black;
#house_details{
width: 100%;
height: 100px;
div{
display: flex;
height: 100%;
span{
margin: auto;
vertical-align: middle;
}
justify-content: space-evenly;
input{
margin: auto;
max-height: 50px;
}
}
}
}
#area_1{ #area_1{
display: grid; display: grid;
grid-template: grid-template:
...@@ -50,17 +77,17 @@ ...@@ -50,17 +77,17 @@
war-participation{ war-participation{
grid-area: war-participation; grid-area: war-participation;
padding: 10px; padding: 10px;
.header_title{
margin-left: 10px;
text-align: left;
}
} }
members-area{ members-area{
grid-area: members; grid-area: members;
padding: 10px; padding: 10px;
// background-color: blue; // background-color: blue;
.table_header{
text-align: center;
font-size: 20px;
}
detail{ detail{
left: 50%; left: 50%;
height: 350px; height: 350px;
...@@ -129,6 +156,7 @@ ...@@ -129,6 +156,7 @@
} }
member-units{ member-units{
grid-area: member-units; grid-area: member-units;
padding: 10px;
// background-color: green; // background-color: green;
.table_header{ .table_header{
...@@ -144,10 +172,39 @@ ...@@ -144,10 +172,39 @@
} }
} }
.table_header{ .table_header{
text-align: right; text-align: right;
// $positions : 10px, 100px, 200px, 300px;
// @for $i from 1 through length($positions) {
// $pos: nth($positions, $i);
// button:nth-child(#{$i}){
// right: $pos;
// }
// }
$positions: (
"one": 10px,
"two": 110px,
"three": 210px,
"four": 310px
);
@each $starNo, $value in $positions{
button.#{$starNo} {
right: $value;
}
}
button{ button{
color: rgb(204, 204, 204); color: rgb(204, 204, 204);
position: absolute;
top: 1px;
right: 10px;
} }
} }
} }
.header_title{
text-align: center;
}
\ No newline at end of file
web/sass/table.scss
View file @ 445ba9bf
.table_header { .table_header {
overflow: hidden; overflow: hidden;
// border: 1px solid #ccc; position: relative;
background-color: #383838; background-color: #383838;
border: 1px solid #ccc; border: 1px solid #ccc;
border-bottom: none; border-bottom: none;
min-height: 50px;
button{ button{
font-family: monospace; font-family: monospace;
font-size: 20px; font-size: 20px;
...@@ -108,16 +109,16 @@ detail{ ...@@ -108,16 +109,16 @@ detail{
text-align: center; text-align: center;
} }
} }
.add_button{ }
background-color: green !important; .add_button{
border: 2px solid rgb(3, 102, 20); background-color: green !important;
} border: 2px solid rgb(3, 102, 20);
.modify_button{ }
background-color: rgb(53, 53, 255) !important; .modify_button{
border: 2px solid rgb(4, 4, 124); background-color: rgb(53, 53, 255) !important;
} border: 2px solid rgb(4, 4, 124);
.delete_button{ }
background-color: red !important; .delete_button{
border: 2px solid rgb(83, 3, 3); background-color: red !important;
} border: 2px solid rgb(83, 3, 3);
} }
\ No newline at end of file
web/stylesheets/house.css
View file @ 445ba9bf
...@@ -29,7 +29,28 @@ ...@@ -29,7 +29,28 @@
#my_house { #my_house {
display: grid; display: grid;
grid-template: "area-1" 500px "area-2" 500px/1fr; grid-template: "house_area" 150px "area-1" 500px "area-2" 500px/1fr;
}
#my_house house-area {
grid-area: house_area;
border: 2px solid black;
}
#my_house house-area #house_details {
width: 100%;
height: 100px;
}
#my_house house-area #house_details div {
display: flex;
height: 100%;
justify-content: space-evenly;
}
#my_house house-area #house_details div span {
margin: auto;
vertical-align: middle;
}
#my_house house-area #house_details div input {
margin: auto;
max-height: 50px;
} }
#my_house #area_1 { #my_house #area_1 {
display: grid; display: grid;
...@@ -43,14 +64,14 @@ ...@@ -43,14 +64,14 @@
grid-area: war-participation; grid-area: war-participation;
padding: 10px; padding: 10px;
} }
#my_house #area_1 war-participation .header_title {
margin-left: 10px;
text-align: left;
}
#my_house #area_1 members-area { #my_house #area_1 members-area {
grid-area: members; grid-area: members;
padding: 10px; padding: 10px;
} }
#my_house #area_1 members-area .table_header {
text-align: center;
font-size: 20px;
}
#my_house #area_1 members-area detail { #my_house #area_1 members-area detail {
left: 50%; left: 50%;
height: 350px; height: 350px;
...@@ -105,6 +126,7 @@ ...@@ -105,6 +126,7 @@
} }
#my_house #area_2 member-units { #my_house #area_2 member-units {
grid-area: member-units; grid-area: member-units;
padding: 10px;
} }
#my_house #area_2 member-units .table_header .title { #my_house #area_2 member-units .table_header .title {
text-align: left; text-align: left;
...@@ -117,8 +139,27 @@ ...@@ -117,8 +139,27 @@
#my_house .table_header { #my_house .table_header {
text-align: right; text-align: right;
} }
#my_house .table_header button.one {
right: 10px;
}
#my_house .table_header button.two {
right: 110px;
}
#my_house .table_header button.three {
right: 210px;
}
#my_house .table_header button.four {
right: 310px;
}
#my_house .table_header button { #my_house .table_header button {
color: #cccccc; color: #cccccc;
position: absolute;
top: 1px;
right: 10px;
}
.header_title {
text-align: center;
} }
/*# sourceMappingURL=house.css.map */ /*# sourceMappingURL=house.css.map */
web/stylesheets/house.css.map
View file @ 445ba9bf
{"version":3,"sourceRoot":"","sources":["../sass/house.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;;AAMhB;EACI;EACA,eACI;;AAIJ;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIA;EACI;;AAKhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAII;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;AAMR;EACI;EACA;;AACA;EACI;EACA;;AAIZ;EACI;;AAEJ;EACI;;AAGR;EACI;;AAII;EACI;EACA;;AACA;EACI;EACA;;AAOpB;EACI;;AACA;EACI","file":"house.css"} {"version":3,"sourceRoot":"","sources":["../sass/house.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;;AAMhB;EACI;EACA,eACI;;AAMJ;EACI;EACA;;AAEA;EAEI;EACA;;AACA;EACI;EACA;EAKA;;AAJA;EACI;EACA;;AAIJ;EACI;EACA;;AAMhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEA;EACI;EACA;;AAGR;EACI;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIA;EACI;;AAKhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAII;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;AAMR;EACI;EACA;;AACA;EACI;EACA;;AAIZ;EACI;;AAEJ;EACI;;AAGR;EACI;EACA;;AAII;EACI;EACA;;AACA;EACI;EACA;;AAUpB;EACI;;AAgBI;EACI,OARI;;AAOR;EACI,OARI;;AAOR;EACI,OARI;;AAOR;EACI,OARI;;AAWZ;EACI;EACA;EACA;EACA;;;AAKZ;EACI","file":"house.css"}
\ No newline at end of file \ No newline at end of file
web/stylesheets/main.css
View file @ 445ba9bf
...@@ -126,9 +126,11 @@ bar-user .dropdown:hover { ...@@ -126,9 +126,11 @@ bar-user .dropdown:hover {
.table_header { .table_header {
overflow: hidden; overflow: hidden;
position: relative;
background-color: #383838; background-color: #383838;
border: 1px solid #ccc; border: 1px solid #ccc;
border-bottom: none; border-bottom: none;
min-height: 50px;
} }
.table_header button { .table_header button {
font-family: monospace; font-family: monospace;
...@@ -229,15 +231,18 @@ detail .detail_buttons button { ...@@ -229,15 +231,18 @@ detail .detail_buttons button {
color: whitesmoke; color: whitesmoke;
text-align: center; text-align: center;
} }
detail .add_button {
.add_button {
background-color: green !important; background-color: green !important;
border: 2px solid #036614; border: 2px solid #036614;
} }
detail .modify_button {
.modify_button {
background-color: #3535ff !important; background-color: #3535ff !important;
border: 2px solid #04047c; border: 2px solid #04047c;
} }
detail .delete_button {
.delete_button {
background-color: red !important; background-color: red !important;
border: 2px solid #530303; border: 2px solid #530303;
} }
...@@ -379,7 +384,28 @@ center-div { ...@@ -379,7 +384,28 @@ center-div {
#my_house { #my_house {
display: grid; display: grid;
grid-template: "area-1" 500px "area-2" 500px/1fr; grid-template: "house_area" 150px "area-1" 500px "area-2" 500px/1fr;
}
#my_house house-area {
grid-area: house_area;
border: 2px solid black;
}
#my_house house-area #house_details {
width: 100%;
height: 100px;
}
#my_house house-area #house_details div {
display: flex;
height: 100%;
justify-content: space-evenly;
}
#my_house house-area #house_details div span {
margin: auto;
vertical-align: middle;
}
#my_house house-area #house_details div input {
margin: auto;
max-height: 50px;
} }
#my_house #area_1 { #my_house #area_1 {
display: grid; display: grid;
...@@ -393,14 +419,14 @@ center-div { ...@@ -393,14 +419,14 @@ center-div {
grid-area: war-participation; grid-area: war-participation;
padding: 10px; padding: 10px;
} }
#my_house #area_1 war-participation .header_title {
margin-left: 10px;
text-align: left;
}
#my_house #area_1 members-area { #my_house #area_1 members-area {
grid-area: members; grid-area: members;
padding: 10px; padding: 10px;
} }
#my_house #area_1 members-area .table_header {
text-align: center;
font-size: 20px;
}
#my_house #area_1 members-area detail { #my_house #area_1 members-area detail {
left: 50%; left: 50%;
height: 350px; height: 350px;
...@@ -455,6 +481,7 @@ center-div { ...@@ -455,6 +481,7 @@ center-div {
} }
#my_house #area_2 member-units { #my_house #area_2 member-units {
grid-area: member-units; grid-area: member-units;
padding: 10px;
} }
#my_house #area_2 member-units .table_header .title { #my_house #area_2 member-units .table_header .title {
text-align: left; text-align: left;
...@@ -467,8 +494,27 @@ center-div { ...@@ -467,8 +494,27 @@ center-div {
#my_house .table_header { #my_house .table_header {
text-align: right; text-align: right;
} }
#my_house .table_header button.one {
right: 10px;
}
#my_house .table_header button.two {
right: 110px;
}
#my_house .table_header button.three {
right: 210px;
}
#my_house .table_header button.four {
right: 310px;
}
#my_house .table_header button { #my_house .table_header button {
color: #cccccc; color: #cccccc;
position: absolute;
top: 1px;
right: 10px;
}
.header_title {
text-align: center;
} }
body { body {
......
web/stylesheets/main.css.map
View file @ 445ba9bf
{"version":3,"sourceRoot":"","sources":["../fontawesome/font_awesome.scss","../sass/navbar.scss","../sass/table.scss","../sass/login.scss","../sass/unit.scss","../sass/house.scss","../sass/main.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAmBF;EACI;IAAK;;EACP;IAAO;;;AC1CX;EACI;EACA;EACA;EACA,eACI;EAGJ;EACA;;;AAGJ;EAEI;EACA;EACA;;AACA;EACI;EACA;EAEA;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;;AAKJ;EACI;;;AAIR;EACI;EACA;EACA;;AACA;EACI;EACA;;;AAIR;EACI;;;AAKA;EACI;;AAEJ;EACI;;;ACtGR;EACI;EAEA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAIJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,eACI;EAGJ;EACA;;;AAEJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGR;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;;ACxHR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;AAA0B;;;AAG9B;AACA;EACI;IAAM;;EACN;IAAI;;;AAGN;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AClDJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACQ;EACA;EACA;EACA;;;AAGR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AC7CJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;;AAMhB;EACI;EACA,eACI;;AAIJ;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIA;EACI;;AAKhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAII;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;AAMR;EACI;EACA;;AACA;EACI;EACA;;AAIZ;EACI;;AAEJ;EACI;;AAGR;EACI;;AAII;EACI;EACA;;AACA;EACI;EACA;;AAOpB;EACI;;AACA;EACI;;;AC9IZ;EACI;EACA;EACA;EACA;EACA,eACI;;;AAKR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;;;AAIR;EACI;EACA","file":"main.css"} {"version":3,"sourceRoot":"","sources":["../fontawesome/font_awesome.scss","../sass/navbar.scss","../sass/table.scss","../sass/login.scss","../sass/unit.scss","../sass/house.scss","../sass/main.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAmBF;EACI;IAAK;;EACP;IAAO;;;AC1CX;EACI;EACA;EACA;EACA,eACI;EAGJ;EACA;;;AAGJ;EAEI;EACA;EACA;;AACA;EACI;EACA;EAEA;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;;AAKJ;EACI;;;AAIR;EACI;EACA;EACA;;AACA;EACI;EACA;;;AAIR;EACI;;;AAKA;EACI;;AAEJ;EACI;;;ACtGR;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAIJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,eACI;EAGJ;EACA;;;AAEJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIZ;EACI;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA;;;AC1HJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;AAA0B;;;AAG9B;AACA;EACI;IAAM;;EACN;IAAI;;;AAGN;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AClDJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACQ;EACA;EACA;EACA;;;AAGR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AC7CJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;;AAMhB;EACI;EACA,eACI;;AAMJ;EACI;EACA;;AAEA;EAEI;EACA;;AACA;EACI;EACA;EAKA;;AAJA;EACI;EACA;;AAIJ;EACI;EACA;;AAMhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEA;EACI;EACA;;AAGR;EACI;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIA;EACI;;AAKhB;EACI;EACA,eACI;;AAGJ;EACI;EACA;;AAII;EACI;;AACA;EACI;;AAGR;EACI;;AACA;EACI;;AAMR;EACI;EACA;;AACA;EACI;EACA;;AAIZ;EACI;;AAEJ;EACI;;AAGR;EACI;EACA;;AAII;EACI;EACA;;AACA;EACI;EACA;;AAUpB;EACI;;AAgBI;EACI,OARI;;AAOR;EACI,OARI;;AAOR;EACI,OARI;;AAOR;EACI,OARI;;AAWZ;EACI;EACA;EACA;EACA;;;AAKZ;EACI;;;ACzMJ;EACI;EACA;EACA;EACA;EACA,eACI;;;AAKR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;;;AAIR;EACI;EACA","file":"main.css"}
\ No newline at end of file \ No newline at end of file
web/stylesheets/table.css
View file @ 445ba9bf
.table_header { .table_header {
overflow: hidden; overflow: hidden;
position: relative;
background-color: #383838; background-color: #383838;
border: 1px solid #ccc; border: 1px solid #ccc;
border-bottom: none; border-bottom: none;
min-height: 50px;
} }
.table_header button { .table_header button {
font-family: monospace; font-family: monospace;
...@@ -103,15 +105,18 @@ detail .detail_buttons button { ...@@ -103,15 +105,18 @@ detail .detail_buttons button {
color: whitesmoke; color: whitesmoke;
text-align: center; text-align: center;
} }
detail .add_button {
.add_button {
background-color: green !important; background-color: green !important;
border: 2px solid #036614; border: 2px solid #036614;
} }
detail .modify_button {
.modify_button {
background-color: #3535ff !important; background-color: #3535ff !important;
border: 2px solid #04047c; border: 2px solid #04047c;
} }
detail .delete_button {
.delete_button {
background-color: red !important; background-color: red !important;
border: 2px solid #530303; border: 2px solid #530303;
} }
......
web/stylesheets/table.css.map
View file @ 445ba9bf
{"version":3,"sourceRoot":"","sources":["../sass/table.scss"],"names":[],"mappings":"AAAA;EACI;EAEA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAIJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,eACI;EAGJ;EACA;;;AAEJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGR;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA","file":"table.css"} {"version":3,"sourceRoot":"","sources":["../sass/table.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAIJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,eACI;EAGJ;EACA;;;AAEJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIZ;EACI;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA","file":"table.css"}
\ No newline at end of file \ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment