Skip to content
Snippets Groups Projects
Commit 4948b4a7 authored by pnogal's avatar pnogal Committed by Paulina Nogal
Browse files

fix after rebasing

parent eead960f
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/app/app.component.html
+ 123
− 73
View file @ 4948b4a7
...@@ -3,87 +3,137 @@ ...@@ -3,87 +3,137 @@
<cse-navigation></cse-navigation> <cse-navigation></cse-navigation>
</header> </header>
<main> <main>
<mat-sidenav-container class="example-container" hasBackdrop="false"> <mat-sidenav-container class="example-container" hasBackdrop="false" style="height: 100vh;">
<mat-sidenav #rightAddCourse2 mode="over" position="end"> <mat-sidenav mode="over" position="end" #rightAddCourse>
<mat-toolbar color="primary" class="dialog-toolbar"> <mat-drawer-container>
<button mat-button class="close-btn" (click)="closeSidenav(rightAddCourse2)"><i class="material-icons">clear</i></button> <mat-drawer mode="side" position="start" #rightAddCourse2>
<span class="dialog-toolbar-title">Add course to degree plan</span>
</mat-toolbar>
Course Details
<!-- <cse-course-details></cse-course-details> -->
</mat-sidenav>
<mat-sidenav-content>
<mat-sidenav-container>
<mat-sidenav #rightAddCourse class="add-sidenav1" mode="over" position="end">
<mat-toolbar color="primary" class="dialog-toolbar"> <mat-toolbar color="primary" class="dialog-toolbar">
<span class="dialog-toolbar-title">Course Search</span> <button mat-button class="close-btn" (click)="rightAddCourse2.close()"><i class="material-icons">clear</i></button>
<button mat-button class="close-btn" (click)="closeSidenav(rightAddCourse)"><i class="material-icons">clear</i></button> <span class="dialog-toolbar-title">Add course to degree plan</span>
</mat-toolbar> </mat-toolbar>
<div fxLayout="column" fxLayoutAlign="space-around none" style="padding: 12px 22px;"> <div id="course-details-content" class="mat-typography">
<mat-form-field> <div fxLayout="row">
<mat-select placeholder="Term" required> <div fxLayout="row" fxLayout.lt-md="column" fxFlex="100" fxLayoutGap="10px" class="course-details-header">
<mat-option *ngFor="let term of coursesData$ | async" [value]="term"> <div fxFlex="50" class="course-detail-title" fxLayoutAlign="start start">
{{ term[0].termCode | getTermDescription }} <h3>English 162<span class="course-detail-subtitle">Shakespeare</span></h3>
</mat-option> </div>
<!-- <mat-option>Spring 2019</mat-option> <div fxFlex="50" class="course-detail-title" fxLayoutAlign="end start">
<mat-option>Summer 2019</mat-option> <button mat-raised-button class="btn-primary mat-button" aria-label="Add course to plan">Add course</button>
<mat-option>Fall 2019</mat-option> </div>
<mat-option>Spring 2020</mat-option> </div>
<mat-option>Summer 2020</mat-option> --> </div>
</mat-select> <div>
<!-- <mat-error *ngIf="terms.hasError('required')">Please select term</mat-error> --> <!-- <p>Introduction to several of Shakespare's most popular plays and their relation to other works of English and American literature.</p> -->
</mat-form-field>
<mat-form-field> <p><span class="semi-bold">Enroll Info: </span>None</p>
<mat-select placeholder="Subject" [formControl]="" required> <p><span class="semi-bold">Requisites: </span>None</p>
<mat-option>Afro-American Studies</mat-option> <ul class="courseDetails-list">
<mat-option>Agricultural and Applied Economics</mat-option> <li><span class="semi-bold">Credits:</span> 3</li>
<mat-option>Agroecology</mat-option> <li><span class="semi-bold">Level: </span>
<mat-option>Agronomy</mat-option> <span>Elementary</span>
<mat-option>Air Force Aerospace Studies</mat-option> </li>
<mat-option>American Indian Studies</mat-option> <li><span class="semi-bold">Breadth: </span>
<mat-option>Anatomy</mat-option> <span>Literature</span>
<mat-option>Anatomy & Physiology</mat-option> </li>
</mat-select> <li><span class="semi-bold">L&amp;S Credit Type:</span>
<!-- <mat-error *ngIf="terms.hasError('required')">Please select an existing subject or 'All'.</mat-error> --> Counts as LAS credit (L&S)
</mat-form-field> </li>
</ul>
<ul class="courseDetails-list">
<li><span class="semi-bold">Last Taught: </span>Fall 2018</li>
<li><span class="semi-bold">Typically Offered: </span>Fall, Spring, Summer</li>
</ul>
<mat-form-field class="example-full-width"> <p><span class="semi-bold">Subject Notes:</span><br>
<input matInput placeholder="Subject, number" value=""> <span class="subject-notes"></span></p>
</mat-form-field>
</div> </div>
<div class="search-results-toolbar mat-typography" fxLayout="row" fxLayoutAlign="space-between center" style="padding: 12px 22px; background-color: #EDF1F3"> <div class="course-details-footer">
<h3 style="margin: 0px;">7 of 7 results</h3> <p class="semi-bold course-detail-title">English Information:</p>
<span class="mat-button">Reset Search</span> <div fxLayout="row">
<div fxLayout="row" fxFlex="100" fxLayoutGap="10px">
<div fxFlex="100" fxLayout.lt-sm="column" class="mat-dialog-actions" fxLayoutAlign="start center" fxLayoutAlign.lt-sm="start start">
<a class="md-primary btn-link mat-button" href="">Website</a>
<a class="md-primary btn-link mat-button" href="">Undergraduate Info</a>
<a class="md-primary btn-link mat-button" href="">Graduate Info</a>
</div>
</div>
</div>
</div> </div>
</div>
</mat-drawer>
<mat-drawer-conntent class="course-search-pane">
<mat-toolbar color="primary" class="dialog-toolbar">
<span class="dialog-toolbar-title">Course Search</span>
<button mat-button class="close-btn" (click)="rightAddCourse.close(); rightAddCourse2.close()"><i class="material-icons">clear</i></button>
</mat-toolbar>
<div id="course-search-results" fxLayout="column" fxLayoutAlign="space-around none" style="padding: 12px 22px;"> <form class="add-course-form" fxLayout="column" fxLayoutAlign="space-around none" style="padding: 12px 22px;">
<mat-form-field> <mat-form-field>
<mat-select placeholder="Order by"> <input type="text" placeholder="Term" aria-label="Term" matInput [formControl]="" [matAutocomplete]="term">
<mat-option>Relevance</mat-option> <mat-autocomplete #term="matAutocomplete">
<mat-option>Subject</mat-option> <mat-option *ngFor="let term of coursesData$ | async" [value]="term[0].termCode | getTermDescription">
<mat-option>Catalog Number</mat-option> {{ term[0].termCode | getTermDescription }}
</mat-select> </mat-option>
</mat-form-field> </mat-autocomplete>
</mat-form-field>
<cse-course-item (click)="rightAddCourse2.toggle()" <mat-form-field>
style="padding: 8px; <input type="text" placeholder="Subject" aria-label="Subject" matInput [formControl]="" [matAutocomplete]="subject">
border: solid 1px #FDFDFD; <mat-autocomplete #subject="matAutocomplete">
background-color: #FDFDFD; <mat-option>Afro-American Studies</mat-option>
border-radius: 5px; <mat-option>Agricultural and Applied Economics</mat-option>
font-family: 'Helvetica Neue', Georgia, Helvetica, Arial, sans-serif; <mat-option>Agroecology</mat-option>
font-size: 14px; <mat-option>Agronomy</mat-option>
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1); <mat-option>Air Force Aerospace Studies</mat-option>
cursor: pointer;"> <mat-option>American Indian Studies</mat-option>
Chem 101 <mat-option>Anatomy</mat-option>
</cse-course-item> <mat-option>Anatomy & Physiology</mat-option>
</div> </mat-autocomplete>
</mat-sidenav> <!-- <mat-error *ngIf="terms.hasError('required')">Please select an existing subject or 'All'.</mat-error> -->
<mat-sidenav-content> </mat-form-field>
<router-outlet></router-outlet>
</mat-sidenav-content> <mat-form-field class="example-full-width">
</mat-sidenav-container> <input matInput placeholder="Subject, number" value="">
</mat-form-field>
</form>
<div class="search-results-toolbar mat-typography" fxLayout="row" fxLayoutAlign="space-between center" style="padding: 12px 22px; background-color: #EDF1F3">
<h3 style="margin: 0px;">7 of 7 results</h3>
<span class="mat-button">Reset Search</span>
</div>
<div id="course-search-results" fxLayout="column" fxLayoutAlign="space-around none" style="padding: 12px 22px;">
<mat-form-field>
<mat-select placeholder="Order by">
<mat-option>Relevance</mat-option>
<mat-option>Subject</mat-option>
<mat-option>Catalog Number</mat-option>
</mat-select>
</mat-form-field>
<cse-course-item (click)="rightAddCourse2.toggle()">
<div class="course-item">
<p class="course-number">ENGL 162</p>
<p class="course-title">Shakespeare</p>
</div>
<div class="course-item">
<p class="course-number">PHILOS 101</p>
<p class="course-title">Introduction to Philosophy</p>
</div>
<div class="course-item">
<p class="course-number">Math 135</p>
<p class="course-title">Algebraic Reasoning for Teaching Math</p>
</div>
</cse-course-item>
</div>
</mat-drawer-conntent>
</mat-drawer-container>
</mat-sidenav>
<mat-sidenav-content>
<router-outlet></router-outlet>
</mat-sidenav-content> </mat-sidenav-content>
</mat-sidenav-container> </mat-sidenav-container>
</main> </main>
\ No newline at end of file
src/app/app.component.scss
+ 14
− 1
View file @ 4948b4a7
@import 'assets/material-theme.scss';
@import 'shared/components/course-details/course-details.component.scss';
@import 'degree-planner/shared/course-item/course-item.component.scss';
header { header {
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -18,4 +22,13 @@ main { ...@@ -18,4 +22,13 @@ main {
.add-sidenav1 { .add-sidenav1 {
width:380px; width:380px;
} }
\ No newline at end of file
#course-details-content {
padding: 0 25px 25px 25px;
}
.course-search-pane {
width: 340px;
height: 100vh;
}
src/app/app.module.ts
+ 27
− 22
View file @ 4948b4a7
...@@ -12,29 +12,34 @@ import { CoreModule } from '@app/core/core.module'; ...@@ -12,29 +12,34 @@ import { CoreModule } from '@app/core/core.module';
import { SharedModule } from '@app/shared/shared.module'; import { SharedModule } from '@app/shared/shared.module';
import { HeaderComponent } from './core/header/header.component'; import { HeaderComponent } from './core/header/header.component';
import { SidenavService } from './core/service/sidenav.service'; import { SidenavService } from './core/service/sidenav.service';
import { degreePlannerReducer } from '@app/degree-planner/store/reducer'; import { degreePlannerReducer } from '@app/degree-planner/reducer';
import { DegreePlanEffects } from '@app/degree-planner/store/effects/plan.effects'; import { DegreePlanEffects } from '@app/degree-planner/effects/plan.effects';
import { NoteEffects } from '@app/degree-planner/store/effects/note.effects'; import { NoteEffects } from '@app/degree-planner/effects/note.effects';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
@NgModule({ @NgModule({
imports: [ imports: [
StoreModule.forRoot({ StoreModule.forRoot({
degreePlanner: degreePlannerReducer, degreePlanner: degreePlannerReducer
}), }),
EffectsModule.forRoot([DegreePlanEffects, NoteEffects]), EffectsModule.forRoot([DegreePlanEffects, NoteEffects]),
BrowserModule, BrowserModule,
BrowserAnimationsModule, BrowserAnimationsModule,
HttpClientModule, HttpClientModule,
CoreModule, CoreModule,
SharedModule, SharedModule,
AppRoutingModule, AppRoutingModule,
StoreDevtoolsModule.instrument({ MatAutocompleteModule,
maxAge: 5, StoreDevtoolsModule.instrument({
}), maxAge: 5
], }),
declarations: [AppComponent, HeaderComponent], ],
providers: [SidenavService], declarations: [
bootstrap: [AppComponent], AppComponent,
schemas: [CUSTOM_ELEMENTS_SCHEMA], HeaderComponent
],
providers: [ SidenavService ],
bootstrap: [ AppComponent ],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
}) })
export class AppModule {} export class AppModule {}
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