Merge pull request #1115 from PrimeDAO/development

Update Staging - v1.0.6

.github/workflows/deployFirebase.yml

@@ -3,8 +3,27 @@ on:
  push:
  branches: [ development, staging, staging-mainnet, master ]
 jobs:
+ Get_environment:
+ runs-on: ubuntu-latest
+ steps:
+ - name: Get environment
+ id: branch_check
+ run: |
+ echo "Running on branch ${{ github.ref }}"
+ if [ "${{ github.ref }}" = "refs/heads/master" ]; then
+ echo "::set-output name=env_name::Production"
+ else
+ echo "::set-output name=env_name::Preview"
+ fi
+ - name: Use variable setup in previous step
+ run: echo "I'm using variable ${{ steps.branch_check.outputs.env_name }}"
+ outputs:
+ env_name: ${{ steps.branch_check.outputs.env_name }}
+
  Deploy_firebase:
  runs-on: ubuntu-latest
+ needs: Get_environment
+ environment: ${{ needs.Get_environment.outputs.env_name }}
  steps:
  - uses: actions/checkout@v2
  - uses: actions/setup-node@v2
@@ -19,5 +38,6 @@ jobs:
  cd firebaseFunctions
  touch .env
  echo "RIVET_ID=${{ secrets.RIVET_ID }}" >> .env
+
  - name: Deploy firebase
  run: npm run firebase-deploy:${GITHUB_REF_NAME} -- --token ${{ secrets.FIREBASE_TOKEN }}

package.json

@@ -109,7 +109,7 @@
  "eslint-plugin-cypress": "^2.12.1",
  "eslint-plugin-rxjs": "^2.1.2",
  "expose-loader": "^3.1.0",
- "firebase-tools": "^10.2.2",
+ "firebase-tools": "^11.1.0",
  "fs-extra": "^9.0.1",
  "glob": "^7.1.7",
  "gulp": "^4.0.2",

src/deals/dealSummary/dealSummary.scss

