Skip to content
Snippets Groups Projects
Commit 97d9a56e authored by Scott Berg's avatar Scott Berg Committed by Scott Berg
Browse files

Add single audit boilerplate.

parent db778d00
No related branches found
No related tags found
No related merge requests found
Pipeline #38416 passed
<mat-sidenav-container id="dars-container">
<mat-sidenav #auditPane id="dars-report-container" mode="over" position="end">
<button mat-button aria-label="Return to DARS audit list" color="primary" (click)="auditPane.close()">
<mat-icon>chevron_left</mat-icon>
Return to audit list
</button>
<div class="audit-wrapper">
<button id="audit-close" mat-button aria-label="Return to DARS audit list" color="primary" (click)="auditPane.close()">
<mat-icon>chevron_left</mat-icon>
Return to audit list
</button>
<mat-card id="audit">
<header class="no-horizontal-padding">
<div class="audit-metadata">
<div>
<p>Prepared: 10/31/18 - 10:24</p>
<p>Johnson, Jake John</p>
<p>Program Code: BS 112</p>
</div>
<div class="text-align-right">
<p>9071231234</p>
<p>Catalog Year: 20171</p>
<p>Alternate Catalog Year: 20191</p>
</div>
</div>
<h3 class="text-align-center">
Degree Audit Report System (DARS)
<br />
College of Letters and Science - Bachelor of Science (B.S)
<br />
Biology Major
</h3>
<div class="audit-section-controles">
<button mat-stroked-button color="primary">Open All Sections</button>
<button mat-stroked-button color="primary">Close All Sections</button>
</div>
</header>
<section>
<p class="tight faded">This audit was run using values not reflected in your current status. Parameters used when submitting this audit request:</p>
<br/>
<p class="tight faded">Honors Processing: Keep current status.</p>
<p class="tight faded">Courses Used: Using courses from Curse Guide Plan: (Plan name field blank in cobol program "stuinst.)</p>
</section>
<section>
<p>CL/YR: ALS 3</p>
<p>Advisors: Asen, Brian</p>
<p>HS Units:</p>
<div>
<p class="indent tight">LNG: 0.0 SPA 5.0</p>
<p class="indent tight">MATH: ALG 1.0 GEO 1.0 ADV 3.0</p>
<p class="indent tight">SCIENCE:</p>
<p class="indent tight">SOC STUD:</p>
</div>
</section>
<section class="text-align-center">
<h4 class="mat-h2 uppercase faded">At least one requirment has not been satisfied</h4>
<p class="mat-h2 faded">For more information about undergraduate L&S program see:</p>
<a href="#" mat-button color="primary">L&S Guide</a>
</section>
</mat-card>
</div>
</mat-sidenav>
<!-- Main DARS Content -->
......@@ -21,60 +79,64 @@
</div>
<div id="aduits">
<table class="audit-table" mat-table [dataSource]="dataSource">
<table class="audit-table" mat-table [dataSource]="dataSource">
<!-- View Column -->
<ng-container matColumnDef="view">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let audit">
<button mat-raised-button color="primary" [disabled]="audit.pending" (click)="auditPane.open()">View</button>
</td>
</ng-container>
<!-- View Column -->
<ng-container matColumnDef="view">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let audit">
<button mat-raised-button color="primary" [disabled]="audit.pending" (click)="auditPane.open()">View</button>
</td>
</ng-container>
<!-- School Column -->
<ng-container matColumnDef="school">
<th mat-header-cell *matHeaderCellDef>School/College</th>
<td mat-cell *matCellDef="let audit">{{audit.school}}</td>
</ng-container>
<!-- School Column -->
<ng-container matColumnDef="school">
<th mat-header-cell *matHeaderCellDef>School/College</th>
<td mat-cell *matCellDef="let audit">{{audit.school}}</td>
</ng-container>
<!-- Program Column -->
<ng-container matColumnDef="program">
<th mat-header-cell *matHeaderCellDef>Program of Study</th>
<td mat-cell *matCellDef="let audit">{{audit.program}}</td>
</ng-container>
<!-- Program Column -->
<ng-container matColumnDef="program">
<th mat-header-cell *matHeaderCellDef>Program of Study</th>
<td mat-cell *matCellDef="let audit">{{audit.program}}</td>
</ng-container>
<!-- Honors Column -->
<ng-container matColumnDef="honors">
<th mat-header-cell *matHeaderCellDef>Honors Status</th>
<td mat-cell *matCellDef="let audit">Keep current status</td>
</ng-container>
<!-- Honors Column -->
<ng-container matColumnDef="honors">
<th mat-header-cell *matHeaderCellDef>Honors Status</th>
<td mat-cell *matCellDef="let audit">Keep current status</td>
</ng-container>
<!-- Plan Column -->
<ng-container matColumnDef="plan">
<th mat-header-cell *matHeaderCellDef>Degree Plan</th>
<td mat-cell *matCellDef="let audit">Plan Title</td>
</ng-container>
<!-- Plan Column -->
<ng-container matColumnDef="plan">
<th mat-header-cell *matHeaderCellDef>Degree Plan</th>
<td mat-cell *matCellDef="let audit">Plan Title</td>
</ng-container>
<!-- Status Column -->
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef>Status</th>
<td mat-cell *matCellDef="let audit">Status goes here</td>
</ng-container>
<!-- Status Column -->
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef>Status</th>
<td mat-cell *matCellDef="let audit">Status goes here</td>
</ng-container>
<!-- Status Column -->
<ng-container matColumnDef="download">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let audit">
<button mat-raised-button>
<mat-icon>vertical_align_bottom</mat-icon>
</button>
</td>
</ng-container>
<!-- Status Column -->
<ng-container matColumnDef="download">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let audit">
<button mat-raised-button>
<mat-icon>vertical_align_bottom</mat-icon>
</button>
</td>
</ng-container>
<!-- Row definition -->
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<!-- Row definition -->
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<div style="text-align: center">
<button mat-stroked-button color="primary" style="margin: 20px auto; padding: 0 30px">Load More</button>
</div>
</div>
<div id="what-if-audits"></div>
......
.indent {
margin-left: 20px;
}
.tight {
margin: 2px auto;
}
.faded {
color: #616161;
}
.text-align-center {
text-align: center;
}
.text-align-right {
text-align: right;
}
.text-align-left {
text-align-last: left;
}
.uppercase {
text-transform: uppercase;
}
#dars-container {
width: 100%;
height: 100%;
......@@ -6,14 +34,71 @@
#dars-report-container {
width: 100%;
padding: 20px;
}
.audit-wrapper,
#dars-main {
max-width: 1200px;
margin: auto;
}
.audit-wrapper {
margin: 50px auto;
}
#audit {
padding: 20px 100px;
header {
h3 {
font-weight: 500;
font-size: 1.2rem;
}
}
}
#audit-close {
margin-bottom: 20px;
}
.audit-metadata {
display: flex;
justify-content: space-between;
line-height: 0.5rem;
}
.audit-section-controles {
text-align: center;
button {
margin: 20px 40px;
padding: 0 30px;
}
}
header,
section {
border-bottom: solid 1px #616161;
padding: 20px 75px;
&:last-child {
border-bottom: none;
}
&.no-padding {
padding: 0;
}
&.no-horizontal-padding {
padding-left: 0;
padding-right: 0;
}
&.no-vertical-padding {
padding-top: 0;
background-position: 0;
}
}
#dars-header-bar {
display: flex;
justify-content: space-between;
......@@ -26,7 +111,7 @@
.mat-header-row {
box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.25);
border-color: #fafafa;
background-color: #fafafa;
}
th {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment