RanchiMall/ribc
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug fixes

Browse Source
This commit is contained in:
sairaj mote 2022-10-21 15:40:20 +05:30
parent 7abc075cd3
commit 5a39850dfa
5 changed files with 105 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components.js
View File

File diff suppressed because one or more lines are too long

76
css/main.css
View File

@ -311,14 +311,14 @@ sm-option {
strip-select {
--gap: 0;
background-color: rgba(var(--text-color), 0.06);
border-radius: 0.3rem;
border-radius: 3rem;
padding: 0.3rem;
}
strip-option {
position: relative;
font-size: 0.8rem;
--border-radius: 0.2rem;
--border-radius: 3rem;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
@ -1030,27 +1030,6 @@ ul {
line-height: 1.5;
}
#application_card {
position: relative;
overflow: hidden;
background-color: rgba(var(--foreground-color), 1);
border: solid thin rgba(var(--text-color), 0.1);
padding: 0;
}
#application_card > div:first-of-type {
padding: max(1rem, 3vw);
z-index: 2;
width: calc(100% - 4rem);
background: linear-gradient(90deg, rgba(var(--foreground-color), 1) 0%, rgba(var(--foreground-color), 0) 100%);
}
#application_card .illustration {
position: absolute;
height: 100%;
right: 0;
width: auto;
margin: 0 -1.5rem -1.5rem 0;
}
.task {
display: grid;
grid-template-columns: auto 1fr;
@ -1136,6 +1115,8 @@ ul {
#dashboard_page {
padding-bottom: 5rem;
grid-template-columns: auto;
overflow-y: auto;
align-items: flex-start;
}
.logo {
@ -1518,16 +1499,6 @@ ul {
margin: 0;
}
#best_interns_container {
margin-bottom: 1rem;
}
#edit_data_fig {
fill: rgba(var(--text-color), 0.6);
width: 60vw;
margin: 2rem 0;
}
#loading {
display: grid;
text-align: center;
@ -1693,6 +1664,7 @@ ul {
#projects_container__left {
height: 100%;
overflow-y: auto;
width: 100%;
}
#projects_container__left .list-container {
height: 100%;
@ -1724,9 +1696,10 @@ input[type=date]:focus {
box-shadow: 0 0 0 0.1rem var(--accent-color);
}
.search__icon {
height: 1.2rem;
width: 1.2rem;
#requests_container {
padding: 0 1rem;
gap: 1.5rem;
overflow-y: auto;
}
#user_role {
@ -1773,9 +1746,11 @@ input[type=date]:focus {
fill: var(--accent-color);
}
.pinned-card .project__title {
margin-bottom: 0.8rem;
font-weight: 500;
color: inherit;
color: rgba(var(--text-color), 0.9);
}
.pinned-card .project__title:hover {
color: var(--accent-color);
}
.pinned-card .project__complete-percent {
font-size: 0.8rem;
@ -1799,6 +1774,10 @@ input[type=date]:focus {
#settings_page {
align-content: flex-start;
}
#settings_page > * {
width: min(48rem, 100%);
margin: 0 auto;
}
@media only screen and (max-width: 640px) {
.hide-on-mobile,
@ -1897,16 +1876,18 @@ input[type=date]:focus {
}
#dashboard_page {
grid-template-columns: 1fr 18rem;
align-content: flex-start;
align-items: flex-start;
}
#dashboard_page > :not(#best_interns_container) {
grid-column: 1;
width: min(48rem, 100%);
margin: 0 auto;
}
#best_interns_container {
position: -webkit-sticky;
position: sticky;
top: 0;
grid-column: 2;
grid-row: 1/4;
height: 100%;
}
#all_interns_page__header {
grid-template-columns: 1fr auto;
@ -1916,11 +1897,6 @@ input[type=date]:focus {
}
#projects_container__left {
width: 18rem;
background-color: rgba(var(--foreground-color), 0.5);
}
#edit_data_fig {
width: 16rem;
justify-self: center;
}
#project_explorer {
display: grid;
@ -1991,6 +1967,14 @@ input[type=date]:focus {
font-size: 0.9rem;
grid-template-columns: 6rem 1fr 8rem;
}
#requests_container {
padding: 1rem;
grid-template-columns: 14rem 1fr;
}
#requests_container > :nth-child(2) {
width: min(48rem, 100%);
margin: 0 auto;
}
}
@media only screen and (min-width: 1280px) {
#main_page {

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

83
css/main.scss
View File

@ -306,14 +306,14 @@ sm-option {
strip-select {
--gap: 0;
background-color: rgba(var(--text-color), 0.06);
border-radius: 0.3rem;
border-radius: 3rem;
padding: 0.3rem;
}
strip-option {
position: relative;
font-size: 0.8rem;
--border-radius: 0.2rem;
--border-radius: 3rem;
user-select: none;
}
@ -1023,33 +1023,6 @@ ul {
}
}
#application_card {
position: relative;
overflow: hidden;
background-color: rgba(var(--foreground-color), 1);
border: solid thin rgba(var(--text-color), 0.1);
padding: 0;
& > div {
&:first-of-type {
padding: max(1rem, 3vw);
z-index: 2;
width: calc(100% - 4rem);
background: linear-gradient(
90deg,
rgba(var(--foreground-color), 1) 0%,
rgba(var(--foreground-color), 0) 100%
);
}
}
.illustration {
position: absolute;
height: 100%;
right: 0;
width: auto;
margin: 0 -1.5rem -1.5rem 0;
}
}
.task {
display: grid;
grid-template-columns: auto 1fr;
@ -1137,6 +1110,8 @@ ul {
#dashboard_page {
padding-bottom: 5rem;
grid-template-columns: auto;
overflow-y: auto;
align-items: flex-start;
}
.logo {
display: flex;
@ -1506,16 +1481,6 @@ ul {
margin: 0;
}
}
#best_interns_container {
margin-bottom: 1rem;
}
#edit_data_fig {
fill: rgba(var(--text-color), 0.6);
width: 60vw;
margin: 2rem 0;
}
#loading {
display: grid;
text-align: center;
@ -1677,6 +1642,7 @@ ul {
#projects_container__left {
height: 100%;
overflow-y: auto;
width: 100%;
.list-container {
height: 100%;
overflow-y: auto;
@ -1705,9 +1671,10 @@ input[type="date"] {
box-shadow: 0 0 0 0.1rem var(--accent-color);
}
}
.search__icon {
height: 1.2rem;
width: 1.2rem;
#requests_container {
padding: 0 1rem;
gap: 1.5rem;
overflow-y: auto;
}
#user_role {
justify-self: start;
@ -1749,9 +1716,11 @@ input[type="date"] {
}
}
.project__title {
margin-bottom: 0.8rem;
font-weight: 500;
color: inherit;
color: rgba(var(--text-color), 0.9);
&:hover {
color: var(--accent-color);
}
}
.project__complete-percent {
font-size: 0.8rem;
@ -1773,6 +1742,10 @@ input[type="date"] {
}
#settings_page {
align-content: flex-start;
& > * {
width: min(48rem, 100%);
margin: 0 auto;
}
}
@media only screen and (max-width: 640px) {
.hide-on-mobile,
@ -1889,16 +1862,17 @@ input[type="date"] {
#dashboard_page {
grid-template-columns: 1fr 18rem;
align-content: flex-start;
align-items: flex-start;
& > :not(#best_interns_container) {
grid-column: 1;
width: min(48rem, 100%);
margin: 0 auto;
}
}
#best_interns_container {
position: sticky;
top: 0;
grid-column: 2;
grid-row: 1 /4;
height: 100%;
}
#all_interns_page__header {
grid-template-columns: 1fr auto;
@ -1909,14 +1883,7 @@ input[type="date"] {
}
#projects_container__left {
width: 18rem;
background-color: rgba(var(--foreground-color), 0.5);
}
#edit_data_fig {
width: 16rem;
justify-self: center;
}
#project_explorer {
display: grid;
height: 100%;
@ -1989,7 +1956,13 @@ input[type="date"] {
font-size: 0.9rem;
grid-template-columns: 6rem 1fr 8rem;
}
#project_editing_panel {
#requests_container {
padding: 1rem;
grid-template-columns: 14rem 1fr;
& > :nth-child(2) {
width: min(48rem, 100%);
margin: 0 auto;
}
}
}