@@ -4,8 +4,7 @@
 deal-summary {
  .pcard {
  display: inline-block;
- max-width: 360px;
- min-width: 360px;
+ width: 360px;
  background-color: $BG02;
  padding: $spacing-normal;
  /* don't do this transition until we can do it with gradient pcards too
@@ -109,34 +108,3 @@ deal-summary {
  }
  }
 }
-
-@media screen and (max-width: $PageBreakWidth) {
- .dealSummaryContainer {
- // because this is going to be vertically-aligned
- padding-right: 0;
- margin-bottom: 20px;
- width: 50%;
-
- .dealSummary {
- > .icon {
- img {
- height: 36px;
- width: 36px;
- }
- }
-
- > .footer,
- > .countdown,
- > .proposal {
- text-align: left;
- }
- }
- }
-}
-
-@media screen and (max-width: 400px) {
- .dealSummaryContainer {
- min-width: 100%;
- width: 100%;
- }
-}

src/deals/list/deals.scss

@@ -62,7 +62,7 @@ pbutton button.secondary {
  text-align: right;
  margin-bottom: 28px;
  display: grid;
- grid-template-columns: 1fr auto;
+ grid-template: 1fr / 1fr auto;
  justify-items: right;
  align-items: center;
 
@@ -188,7 +188,7 @@ pbutton button.secondary {
 
  .dealGrid {
  display: grid;
- grid-template-columns: 0.6fr 0.9fr 0.5fr 0.5fr 0.5fr 0.5fr;
+ grid-template-columns: 2fr 3fr 1fr 1fr 1fr 1fr;
 
  .row {
  &.header {
@@ -322,9 +322,96 @@ pbutton button.secondary {
  }
 }
 
+@mixin prefix($text) {
+ &:before {
+ content: $text;
+ margin-right: $spacing-small;
+ font-size: small;
+ }
+}
+
 @media screen and (max-width: $PageBreakWidth) {
  .page.deals {
+ .deal-carousel {
+ min-height: unset;
+ margin-bottom: unset;
+ .carousel-selector {
+ margin-bottom: unset;
+ }
+ .featuredDealsScroller {
+ display: none;
+ }
+ }
+ .all-deals .heading02Gradient {
+ display: none;
+ }
  .section {
+ &.deals-actions {
+ grid-template: 1fr auto / 1fr;
+ grid-row-gap: $spacing-normal;
+ }
+
+ &.all-deals {
+ .heading02Gradient {
+ padding-bottom: $spacing-small;
+ border-bottom: 1px solid $Border01;
+ }
+ .grid.dealGrid {
+ grid-template-columns: 1fr;
+ .row {
+ display: grid;
+ padding: $spacing-small 0;
+ grid-template-areas:
+ "daos daos status"
+ "type type age"
+ "title title size";
+ grid-template-columns: 2fr 2fr 1fr;
+ grid-template-rows: 40px 20px auto;
+ border-bottom: 1px solid $Border01;
+ &.body.hot:hover {
+ background-color: $BG02;
+ }
+ &.header {
+ display: none;
+ }
+ .cell {
+ padding: 0 $spacing-normal;
+ border-bottom: unset;
+ height: auto;
+ }
+ .project {
+ grid-area: daos;
+ }
+ .title {
+ grid-area: title;
+ font-size: 20px;
+ font-weight: bold;
+ overflow-wrap: anywhere;
+ }
+ .type {
+ justify-content: left;
+ grid-area: type;
+ font-size: 12px;
+ font-weight: bold;
+ color: $Secondary05;
+ text-transform: uppercase;
+ }
+ .status {
+ justify-content: center;
+ grid-area: status;
+ }
+ .age {
+ grid-area: age;
+ justify-content: center;
+ }
+ .dealSize {
+ @include prefix("Deal Size (USD):");
+ justify-content: center;
+ grid-area: size;
+ }
+ }
+ }
+ }
  > .title {
  white-space: normal;
  text-align: center;
@@ -340,3 +427,32 @@ pbutton button.secondary {
  }
  }
 }
+
+@media screen and (max-width: $MobileWidth) {
+ .page.deals {
+ .section {
+ &.all-deals {
+ .grid.dealGrid {
+ .row {
+ grid-template-areas:
+ "daos daos daos"
+ "type type type"
+ "size size status";
+ grid-template-columns: 2fr 1fr 0.5fr;
+ .title, .age {
+ display: none;
+ }
+ &.body {
+ padding-top: $spacing-normal;
+ padding-bottom: $spacing-normal;
+ }
+ .dealSize {
+ @include prefix("");
+ justify-content: left;
+ }
+ }
+ }
+ }
+ }
+ }
+}

src/home/home.scss

@@ -124,6 +124,13 @@
  margin-bottom: 80px;
  gap: 28px;
  }
+
+ .scrollerContainer {
+ .scroller {
+ flex-direction: row;
+ gap: calc($spacing-normal * 2);
+ }
+ }
  }
 
  &.hero {

src/resources/elements/horizontal-scroller/horizontal-scroller.scss

@@ -68,24 +68,3 @@
  left: -16px;
  }
 }
-
-@media screen and (max-width: $PageBreakWidth) {
- .scrollerContainer {
- display: block;
- position: unset;
- text-align: center;
-
- .scroller {
- flex-direction: column;
-
- > div:not(:last-of-type) {
- margin-bottom: 24px;
- }
- }
-
- .rightButton,
- .leftButton {
- display: none;
- }
- }
-}

src/resources/elements/horizontal-scroller/horizontal-scroller.ts

@@ -39,7 +39,7 @@ export class HorizontalScroller {
  /**
  * scroll by the sum of the widths of the wholly-visible items
  */
- return itemWidth * visibleItemsCount;
+ return itemWidth * visibleItemsCount || itemWidth/* fix: visibleItemsCount is 0 */;
  }
 
  @computedFrom("scroller.scrollWidth", "scrollPos", "scroller.clientWidth")