Skip to content

Commit

Permalink
New item fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
@akariv
akariv committed Jan 28, 2024
1 parent a88820a commit 4c28f54
Show file tree
Hide file tree
Showing 4 changed files with 21 additions and 13 deletions.
1 change: 1 addition & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,3 +40,4 @@ testem.log
# System files
.DS_Store
Thumbs.db
*.secret
20 changes: 10 additions & 10 deletions projects/chronomaps/src/app/chronomap-page/add-new-bar/add-new-bar.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,49 +19,49 @@ <h2 [innerHtml]='chronomap.contributeMessage()' *ngIf='chronomap.contributeMessa
<h2>Let’s indeed start by choosing the format for this perspective:</h2>
</div>
<div class='content-types' [style.color]='chronomap.primaryColor()'>
<div class='content-type' (click)='selectCT("note")'>
<div class='content-type' (click)='selectCT("note", "sticky note")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"note"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Sticky Note</div>
</div>
<div class='content-type' (click)='selectCT("audio")'>
<div class='content-type' (click)='selectCT("audio", "audio clip")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"audio"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Audio clip</div>
</div>
<div class='content-type' (click)='selectCT("twitter")'>
<div class='content-type' (click)='selectCT("twitter", "Tweet")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"twitter"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Twitter post</div>
</div>
<div class='content-type' (click)='selectCT("instagram")'>
<div class='content-type' (click)='selectCT("instagram", "Instagram post")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"instagram"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Instagram post</div>
</div>
<div class='content-type' (click)='selectCT("video")'>
<div class='content-type' (click)='selectCT("video", "video clip")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"video"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Youtube video</div>
</div>
<div class='content-type' (click)='selectCT("wikipedia")'>
<div class='content-type' (click)='selectCT("wikipedia", "Wikipedia snippet")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"wikipedia"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>Wikipedia article</div>
</div>
<div class='content-type' (click)='selectCT("news")'>
<div class='content-type' (click)='selectCT("news", "news article")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"news"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
<div class='name'>News</div>
</div>
<div class='content-type' (click)='selectCT("image")'>
<div class='content-type' (click)='selectCT("image", "image")'>
<div class='icon' [style.border-color]='chronomap.primaryColor()'>
<app-media-icon [type]='"image"' [color]="chronomap.primaryColor()"></app-media-icon>
</div>
Expand All @@ -86,7 +86,7 @@ <h2>Position the camera on your location of choice</h2>
<div class='slide' [class.pre]='slide < 2' [class.post]='slide > 2'>
<div class='header'>
<h1 class='indented'>When?</h1>
<h2>The exact year is less important than the order of events</h2>
<h2>Drag the timeline left and right to position your {{contentTypeName}} in time. Zoom the timeline (using the scroll wheel or the + & - buttons) to adjust between years, days, hours and minutes.</h2>
</div>
<div class='bottom'>
<button class='next-button' *ngIf='selectedDate' (click)='slide = slide + 1;' [style.color]='chronomap.primaryColor()' [style.border-color]='chronomap.secondaryColor() + "40"'>
Expand All @@ -100,7 +100,7 @@ <h2>The exact year is less important than the order of events</h2>
<div class='slide' [class.pre]='slide < 3' [class.post]='slide > 3'>
<div class='header'>
<h1 class='indented'>Add The Details</h1>
<h2>Now that we know time and space, let’s add the details of your {{contentType}}</h2>
<h2>Now that we know time and space, let’s add the details of your {{contentTypeName}}</h2>
</div>
<iframe [src]='iframeSrc' frameborder='0' onmousewheel='' width='100%' height='100%' *ngIf='iframeSrc'></iframe>
</div>
Expand Down
9 changes: 7 additions & 2 deletions projects/chronomaps/src/app/chronomap-page/add-new-bar/add-new-bar.component.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
overflow-y: scroll;
padding: 16px;
.no-scrollbars;
height: 242px;
height: 309px;
&.maximized {
height: 80vh;
}
Expand Down Expand Up @@ -119,7 +119,12 @@
padding-bottom: 8px;
&:last-child {
border-bottom: 0.5px solid @gray1;
margin-bottom: 32px;
.desktop({
margin-bottom: 32px;
});
.mobile({
margin-bottom: 16px;
});
}
}
}
Expand Down
4 changes: 3 additions & 1 deletion projects/chronomaps/src/app/chronomap-page/add-new-bar/add-new-bar.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ export class AddNewBarComponent implements OnInit {
contributeMessage: any = '';
slide_ = 0;
contentType = '';
contentTypeName = '';
selectedDate: string;
selectedGeo: string;
mapSubscription: Subscription | null = null;
Expand All @@ -46,8 +47,9 @@ export class AddNewBarComponent implements OnInit {
this.nonce = '' + (Math.floor(Math.random() * 1000000000));
}

selectCT(ct: string) {
selectCT(ct: string, ctName: string) {
this.contentType = ct;
this.contentTypeName = ctName;
this.slide += 1;
}

Expand Down

0 comments on commit 4c28f54

Please sign in to comment.