56
index.html
View File

@ -319,7 +319,7 @@
</nav>
<article id="sub_page_container">
<section id="dashboard_page" class="inner-page hidden">
<strip-select id="dashboard_view_selector" class="hide-on-desktop">
<strip-select id="dashboard_view_selector" class="hide-on-desktop justify-self-center">
<strip-option value="intern_view" selected>My tasks</strip-option>
<strip-option value="best_interns_container">Leaderboard</strip-option>
<strip-option value="projects_wrapper">Projects</strip-option>
@ -498,9 +498,27 @@
<ul id="admin_page__intern_list" class="list-container observe-empty-state"></ul>
<h4 class="empty-state">No interns added</h4>
</section>
<section class="flex flex-direction-column hidden">
<ul id="requests_list" class="list-container observe-empty-state"></ul>
<h4 class="empty-state">No pending requests</h4>
<section id="requests_container" class="grid hidden">
<div id="requests_container__filters" class="flex flex-direction-column gap-1">
<h5>Filters</h5>
<div class="grid gap-0-3">
<p>Category</p>
<sm-select id="filter_requests_by_category"></sm-select>
</div>
<div class="grid gap-0-3">
<p>Project</p>
<sm-select id="filter_requests_by_project"></sm-select>
</div>
<div class="flex gap-0-3">
<button class="button button--colored">Clear</button>
<button class="button button--primary flex-1">Filter</button>
</div>
</div>
<div class="flex flex-direction-column gap-1">
<h5>Pending</h5>
<ul id="requests_list" class="list-container observe-empty-state"></ul>
<h4 class="empty-state">No pending requests</h4>
</div>
</section>
</div>
</section>
@ -540,8 +558,8 @@
<div id="all_interns_page__header" class="grid gap-0-5">
<h2>Interns</h2>
<sm-input id="interns_page__search" placeholder="Search">
<svg class="icon search__icon" slot="icon" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" width="24" height="24">
<svg class="icon" slot="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
height="24">
<path fill="none" d="M0 0h24v24H0z" />
<path
d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15z" />
@ -1983,7 +2001,10 @@
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"> <path fill="none" d="M0 0h24v24H0z" /> <path d="M12.414 5H21a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h7.414l2 2zM4 7v12h16V7H4z" /> </svg>
</div>
<div class="flex space-between align-items-start">
<a class="project__title" href=${`#/project_explorer/project?id=${projectCode}&branch=mainLine`}>${projectName}</a>
<a class="flex align-center" href=${`#/project_explorer/project?id=${projectCode}&branch=mainLine`}>
<h4 class="project__title">${projectName}</h4>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"/></svg>
</a>
<button class="icon-only pin-project" title=${`${isPinned ? 'Unpin' : 'Pin'} this project`} onclick="pinProject(this)" data-pinned=${isPinned}>${pinIcon}</button>
</div>
<div class="progress-bar">
@ -1997,13 +2018,27 @@
renderElem(where, html`${projects.map(project => render.dashProject(project, where))} `)
},
internRequests() {
const requestCategories = new Set()
const requestProjects = new Set()
let requestCards = filterMap(RIBC.getTaskRequests().reverse(), (request) => {
if (Array.isArray(request.details) || !request.details.taskId) return
const [projectCode, branch, task] = request.details.taskId.split('_')
if (typeof RIBC.getTaskDetails(projectCode, branch, task) !== 'undefined')
if (typeof RIBC.getTaskDetails(projectCode, branch, task) !== 'undefined') {
requestCategories.add(RIBC.getTaskDetails(projectCode, branch, task).category)
requestProjects.add(projectCode)
return render.taskRequestCard(request)
}
})
renderElem(getRef('requests_list'), html`${requestCards}`)
if (requestCards.length) {
const categoryOptions = [...requestCategories].map(cat => html`<sm-option value=${cat}>${floGlobals.taskCategories[cat]}</sm-option>`);
renderElem(getRef('filter_requests_by_category'), html`${[html`<sm-option value='all' selected>All</sm-option>`, ...categoryOptions]}`)
const projectOptions = [...requestProjects].map(project => html`<sm-option value=${project}>${RIBC.getProjectDetails(project).projectName}</sm-option>`);
renderElem(getRef('filter_requests_by_project'), html`${[html`<sm-option value='all' selected>All</sm-option>`, ...projectOptions]}`)
getRef('requests_container__filters').classList.remove('hidden')
} else {
getRef('requests_container__filters').classList.add('hidden')
}
},
projectList(container, projects, isAdminList = false) {
renderElem(container, html`${projects.map(projectCode => render.projectCard(projectCode, isAdminList, container))}`)
@ -2319,7 +2354,6 @@
const card = e.target.closest('.temp-task')
const title = card.querySelector('.temp-task__title').value.trim();
const description = card.querySelector('.temp-task__description').value.trim();
const links = card.querySelector('.temp-task__links').value
const category = card.querySelector('.temp-task__category').value.trim();
const maxSlots = parseInt(card.querySelector('.temp-task__max-slots').value.trim());
const duration = parseInt(card.querySelector('.temp-task__duration').value.trim());
@ -2335,7 +2369,6 @@
const taskDetails = {
title,
description,
links,
category,
maxSlots,
duration,
@ -2363,8 +2396,7 @@
<div class="temp-task grid gap-0-5">
<sm-form style="--gap: 0.5rem;">
<sm-input class="temp-task__title" placeholder="Title" animate required></sm-input>
<sm-textarea class="temp-task__description" placeholder="Description" rows="4" required></sm-textarea>
<tags-input class="temp-task__links" placeholder="Related links(separate by comma)"></tags-input>
<sm-textarea class="temp-task__description" placeholder="Description" rows="6" required></sm-textarea>
<div class="grid gap-0-5" style="grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));">
<sm-select class="temp-task__category" label="Category: ">${categories}</sm-select>
<sm-input class="temp-task__max-slots flex-1" placeholder="Max slots available" type="number" animate> </sm-input>