From 1c19b139c8d0adad8ce14174d8bffe71dace4a9c Mon Sep 17 00:00:00 2001 From: Jason Wall Date: Mon, 20 Jul 2020 17:34:02 -0400 Subject: [PATCH] add action button at the bottom add font size and family variables --- app/db/src/app/app.component.ts | 18 +- app/db/src/app/app.module.ts | 2 +- .../components/passage/passage.component.html | 85 ++++++ .../{passage.scss => passage.component.scss} | 17 +- .../{passage.ts => passage.component.ts} | 6 +- .../search/components/passage/passage.html | 41 --- .../components/search-page/search.page.html | 17 +- .../components/search-page/search.page.scss | 22 +- .../components/search-page/search.page.ts | 6 +- app/db/src/app/services/app.service.ts | 29 ++- app/db/src/styles.scss | 241 +----------------- app/db/src/styles/app.scss | 111 ++++++++ app/db/src/styles/fonts.scss | 174 +++++++++++++ 13 files changed, 454 insertions(+), 315 deletions(-) create mode 100644 app/db/src/app/search/components/passage/passage.component.html rename app/db/src/app/search/components/passage/{passage.scss => passage.component.scss} (71%) rename app/db/src/app/search/components/passage/{passage.ts => passage.component.ts} (98%) delete mode 100644 app/db/src/app/search/components/passage/passage.html create mode 100644 app/db/src/styles/app.scss create mode 100644 app/db/src/styles/fonts.scss diff --git a/app/db/src/app/app.component.ts b/app/db/src/app/app.component.ts index 1a74a446..225baec2 100644 --- a/app/db/src/app/app.component.ts +++ b/app/db/src/app/app.component.ts @@ -12,10 +12,16 @@ import { MatSidenav } from '@angular/material/sidenav'; styleUrls: ['./app.component.scss'], }) export class AppComponent implements AfterViewInit { - public savedPages$ = this.appService.select((state) => state.savedPages); - public mainPages$ = this.appService.select((state) => state.mainPages); + savedPages$ = this.appService.select((state) => state.savedPages); + mainPages$ = this.appService.select((state) => state.mainPages); + fontSize$ = this.appService.select( + (state) => state.displaySettings.fontSize + 'pt' + ); + fontFamily$ = this.appService.select( + (state) => state.displaySettings.fontFamily + ); - public isHandset$: Observable = this.breakpointObserver + isHandset$: Observable = this.breakpointObserver .observe(Breakpoints.Handset) .pipe( map((result) => result.matches), @@ -30,6 +36,12 @@ export class AppComponent implements AfterViewInit { private breakpointObserver: BreakpointObserver ) { this.appService.getSavedPages(); + this.fontSize$.subscribe((size) => { + document.documentElement.style.setProperty('--font-size', size); + }); + this.fontFamily$.subscribe((family) => { + document.documentElement.style.setProperty('--font-family', family); + }); } ngAfterViewInit(): void { diff --git a/app/db/src/app/app.module.ts b/app/db/src/app/app.module.ts index d21008ac..0c27cbc2 100644 --- a/app/db/src/app/app.module.ts +++ b/app/db/src/app/app.module.ts @@ -8,7 +8,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http'; import { SearchPage } from './search/components/search-page/search.page'; -import { PassageComponent } from './search/components/passage/passage'; +import { PassageComponent } from './search/components/passage/passage.component'; import { MatCheckboxModule } from '@angular/material/checkbox'; import { MatButtonModule } from '@angular/material/button'; diff --git a/app/db/src/app/search/components/passage/passage.component.html b/app/db/src/app/search/components/passage/passage.component.html new file mode 100644 index 00000000..94e48343 --- /dev/null +++ b/app/db/src/app/search/components/passage/passage.component.html @@ -0,0 +1,85 @@ +
+ menu_book + {{ ref }} + +
+
+
+

Chapter {{ ch.ch }}

+ +

+ {{ para.p.h }} +

+ +

+ + {{ vs.v }}. + + {{ w.t }}{{ + w.t + }}
+ +

+ +
+
+
+ + + + + + + + + + + + +
diff --git a/app/db/src/app/search/components/passage/passage.scss b/app/db/src/app/search/components/passage/passage.component.scss similarity index 71% rename from app/db/src/app/search/components/passage/passage.scss rename to app/db/src/app/search/components/passage/passage.component.scss index 1c39503b..9b58a676 100644 --- a/app/db/src/app/search/components/passage/passage.scss +++ b/app/db/src/app/search/components/passage/passage.component.scss @@ -2,16 +2,19 @@ background-color: var(--passage-color-primary); } -.as-paragraph { - display: block; - margin-bottom: 1rem; +.card-close-button { + color: var(--passage-color-accent); +} + +.card-actions { + color: var(--passage-color-primary); +} + +.as-inline { + display: inline; } .paragraph-heading { font-family: var(--passage-heading-font-family); font-weight: 600; } - -.card-close-button { - color: var(--passage-color-accent); -} diff --git a/app/db/src/app/search/components/passage/passage.ts b/app/db/src/app/search/components/passage/passage.component.ts similarity index 98% rename from app/db/src/app/search/components/passage/passage.ts rename to app/db/src/app/search/components/passage/passage.component.ts index 67bc91b5..89fb40f7 100644 --- a/app/db/src/app/search/components/passage/passage.ts +++ b/app/db/src/app/search/components/passage/passage.component.ts @@ -6,8 +6,8 @@ import { Paragraph } from '../../../models/app-state'; @Component({ selector: 'app-passage', - templateUrl: 'passage.html', - styleUrls: ['./passage.scss'], + templateUrl: 'passage.component.html', + styleUrls: ['./passage.component.scss'], preserveWhitespaces: true, }) export class PassageComponent extends CardComponent implements OnInit { @@ -42,6 +42,8 @@ export class PassageComponent extends CardComponent implements OnInit { // cardContextMenu(this.profileService, this._actionSheet, this._pagesSvc, this._alertCtrl, this.cardItem); } + copy() {} + next() { const lastVerseForEnd = this.ref.Section.end.book.chapters[ parseInt(this.ref.Section.end.chapter, 10) diff --git a/app/db/src/app/search/components/passage/passage.html b/app/db/src/app/search/components/passage/passage.html deleted file mode 100644 index edb2dc5c..00000000 --- a/app/db/src/app/search/components/passage/passage.html +++ /dev/null @@ -1,41 +0,0 @@ -
- menu_book - {{ ref }} - -
-
-
-

Chapter {{ ch.ch }}

- - -

- {{ para.p.h }} -

- - {{ vs.v }}. - - {{ w.t }}{{ w.t }}
- - - -
-
diff --git a/app/db/src/app/search/components/search-page/search.page.html b/app/db/src/app/search/components/search-page/search.page.html index 12eda9f0..63e923cf 100644 --- a/app/db/src/app/search/components/search-page/search.page.html +++ b/app/db/src/app/search/components/search-page/search.page.html @@ -23,10 +23,9 @@ - - -
- +
+ + -
- - -   - + + +   + +
diff --git a/app/db/src/app/search/components/search-page/search.page.scss b/app/db/src/app/search/components/search-page/search.page.scss index b5b04f25..67a25559 100644 --- a/app/db/src/app/search/components/search-page/search.page.scss +++ b/app/db/src/app/search/components/search-page/search.page.scss @@ -1,15 +1,8 @@ -.full-width { - width: 100%; -} - mat-card { - max-width: 400px; - margin: 1em auto; + max-width: 800px; + margin: 1.5rem auto; padding: 0; } -mat-toolbar { - padding-left: 12px; -} .search-bar { width: 100%; @@ -24,7 +17,7 @@ mat-toolbar { border-radius: 0.2rem; height: auto; font-size: 1.2rem; - font-family: var(--font-family); + font-family: "Roboto Condensed"; line-height: 2.2rem; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); @@ -32,6 +25,11 @@ mat-toolbar { 0 1px 5px 0 rgba(0, 0, 0, 0.12); touch-action: manipulation; } + +.search-bar-input:focus { + outline: 0; +} + .searchbar-search-icon { position: absolute; background-repeat: no-repeat; @@ -42,3 +40,7 @@ mat-toolbar { width: 21px; height: 21px; } + +.search-content { + height: calc(100vh - 4rem); +} diff --git a/app/db/src/app/search/components/search-page/search.page.ts b/app/db/src/app/search/components/search-page/search.page.ts index df453bae..d19f11fe 100644 --- a/app/db/src/app/search/components/search-page/search.page.ts +++ b/app/db/src/app/search/components/search-page/search.page.ts @@ -37,9 +37,9 @@ export class SearchPage implements OnInit { map((value) => this.getSearchItems(value)) ); - this.appService.state$.subscribe((state) => { - console.log(state); - }); + // this.appService.state$.subscribe((state) => { + // console.log(state); + // }); } //#region Search diff --git a/app/db/src/app/services/app.service.ts b/app/db/src/app/services/app.service.ts index 04691951..edb7ffa7 100644 --- a/app/db/src/app/services/app.service.ts +++ b/app/db/src/app/services/app.service.ts @@ -32,7 +32,7 @@ const initialState: AppState = { showStrongsAsModal: false, appendCardToBottom: true, insertCardNextToItem: true, - fontSize: 11, + fontSize: 12, fontFamily: 'PT Serif', showVersesOnNewLine: false, showVerseNumbers: false, @@ -66,6 +66,14 @@ type AppAction = | { type: 'UPDATE_PARAGRAPHS'; paragraphs: HashTable; + } + | { + type: 'UPDATE_FONT_SIZE'; + size: number; + } + | { + type: 'UPDATE_FONT_FAMILY'; + family: string; }; function reducer(state: AppState, action: AppAction): AppState { @@ -113,6 +121,25 @@ function reducer(state: AppState, action: AppAction): AppState { paragraphs: action.paragraphs, }; } + + case 'UPDATE_FONT_SIZE': { + return { + ...state, + displaySettings: { + ...state.displaySettings, + fontSize: action.size, + }, + }; + } + case 'UPDATE_FONT_FAMILY': { + return { + ...state, + displaySettings: { + ...state.displaySettings, + fontFamily: action.family, + }, + }; + } } } diff --git a/app/db/src/styles.scss b/app/db/src/styles.scss index 5fbf00cc..e57c5169 100644 --- a/app/db/src/styles.scss +++ b/app/db/src/styles.scss @@ -1,7 +1,10 @@ // Custom Theming for Angular Material // For more information: https://material.angular.io/guide/theming @import "~@angular/material/theming"; + // Plus imports for other components in your app. +@import "./styles/app.scss"; +@import "./styles/fonts.scss"; // Include the common styles for Angular Material. We include this here so that you only // have to load a single css file for Angular Material in your app. @@ -35,241 +38,3 @@ $db-theme: mat-light-theme( @include angular-material-theme($db-theme); /* You can add global styles to this file, and also import other style files */ - -html, -body { - --font-family: Roboto, Helvetica, Arial, sans-serif; - --primary-color: #333; - - --card-font: Roboto, Helvetica, Arial, sans-serif; - --card-border-radius: 0.2em; - --card-title: #fff; - --card-color: #000; - - --passage-color-primary: rgb(25, 68, 109); - --passage-color-accent: rgb(122, 166, 206); - --passage-heading-font-family: "Roboto Condensed"; - - height: 100%; - margin: 0; - font-family: var(--font-family); - font-size: 11pt; -} - -.card-title { - font-size: 1.5rem; - font-family: "Roboto Condensed"; - color: var(--card-title); - padding: 1rem; - border-top-left-radius: var(--card-border-radius); - border-top-right-radius: var(--card-border-radius); - - > mat-icon { - font-size: 1.8rem; - } - - span { - line-height: 100%; - vertical-align: text-top; - padding-left: 1rem; - } -} - -.card-content { - padding: 1rem; - color: var(--card-color); -} - -.card-close-button { - background-color: transparent; - border: 0; - float: right; - margin-top: -0.2rem; - cursor: pointer; - mat-icon { - font-size: 2.3rem; - } -} - -mat-toolbar { - -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), - 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); - box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); -} -a { - cursor: pointer; - border-bottom: 1px dotted #bbb; -} - -@font-face { - font-family: "Merriweather"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/merriweather-v19-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("Merriweather Regular"), local("Merriweather-Regular"), - url("./assets/fonts/merriweather-v19-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/merriweather-v19-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/merriweather-v19-latin-regular.woff") format("woff"), - /* Modern Browsers */ - url("./assets/fonts/merriweather-v19-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/merriweather-v19-latin-regular.svg#Merriweather") - format("svg"); - /* Legacy iOS */ -} - -/* pt-sans-regular - latin */ -@font-face { - font-family: "PT Sans"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/pt-sans-v9-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("PT Sans"), local("PTSans-Regular"), - url("./assets/fonts/pt-sans-v9-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/pt-sans-v9-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/pt-sans-v9-latin-regular.woff") format("woff"), - /* Modern Browsers */ url("./assets/fonts/pt-sans-v9-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/pt-sans-v9-latin-regular.svg#PTSans") format("svg"); - /* Legacy iOS */ -} - -@font-face { - font-family: "PT Serif"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/pt-serif-v9-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("PT Serif"), local("PTSerif-Regular"), - url("./assets/fonts/pt-serif-v9-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/pt-serif-v9-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/pt-serif-v9-latin-regular.woff") format("woff"), - /* Modern Browsers */ url("./assets/fonts/pt-serif-v9-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/pt-serif-v9-latin-regular.svg#PTSerif") format("svg"); - /* Legacy iOS */ -} - -/* open-sans-regular - latin */ -@font-face { - font-family: "Open Sans"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/open-sans-v15-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("Open Sans Regular"), local("OpenSans-Regular"), - url("./assets/fonts/open-sans-v15-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/open-sans-v15-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/open-sans-v15-latin-regular.woff") format("woff"), - /* Modern Browsers */ url("./assets/fonts/open-sans-v15-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/open-sans-v15-latin-regular.svg#OpenSans") - format("svg"); - /* Legacy iOS */ -} - -/* roboto-regular - latin */ -@font-face { - font-family: "Roboto"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/roboto-v18-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("Roboto"), local("Roboto-Regular"), - url("./assets/fonts/roboto-v18-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/roboto-v18-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/roboto-v18-latin-regular.woff") format("woff"), - /* Modern Browsers */ url("./assets/fonts/roboto-v18-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/roboto-v18-latin-regular.svg#Roboto") format("svg"); - /* Legacy iOS */ -} - -/* roboto-500 - latin */ -@font-face { - font-family: "Roboto Bold"; - font-style: normal; - font-weight: 500; - src: url("./assets/fonts/roboto-v18-latin-500.eot"); - /* IE9 Compat Modes */ - src: local("Roboto Medium"), local("Roboto-Medium"), - url("./assets/fonts/roboto-v18-latin-500.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/roboto-v18-latin-500.woff2") - format("woff2"), - /* Super Modern Browsers */ url("./assets/fonts/roboto-v18-latin-500.woff") - format("woff"), - /* Modern Browsers */ url("./assets/fonts/roboto-v18-latin-500.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/roboto-v18-latin-500.svg#Roboto") format("svg"); - /* Legacy iOS */ -} - -/* roboto-condensed-regular - latin */ -@font-face { - font-family: "Roboto Condensed"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/roboto-condensed-v16-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), - url("./assets/fonts/roboto-condensed-v16-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/roboto-condensed-v16-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/roboto-condensed-v16-latin-regular.woff") - format("woff"), - /* Modern Browsers */ - url("./assets/fonts/roboto-condensed-v16-latin-regular.ttf") - format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/roboto-condensed-v16-latin-regular.svg#RobotoCondensed") - format("svg"); - /* Legacy iOS */ -} - -/* inconsolata-regular - latin */ -@font-face { - font-family: "Inconsolata"; - font-style: normal; - font-weight: 400; - src: url("./assets/fonts/inconsolata-v16-latin-regular.eot"); - /* IE9 Compat Modes */ - src: local("Inconsolata Regular"), local("Inconsolata-Regular"), - url("./assets/fonts/inconsolata-v16-latin-regular.eot?#iefix") - format("embedded-opentype"), - /* IE6-IE8 */ url("./assets/fonts/inconsolata-v16-latin-regular.woff2") - format("woff2"), - /* Super Modern Browsers */ - url("./assets/fonts/inconsolata-v16-latin-regular.woff") format("woff"), - /* Modern Browsers */ - url("./assets/fonts/inconsolata-v16-latin-regular.ttf") format("truetype"), - /* Safari, Android, iOS */ - url("./assets/fonts/inconsolata-v16-latin-regular.svg#Inconsolata") - format("svg"); - /* Legacy iOS */ -} diff --git a/app/db/src/styles/app.scss b/app/db/src/styles/app.scss new file mode 100644 index 00000000..83fda4ea --- /dev/null +++ b/app/db/src/styles/app.scss @@ -0,0 +1,111 @@ +html { + --font-family: Roboto, Helvetica, Arial, sans-serif; + --font-size: 12pt; + --primary-color: #333; + + --card-font: Roboto, Helvetica, Arial, sans-serif; + --card-border-radius: 0.2em; + --card-title: #fff; + --card-color: #000; + --card-actions-background-color: whitesmoke; + + --passage-color-primary: rgb(25, 68, 109); + --passage-color-accent: rgb(122, 166, 206); + --passage-heading-font-family: "Roboto Condensed"; +} + +body { + height: 100%; + margin: 0; + font-family: "Roboto Condensed"; + font-size: var(--font-size); +} + +.card-title { + font-size: 1.5rem; + font-family: "Roboto Condensed"; + color: var(--card-title); + padding: 1rem; + border-top-left-radius: var(--card-border-radius); + border-top-right-radius: var(--card-border-radius); + + > mat-icon { + font-size: 1.8rem; + } + + span { + line-height: 100%; + vertical-align: text-top; + padding-left: 1rem; + } +} + +.card-content { + padding: 1rem; + color: var(--card-color); + font-size: var(--font-size); + font-family: var(--font-family); + line-height: calc(var(--font-size) + 0.5rem); +} + +.card-close-button { + float: right; + margin-right: 0.8rem !important; + mat-icon { + font-size: 2.3rem; + line-height: 1rem !important; + } +} + +.card-actions { + clear: both; + width: 100%; + height: 3.5rem; + color: var(--card-color); + background-color: var(--card-actions-background-color); + border-bottom-left-radius: var(--card-border-radius); + border-bottom-right-radius: var(--card-border-radius); + mat-icon { + font-size: 1.7rem; + line-height: 2.4rem !important; + } +} + +.card-actions-right { + float: right; + margin-right: 0.5rem; +} + +.card-actions-left { + float: left; + margin-left: 0.5rem; +} + +mat-toolbar { + padding-left: 12px; + -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), + 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); +} + +a { + cursor: pointer; + border-bottom: 1px dotted #bbb; +} + +.full-width { + width: 100%; +} + +mat-h2, +.mat-title, +.mat-typography h2 { + font-size: calc(var(--font-size) * 1.7) !important; + line-height: calc(var(--font-size) * 1.9) !important; +} +.mat-h3, +.mat-subheading-2, +.mat-typography h3 { + font-size: calc(var(--font-size) * 1.2) !important; + line-height: calc(var(--font-size) * 1.4) !important; +} diff --git a/app/db/src/styles/fonts.scss b/app/db/src/styles/fonts.scss new file mode 100644 index 00000000..14d4fb38 --- /dev/null +++ b/app/db/src/styles/fonts.scss @@ -0,0 +1,174 @@ +@font-face { + font-family: "Merriweather"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/merriweather-v19-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("Merriweather Regular"), local("Merriweather-Regular"), + url("../assets/fonts/merriweather-v19-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/merriweather-v19-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/merriweather-v19-latin-regular.woff") format("woff"), + /* Modern Browsers */ + url("../assets/fonts/merriweather-v19-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/merriweather-v19-latin-regular.svg#Merriweather") + format("svg"); + /* Legacy iOS */ +} + +/* pt-sans-regular - latin */ +@font-face { + font-family: "PT Sans"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/pt-sans-v9-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("PT Sans"), local("PTSans-Regular"), + url("../assets/fonts/pt-sans-v9-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/pt-sans-v9-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/pt-sans-v9-latin-regular.woff") format("woff"), + /* Modern Browsers */ url("../assets/fonts/pt-sans-v9-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/pt-sans-v9-latin-regular.svg#PTSans") format("svg"); + /* Legacy iOS */ +} + +@font-face { + font-family: "PT Serif"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/pt-serif-v9-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("PT Serif"), local("PTSerif-Regular"), + url("../assets/fonts/pt-serif-v9-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/pt-serif-v9-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/pt-serif-v9-latin-regular.woff") format("woff"), + /* Modern Browsers */ url("../assets/fonts/pt-serif-v9-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/pt-serif-v9-latin-regular.svg#PTSerif") format("svg"); + /* Legacy iOS */ +} + +/* open-sans-regular - latin */ +@font-face { + font-family: "Open Sans"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/open-sans-v15-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("Open Sans Regular"), local("OpenSans-Regular"), + url("../assets/fonts/open-sans-v15-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/open-sans-v15-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/open-sans-v15-latin-regular.woff") format("woff"), + /* Modern Browsers */ url("../assets/fonts/open-sans-v15-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/open-sans-v15-latin-regular.svg#OpenSans") + format("svg"); + /* Legacy iOS */ +} + +/* roboto-regular - latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/roboto-v18-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("Roboto"), local("Roboto-Regular"), + url("../assets/fonts/roboto-v18-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/roboto-v18-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/roboto-v18-latin-regular.woff") format("woff"), + /* Modern Browsers */ url("../assets/fonts/roboto-v18-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/roboto-v18-latin-regular.svg#Roboto") format("svg"); + /* Legacy iOS */ +} + +/* roboto-500 - latin */ +@font-face { + font-family: "Roboto Bold"; + font-style: normal; + font-weight: 500; + src: url("../assets/fonts/roboto-v18-latin-500.eot"); + /* IE9 Compat Modes */ + src: local("Roboto Medium"), local("Roboto-Medium"), + url("../assets/fonts/roboto-v18-latin-500.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/roboto-v18-latin-500.woff2") + format("woff2"), + /* Super Modern Browsers */ url("../assets/fonts/roboto-v18-latin-500.woff") + format("woff"), + /* Modern Browsers */ url("../assets/fonts/roboto-v18-latin-500.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/roboto-v18-latin-500.svg#Roboto") format("svg"); + /* Legacy iOS */ +} + +/* roboto-condensed-regular - latin */ +@font-face { + font-family: "Roboto Condensed"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/roboto-condensed-v16-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), + url("../assets/fonts/roboto-condensed-v16-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ + url("../assets/fonts/roboto-condensed-v16-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/roboto-condensed-v16-latin-regular.woff") + format("woff"), + /* Modern Browsers */ + url("../assets/fonts/roboto-condensed-v16-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/roboto-condensed-v16-latin-regular.svg#RobotoCondensed") + format("svg"); + /* Legacy iOS */ +} + +/* inconsolata-regular - latin */ +@font-face { + font-family: "Inconsolata"; + font-style: normal; + font-weight: 400; + src: url("../assets/fonts/inconsolata-v16-latin-regular.eot"); + /* IE9 Compat Modes */ + src: local("Inconsolata Regular"), local("Inconsolata-Regular"), + url("../assets/fonts/inconsolata-v16-latin-regular.eot?#iefix") + format("embedded-opentype"), + /* IE6-IE8 */ url("../assets/fonts/inconsolata-v16-latin-regular.woff2") + format("woff2"), + /* Super Modern Browsers */ + url("../assets/fonts/inconsolata-v16-latin-regular.woff") format("woff"), + /* Modern Browsers */ + url("../assets/fonts/inconsolata-v16-latin-regular.ttf") + format("truetype"), + /* Safari, Android, iOS */ + url("../assets/fonts/inconsolata-v16-latin-regular.svg#Inconsolata") + format("svg"); + /* Legacy iOS */ +}