Bellsworne/critterfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactored stuff into new files, added a test modal for adding critters

Browse Source
This commit is contained in:
chris bell
2026-08-05 22:48:44 -05:00
parent 9e96151a42
commit 11fe8ca54d
9 changed files with 414 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/local.db
View File

Binary file not shown.

39
assets/main.rml
View File

@@ -6,14 +6,47 @@
<body data-model="app_data">
<h1>{{page_title}}</h1>
<h2>Critter Roster</h2>
<button data-event-click="is_dialog_open = true">Add New Critter</button>
<!-- Critter Cards -->
<div class="critter-list">
<div data-for="entry : critters" class="critter-card">
<h3>#{{entry.key}} - {{entry.value.name}}</h3>
<p><strong>Species:</strong> {{entry.value.species}}</p>
<p><strong>Gender:</strong> {{entry.value.gender}}</p>
<p><strong>Notes:</strong> {{entry.value.notes}}</p>
</div>
</div>
<!-- Modal Dialog Overlay -->
<div class="modal-overlay" data-visible="is_dialog_open">
<div class="modal-content">
<h2>Add New Critter</h2>
<p class="error" data-visible="error_message != ''">{{error_message}}</p>
<label>Name:</label>
<input type="text" data-value="form.name" />
<label>Species:</label>
<input type="text" data-value="form.species" />
<label>Gender (M/F):</label>
<input type="text" data-value="form.gender" />
<label>Mother ID (Optional):</label>
<input type="text" data-value="form.mother_id" />
<label>Father ID (Optional):</label>
<input type="text" data-value="form.father_id" />
<label>Notes:</label>
<input type="text" data-value="form.notes" />
<div class="modal-buttons">
<button data-event-click="submit_add_critter">Save</button>
<button data-event-click="is_dialog_open = false">Cancel</button>
</div>
</div>
</div>
</body>

49
assets/styles/main.rcss
View File

@@ -266,3 +266,52 @@ progress-value {
display: none;
}
/* ===================================
Specific app stuff
=================================== */
/* Critter cards */
/* Modals */
.modal-overlay {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
display: flex;
align-items: center;
justify-content: center;
}
.modal-content {
background-color: #2b2b2b;
color: #ffffff;
padding: 20px;
border-radius: 8px;
width: 350px;
}
.modal-content label {
display: block;
margin-top: 8px;
}
.modal-content input {
width: 100%;
margin-bottom: 8px;
}
.error {
color: #ff5555;
font-weight: bold;
}
.modal-buttons {
margin-top: 15px;
display: flex;
justify-content: space-between;
}