From d0186c77a684c4e299ea0a673a2dc7ebfb07fe55 Mon Sep 17 00:00:00 2001 From: digvijay26 Date: Tue, 5 Jan 2021 18:07:51 +0530 Subject: [PATCH] changes in ui --- config/dev.env.js | 2 +- config/index.js | 2 +- index.html | 1 + package-lock.json | 8 + package.json | 1 + src/assets/css/custom.css | 29 +- src/assets/images/add-role.svg | 6 + src/assets/images/behind-blue.svg | 22 + src/assets/images/behind-red.svg | 22 + src/assets/images/critique-blue.svg | 22 + src/assets/images/critique-red.svg | 22 + src/assets/images/juxtapose-blue.svg | 29 ++ src/assets/images/juxtapose-red.png | Bin 0 -> 3574 bytes src/assets/images/retake-blue.svg | 23 + src/assets/images/retake-red.svg | 23 + src/assets/images/seats.svg | 24 + src/assets/images/spot-light-ps.svg | 12 + src/components/AuthorIntro.vue | 5 +- src/components/EpisodeIntro.vue | 5 +- src/components/NoScreenshotSingleAuthor.vue | 376 ++++++++------ src/components/Profile.vue | 97 ++-- src/components/SingleMobileInsight.vue | 11 +- src/components/SingleMobileScreenInsightOne.vue | 413 ++++++++------- src/components/SingleMobileScreenInsightTwo.vue | 413 ++++++++------- src/components/TwoScreenWithInsight.vue | 645 +++++++++++++++++++---- src/components/TwoScreenWithoutInsight.vue | 647 ++++++++++++++++++++---- src/components/noscreenshotSingleautho.vue | 529 +++++++++++++++++++ src/components/outro.vue | 83 ++- src/main.js | 5 +- src/router/index.js | 23 +- 30 files changed, 2716 insertions(+), 784 deletions(-) create mode 100644 src/assets/images/add-role.svg create mode 100644 src/assets/images/behind-blue.svg create mode 100644 src/assets/images/behind-red.svg create mode 100644 src/assets/images/critique-blue.svg create mode 100644 src/assets/images/critique-red.svg create mode 100644 src/assets/images/juxtapose-blue.svg create mode 100644 src/assets/images/juxtapose-red.png create mode 100644 src/assets/images/retake-blue.svg create mode 100644 src/assets/images/retake-red.svg create mode 100644 src/assets/images/seats.svg create mode 100644 src/assets/images/spot-light-ps.svg create mode 100644 src/components/noscreenshotSingleautho.vue diff --git a/config/dev.env.js b/config/dev.env.js index bbbd257..e5aaa91 100644 --- a/config/dev.env.js +++ b/config/dev.env.js @@ -7,7 +7,7 @@ module.exports = merge(prodEnv, { // APIurl: '"https://cors-anywhere.herokuapp.com/https://www.gigsfor.me/_functions"', // APIurl: '"https://stg-api.gigsfor.me/api"', APIurl: '"https://stg-api.gigsfor.me/api"', - siteUrl: '"http://134.209.156.59:8080"', + siteUrl: '"http://localhost:8080"', imageUrl: '"https://stg-api.gigsfor.me/"', fileUploadKey: '"AYqgvDoo4RyBC0STV6og2z"', landbotUrl: '"https://landbot.io/u/H-347617-SIJESECF8DSSQ06L/index.html"', diff --git a/config/index.js b/config/index.js index ac440d3..10c0aae 100644 --- a/config/index.js +++ b/config/index.js @@ -13,7 +13,7 @@ module.exports = { proxyTable: {}, // Various Dev Server settings - host: '134.209.156.59', // can be overwritten by process.env.HOST + host: 'localhost', // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: false, errorOverlay: true, diff --git a/index.html b/index.html index 2f04949..d5061da 100644 --- a/index.html +++ b/index.html @@ -15,6 +15,7 @@ + ` diff --git a/package-lock.json b/package-lock.json index c42beeb..30c8dfd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21408,6 +21408,14 @@ "vue": "^2.2.4" } }, + "vue-star-rating": { + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/vue-star-rating/-/vue-star-rating-1.7.0.tgz", + "integrity": "sha512-2qdONqnIlvFzJoallfr7VuFRB6hBzYgBVEbXC3yYZz2TfMhx36WtYQ5p7JRjW+pzZx2PGQYZ75UFoBE0jwIANw==", + "requires": { + "vue": "^2.3.3" + } + }, "vue-stepper": { "version": "1.4.2", "resolved": "https://registry.npmjs.org/vue-stepper/-/vue-stepper-1.4.2.tgz", diff --git a/package.json b/package.json index b9d4af4..6b86439 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "vue-meta": "^2.3.2", "vue-router": "^3.0.1", "vue-social-sharing": "^2.4.7", + "vue-star-rating": "^1.7.0", "vue-stepper": "^1.4.2", "vue-toast-notification": "0.0.3", "vue-video-player": "^5.0.2", diff --git a/src/assets/css/custom.css b/src/assets/css/custom.css index 9b70b22..0cf3f9e 100644 --- a/src/assets/css/custom.css +++ b/src/assets/css/custom.css @@ -138,7 +138,7 @@ h1{font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 600; font font-family: 'Montserrat', sans-serif; } -.user-profile-photo{ width: 40px; position: relative; +.user-profile-photo{ width: 40px; position: relative; display: block; height: 40px; border-radius: 100px; padding: 1px;} @@ -218,6 +218,11 @@ h1{font-family: 'Bebas Neue', cursive;font-style: normal; font-weight: 600; font .rose-bud{ background: #fba29a;} .pattens-blue{ background: #ceeced;} +.insight-design{ background: #FBC647;} +.insight-product{ background: #9DDADB;} +.insight-marketing{ background: #F74536;} +.insight-pricing{ background: #C1C0FE;} +.insight-psychology{ background: #477970;} /* add new card */ .add-card-warpper{ width: 283px; background: transparent; border-radius: 4px; padding:23px; height: 356px; float: left; margin-right: 0px; border:2px dashed #fff;} .add-card-warpper a{ display: block; @@ -875,7 +880,7 @@ color: #514DA7;opacity:1; } .single-author-comments{ width: 1000px; display: block; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; height: 100%;} .s-user-comments { display: block; position: absolute; bottom: 37px; width: 400px;} - .single-author-li-comments{ width: 100%; display: block; float: left;} + .single-author-li-comments{ width: 100%; display: block; float: left; position: relative; z-index: 1;} .a-intro-comments{background: #FFFFFF; width: 100%; padding: 15px; float: left; margin-bottom: 15px; position: relative; border: 1px solid #201E6A; box-shadow: 0px 4px 8px 5px rgba(0, 0, 0, 0.0975743); @@ -1003,7 +1008,7 @@ color: #514DA7;opacity:1; margin-bottom: -20px;} .custom-c-style{border-radius:0px 25px 25px 25px;} .mobile-screen-one{ width: 379px; display: block;height:726px;position: absolute; border: 1px solid #000000; - border-radius: 25px 25px 0 0; + border-radius: 45px 45px 0 0; bottom: 0; top: unset; background-position: bottom;} @@ -1343,4 +1348,20 @@ input:focus{ outline: none;} .joined_wrapper{ position: relative;} .each-ft{ width: 366px; bottom: 0px;margin-left: -11px;background: #fff; display: block;float: left; z-index: 1; position: relative;} .reply-Wdth{ width: 64px;} -.discard_bt{width: 70px;float: right; margin-top: 3px; margin-right: 20px;} \ No newline at end of file +.discard_bt{width: 70px;float: right; margin-top: 3px; margin-right: 20px;} +.full-w-height-profile{ min-height: 330px; border:2px solid #fff; border-radius: 10px; width: 100%;} +.full-w-height-profile.ex-light p{font-weight: 500; font-weight: normal; font-size: 14px; line-height: 21px; color: #000; opacity: 0.7; width: 100%; display: block; text-align: center;} +.full-w-height-profile.ex-light.seats_bg{background-image:url('../images/seats.svg'); background-repeat: no-repeat; background-position: bottom center; } +.full-w-height-profile.ex-light .bt-spc-top{ margin-top: 100px;} +.full-w-height-profile .add-role{ width: 107px; margin: 0 auto; display: block; margin-top: 50px; margin-bottom: 20px;} +.full-w-height-profile.spotlight_bg {background-image:url('../images/spot-light-ps.svg'); background-repeat: no-repeat; background-size: contain; background-position: bottom -3px right 50px;} +.update_profile{ margin-right: 15px; margin-top: 2px; z-index: 11; background: #514DA7; border-radius: 5px;width: 146px; text-transform: uppercase; color: #fff; text-align: center; height: 35px; font-weight: 600; font-size: 12px; font-style: normal; line-height: 14px;} +.update_profile span{width: 11px; + height: 11px; + display: inline-block; + background: #EF484F; + border-radius: 10px; + margin: 12px 0 0 0;} +.update_profile:hover{ color: #fff; text-decoration: none;} +.top-area-blank{ width: 195px; height: 30px; display: block; margin: 0 auto; background: #DFE7EF; border-radius: 0px 0px 23.4986px 23.4986px; position: absolute; z-index: 1; left: 0; right: 0; top: 15px;} +.custom-selected-style-2{ border-radius:25px 25px 25px 0px;border: 1.09903px solid #EF484F;} \ No newline at end of file diff --git a/src/assets/images/add-role.svg b/src/assets/images/add-role.svg new file mode 100644 index 0000000..ee44a57 --- /dev/null +++ b/src/assets/images/add-role.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/assets/images/behind-blue.svg b/src/assets/images/behind-blue.svg new file mode 100644 index 0000000..ac7ca4b --- /dev/null +++ b/src/assets/images/behind-blue.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/behind-red.svg b/src/assets/images/behind-red.svg new file mode 100644 index 0000000..d143456 --- /dev/null +++ b/src/assets/images/behind-red.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/critique-blue.svg b/src/assets/images/critique-blue.svg new file mode 100644 index 0000000..bf38a5e --- /dev/null +++ b/src/assets/images/critique-blue.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/critique-red.svg b/src/assets/images/critique-red.svg new file mode 100644 index 0000000..ff102a0 --- /dev/null +++ b/src/assets/images/critique-red.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/juxtapose-blue.svg b/src/assets/images/juxtapose-blue.svg new file mode 100644 index 0000000..0d5e035 --- /dev/null +++ b/src/assets/images/juxtapose-blue.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/juxtapose-red.png b/src/assets/images/juxtapose-red.png new file mode 100644 index 0000000000000000000000000000000000000000..7278a5bd242b31c1c94f707c96597c3fb13e11c4 GIT binary patch literal 3574 zcmVp>wmI8e7vAxyX zer+XL)?TkwP(X+HwhkVgXZzPT?!>Ek+^y6u%16xrtPruM?O>0%AAyPmgFU1fX8pERbH4o;zyPpH zOsUc$F}FgZ3M4hQ1Rkm~v5#G-VvGE&3R7CN%&V-?s|Rw=lnm}g5kx+}K{Yu@kbK?` zmp+vANgGKDTm$B~CuuXza0?e}@Lk-8SmoV~>gluPcW7W`pGzsWzpg)}@(K*;MFdaF zD*qnnp{mZ)OCkRrvB+yc;XFug7L~UI1%bvER9&cow7(3?)I5om1z6=f z>DIm!VWoKHJqeQpK<~A>JO$~2km6zTcno;~hfo5m<{(J3z^}jHoJx8xfP174@s%n) zOrO_>3%s5ZfMJ*BnxLd`{v~Rl#n!OiIt>&;!Q1Ow+o)6;{Gm&eeOnxoI!oUu3h)aU zl@+2odd-AEBYP8ZYwoAw{JmdlHIUH?3iGu5zIXD9<6IptU=KR152yytl~Ms1 zWSTiln{C=W_OPH(rHFD`eRa>Fa%5l`<$1wE_yK$+RZW82k9!2GXC@Xsy#|;qqFSBB zwG2W5J;_=F2B{}&NhnFLa`*ke{)9OIvBM7ez+MAHNI=v4%pY_gv&8J#oi@xU%Ti!$ zYo?XXi+~9KIC|G0)yEH{{@Aq?_T$YawMraxt3=1a z-VDq;lnilPMa`EzSHcEJ(~JF{gF@HZk7{dqT_jUeckPYM7siC6_maoW04s>Og}@V3 z@eBn-a}^(~HDT8CjA`KB$L1laKdHTba)bBY5s=m|L5VGHcr^L-^qahPzo`(1_6GWS zh|-!$KNv(yiK!`2zSI&2W44zCu)r|%oTmvs9}wbs`2z{lAZE5osOR@SygP&mkz3ty zH`f{kq+geh-q!gTUVL=-($`2DeoQc-UTgJY!wTpG*rvw}a0>+#^qgc>BsR*QAqS?Q z?sOg4v|Sci}bXUKbaL?z)bix(ZNOEi@IaBKzIOY0AO95##pQ6dVO)+zJuer;Mw+ zktnXPlZ@7;J*usO0~07?a8541q)BZH=a9|Adt{-ZC1_eyNB!1VLb5A8>-0wn%YhGO zHho{kt_J+mn`&9OD(qMjm`}8JqSa$MN;*78VJsnaR(cv+6?7LLnt@M46q;gkGdpx) z8n4o-PrI-X$)zzyosBgnnPpOXH(t@h>lTPWd_&hVjzM<$70?=NaOgq0u3!R;<*F$E z-fZGavwH-4l!j0Ar)IUOuD~3+z~=%AdkQvi^iGp%n@C8xEe^b~OOV5l7i@&!Fm>c# z2PfrI++z_Ya{xHL=7CS4MW)-?J~gG^0|~U z00##L2L}fS2L}fS2L}fS2L}fS2M32mL%!{p6r?Fq+wff;xaGyO!&O$W_CZD9Q(Oip zUAm>kGsH+CQ6N9synMFtv~RzW6!BU-ZyOvY0`0iqZJa|eQbWms&z85NvO1L z6&2p{wqtAxZW$guLbv97JjARxZ+#UK&G@#0qnFWUyBynI2vZO5d7U{O<_Wyfj);{8 z-bb9LUZxk6kdkgtL@wGl>jY(TWtcciW~*vRzi6*lU%>>Jijd;)X*NPvg+e&PErtp8 zNl`NOOB#>%HexkH_5vo@;-Si6N8-pJp~X@05SPy^POB>8hJgvO&+wCI~&m zy~@UG^|AJS{5WzW_{2i$26+;uHBju)?{eQ6TDjsY=B@r>@^NsG;Dho}E3`t~2V%*I zP@uywvAW~*IB`rjj&JvN{(~MB028X3!Y1fAkP=a5%Pw4{xJD)g=f@>#);F+(jw8iCzo#u{E)=?o5O6P9>qpSni5aCn8k{Hv<)Z z7V76tL`@UE#{j+6s-!;SyM4%s!m?vt_NIMfEJEJ#L6Fv(K-LzU5UT<-E=A&jO`wvQ zxOlSvDjKK?h@$g6ivqqc=s0Dx2ggJYn8n8962<$|U~*Fklb|>+W}4)Rddg+#a@FL< z(`K;>6O7oD1gDgU7hUrem_s#a^7?tZ%wP?BJxvC;wUhWp@;f{(2~E?IkjJGdU?xsK ztD|X|m!DA_0_7#oAQ|?153f7;ZePlsUW8e>C-~a6-0e(BrkEFMChCp?<|?5-o0K)w zn$%8&4_h3RkKQ%1SdReC#9TMoVyY)LLS^wNX_JIYaL*w%CVCQef$sAQ3GgalqiJ%4 z;wjScnYz!DsS)CglcS>dTASaVT`op2k&?j+ikJu|qBi%1gYL~9(4QqUD+A0lFjL}? zykP7lm9f4;ZE&p#f zXFC0FgVe1VC+R=DS81at&VK@agOkzp)WC*`uGteudQ_){!g`Wb1zV#QshF8Nj0|6G zUCe7d3HEe=D_NwqM_=c28e!`?>cVQ=A?z3mmLQ!mZ$pvoiSU;`~uh5JB)$WUAS z-xqA&=~xsLt>IugUVJ{N;)%m>_~vD>|KE;TY_U*Utx%;))MY%F(@u|+1;CS(s!mhS zS*0EUy0d#BsI5;>sI9x0K59BykjcP<>ivR!s07*qoM6N<$f_;CgDF6Tf literal 0 HcmV?d00001 diff --git a/src/assets/images/retake-blue.svg b/src/assets/images/retake-blue.svg new file mode 100644 index 0000000..142867d --- /dev/null +++ b/src/assets/images/retake-blue.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/retake-red.svg b/src/assets/images/retake-red.svg new file mode 100644 index 0000000..d1abfc4 --- /dev/null +++ b/src/assets/images/retake-red.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/seats.svg b/src/assets/images/seats.svg new file mode 100644 index 0000000..a178675 --- /dev/null +++ b/src/assets/images/seats.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/spot-light-ps.svg b/src/assets/images/spot-light-ps.svg new file mode 100644 index 0000000..418bca4 --- /dev/null +++ b/src/assets/images/spot-light-ps.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/src/components/AuthorIntro.vue b/src/components/AuthorIntro.vue index fea57f1..997578e 100644 --- a/src/components/AuthorIntro.vue +++ b/src/components/AuthorIntro.vue @@ -33,12 +33,13 @@ View My Profile -
+ +
--> +
diff --git a/src/components/EpisodeIntro.vue b/src/components/EpisodeIntro.vue index 20e8bc3..cf5d13c 100644 --- a/src/components/EpisodeIntro.vue +++ b/src/components/EpisodeIntro.vue @@ -67,7 +67,10 @@
- + + + +
diff --git a/src/components/NoScreenshotSingleAuthor.vue b/src/components/NoScreenshotSingleAuthor.vue index adc8c86..db2d9ae 100644 --- a/src/components/NoScreenshotSingleAuthor.vue +++ b/src/components/NoScreenshotSingleAuthor.vue @@ -38,7 +38,6 @@
- +
-
- +
+
- Comment
@@ -345,31 +287,39 @@
- +
- -
+
- {{currentSlideData.payload.comments.length - 1}}+ Comments{{ commentList.length - 1 }}+ Comments
    -
    • -
    • -
    • + + +
- Saudrika commented View All + {{ commentList[commentList.length - 1].user.name }} + View All

- {{currentSlideData.payload.comments[2].comment}} + {{ commentList[commentList.length - 1].comment }}

@@ -379,20 +329,24 @@
-
+
-
- Comment @@ -401,21 +355,22 @@
-
- -
+
+ +
+
@@ -438,15 +393,22 @@ diff --git a/src/components/SingleMobileScreenInsightTwo.vue b/src/components/SingleMobileScreenInsightTwo.vue index baa59c0..5781756 100644 --- a/src/components/SingleMobileScreenInsightTwo.vue +++ b/src/components/SingleMobileScreenInsightTwo.vue @@ -24,10 +24,7 @@
- - - - +
@@ -40,7 +37,6 @@
- +
-
- +
+
- Comment
@@ -236,23 +183,23 @@ -
+
- +
- - + -
- + :src="currentSlideData.payload.metaData.authorImage" + class="dynamic-thoughts" + /> +
+ +
-

{{currentSlideData.payload.comments[0].comment}}

+

{{ currentSlideData.payload.comments[0].comment }}

@@ -280,7 +227,7 @@

- {{currentSlideData.payload.comments[1].comment}} + {{ currentSlideData.payload.comments[1].comment }}

  • @@ -299,10 +246,10 @@
-
-
+
+

- {{currentSlideData.payload.comments[2].comment}} + {{ currentSlideData.payload.comments[2].comment }}

  • @@ -317,10 +264,10 @@
-
+

- {{currentSlideData.payload.comments[3].comment}} + {{ currentSlideData.payload.comments[3].comment }}

  • @@ -339,32 +286,41 @@
- -
+ +
- -
-
-
-
- -
- -

- - {{currentSlideData.payload.comments.length - 1}}+ Comments -

-
- -
+
+
+
+ {{ commentList.length - 1 }}+ Comments +
    +
    • +
    • +
    • +
+
+
+ {{ commentList[commentList.length - 1].user.name }} + View All +

+ + {{ commentList[commentList.length - 1].comment }} +

+
+
@@ -375,16 +331,20 @@
-
- Comment @@ -393,21 +353,22 @@
-
- -
+
+ +
+
@@ -420,7 +381,6 @@
-
@@ -431,6 +391,8 @@ diff --git a/src/components/TwoScreenWithInsight.vue b/src/components/TwoScreenWithInsight.vue index b948238..5e84e0b 100644 --- a/src/components/TwoScreenWithInsight.vue +++ b/src/components/TwoScreenWithInsight.vue @@ -1,119 +1,403 @@