style changes - padding margin (#212)

rynzlery · BilelJegham · web-flow · commit aa9da607c118 · 2021-08-29T21:32:24.000+02:00
* style changes - padding margin

* refacto: regrouping scss

* ci: minimal e2e on fork

* ci: minimal e2e on fork

* fix test snapshot

Co-authored-by: BilelJegham &lt;contact.bileljegham@gmail.com&gt;
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -6,6 +6,19 @@ on:
   pull_request:
 
 jobs:
+  checksecret:
+    name: check if MY_SECRET is set in github secrets
+    runs-on: ubuntu-latest
+    outputs:
+      is_MY_SECRET_set: ${{ steps.checksecret_job.outputs.is_MY_SECRET_set }}
+    steps:
+      - name: Check whether unity activation requests should be done
+        id: checksecret_job
+        env:
+            MY_SECRET: ${{ secrets.GMAP_API_KEY }}
+        run: |
+            echo "is_MY_SECRET_set: ${{ env.MY_SECRET != '' }}"
+            echo "::set-output name=is_MY_SECRET_set::${{ env.MY_SECRET != '' }}"
   integration:
     env:
       VUE_APP_API_KEY: YOUR_GOOGLE_MAPS_API_KEY
@@ -63,8 +76,38 @@ jobs:
         name: ${{ matrix.os }}-node-v${{ matrix.node }}-build
         path: dist
 
+
+  cypress-chrome-firefox-simple:
+    needs: [checksecret, integration]
+    if: needs.checksecret.outputs.is_MY_SECRET_set == 'false'
+    runs-on: ubuntu-16.04
+    name: E2E on Ubuntu
+    strategy:
+      fail-fast: false
+      matrix:
+        browsers: [chrome, firefox]
+    steps:
+      - uses: actions/checkout@v1
+      - uses: cypress-io/github-action@v2
+        with:
+          start: npm run serve
+          wait-on: 'http://localhost:8080'
+          record: true
+          parallel: true
+          group: ${{matrix.browsers}}
+          tag: ${{ github.event_name }}
+          browser: ${{matrix.browsers}}
+          spec: |
+            tests/e2e/specs/homePage.test.js
+        env:
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          COMMIT_INFO_MESSAGE: ${{ github.event.pull_request.title }}
+
+
+
   cypress-chrome-firefox:
-    needs: integration
+    needs: [checksecret, integration]
+    if: needs.checksecret.outputs.is_MY_SECRET_set == 'true'
     env:
       VUE_APP_API_KEY:  ${{ secrets.GMAP_API_KEY }}
       VUE_APP_FIREBASE_API_KEY:  ${{ secrets.VUE_APP_FIREBASE_API_KEY }}
diff --git a/src/components/dialogroom/DialogRoom.vue b/src/components/dialogroom/DialogRoom.vue
@@ -4,6 +4,7 @@
         persistent
         :fullscreen="$viewport.width < 450"
         max-width="800"
+        content-class="dialog-room"
     >
         <component
             :is="currentComponent"
@@ -54,3 +55,11 @@ export default {
     },
 };
 </script>
+<style lang="scss">
+.dialog-room {
+    .v-card__actions {
+        gap: .5rem;
+        padding: 1rem;
+    }
+}
+</style>
diff --git a/src/components/dialogroom/card/CardRoomName.vue b/src/components/dialogroom/card/CardRoomName.vue
@@ -55,7 +55,7 @@ export default {
 };
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 #card-title {
     font-size: 16px;
     font-weight: 500;
diff --git a/src/components/dialogroom/card/CardRoomSettings.vue b/src/components/dialogroom/card/CardRoomSettings.vue
@@ -241,6 +241,7 @@
             </v-btn>
             <v-btn
                 id="btnNextSettings"
+                dark
                 depressed
                 color="#43B581"
                 :disabled="loadingGeoJson"
@@ -365,9 +366,6 @@ export default {
         }
     }
 
-    .v-card__actions .v-btn {
-        color: white;
-    }
     .card_settings__allow_btns {
         display: flex;
         flex-direction: column;
diff --git a/src/components/home/SearchBox.vue b/src/components/home/SearchBox.vue
@@ -29,6 +29,7 @@
                 class="btn-customs"
                 color="primary"
                 height="50"
+                width="50"
                 @click="dialogCustom = !dialogCustom"
             >
                 <v-icon>mdi-map-plus</v-icon>
@@ -148,6 +149,7 @@ export default {
     .search-box__btns {
         display: flex;
         justify-content: space-around;
+        width: calc(100% - 50px);
         &__btn {
             width: 40%;
             padding: 0 5em;
diff --git a/src/scss/variables.scss b/src/scss/variables.scss
@@ -46,6 +46,10 @@ html, body {
   color: black;
 }
 
+.v-btn--text {
+  margin: 0 8px;
+}
+
 .blur{
   filter: blur(4px);
 }
diff --git a/tests/unit/components/dialogRoom/__snapshots__/DialogRoom.spec.js.snap b/tests/unit/components/dialogRoom/__snapshots__/DialogRoom.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`DialogRoom.vue render 1`] = `
-<v-dialog-stub opendelay="0" closedelay="0" contentclass="" maxwidth="800" origin="center center" persistent="true" retainfocus="true" transition="dialog-transition" width="auto">
+<v-dialog-stub opendelay="0" closedelay="0" contentclass="dialog-room" maxwidth="800" origin="center center" persistent="true" retainfocus="true" transition="dialog-transition" width="auto">
   <settings-stub singleplayer="true" current-component="settings" room-name=""></settings-stub>
 </v-dialog-stub>
 `;
diff --git a/tests/unit/components/home/__snapshots__/SearchBox.spec.js.snap b/tests/unit/components/home/__snapshots__/SearchBox.spec.js.snap
@@ -30,7 +30,7 @@ exports[`SearchBox.vue test search Input 1`] = `
 }" nodatatext="$vuetify.noDataText" items="" itemcolor="primary" itemdisabled="disabled" itemtext="text" itemvalue="value" menuprops="[object Object]" returnobject="true" allowoverflow="true" filter="function _default(item, queryText, itemText) {
         return itemText.toLocaleLowerCase().indexOf(queryText.toLocaleLowerCase()) > -1;
       }" searchinput="" delimiters=""></v-combobox-stub>
-    <v-btn-stub color="primary" height="50" tag="button" activeclass="" icon="true" type="button" class="btn-customs">
+    <v-btn-stub color="primary" height="50" width="50" tag="button" activeclass="" icon="true" type="button" class="btn-customs">
       <v-icon-stub>mdi-map-plus</v-icon-stub>
     </v-btn-stub>
   </div>

Original file line number	Diff line number	Diff line change
`@@ -46,6 +46,10 @@ html, body {`
`46`	`46`	`color: black;`
`47`	`47`	`}`
`48`	`48`
	`49`	`+.v-btn--text {`
	`50`	`+ margin: 0 8px;`
	`51`	`+}`
	`52`	`+`
`49`	`53`	`.blur{`
`50`	`54`	`filter: blur(4px);`
`51`	`55`	`}`