viithiisys / spotlight-frontend

Blame view

src/components/Insight.vue 4.6 KB
edit raw normal view history
75990a4d9   Gurvinder Singh   insight added 
1
2
 
  <template>
    <main class="landing-page">
921970bb2   Gurvinder Singh   new files 
3
 
     <div class="container-fluid insights-wrp">
75990a4d9   Gurvinder Singh   insight added 
4
 
        <nav class="navbar navbar-expand-sm spotLight-nav">
921970bb2   Gurvinder Singh   new files 
5
6
7
 
          <a class="navbar-brand" href="#"><img src="../assets/images/logo.png" /></a>
          <div class="user-profile-photo insights-profile">
            <a href="#"><img src="../assets/images/user.png" /></a>
75990a4d9   Gurvinder Singh   insight added 
8
 
          </div>
921970bb2   Gurvinder Singh   new files 
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
 
        </nav><!-- menu wrapper -->
      <div class="clearfix"></div>
    <div class="row">
  <div class="col-lg-12">
  <form class="insights-searh">
    <div class="form-group">
      <input type="text" class="form-control" value="" placeholder="Search Insights Library" id="fname">
      <a href="#"><img src="../assets/images//search-icon.svg" /></a>
    </div>
  </form>
  </div>
    </div><!-- tab style -->
      <div class="row">
  <div class="col-lg-7 mr-auto ml-auto">
  <div class="insights-border"><span>or Filter by</span></div>
  <div class="insights-list-filter">
  <ul>
  <li><a href="" class="lavender-blue-bg">Pricing</a></li>
  <li><a href="" class="golden-tainoi-bg">Design</a></li>
  <li><a href="" class="red-orange-bg">Marketing</a></li>
  <li><a href="" class="morning-glory-bg">Product</a></li>
  <li><a href="" class="dark-green-copper-bg">Psychology</a></li>
  <li><a href="" class="red-orange-bg">Marketing</a></li>
  <li><a href="" class="morning-glory-bg">Product</a></li>
  <li><a href="" class="dark-green-copper-bg">Psychology</a></li>
  </ul>
  </div>
  </div>
  </div>
    <div class="row">
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products radical-red-border">
  <h3 class="radical-red-col">PRODUCT Insight <a href="#"><img src="../assets/images/radical-red-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products selective-yellow-border">
  <h3 class="selective-yellow-col">PRODUCT Insight <a href="#"><img src="../assets/images/selective-yellow-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products lavender-blue-border">
  <h3 class="lavender-blue-col">PRODUCT Insight <a href="#"><img src="../assets/images/lavender-blue-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products dark-green-copper-border">
  <h3 class="dark-green-copper-col">PRODUCT Insight <a href="#"><img src="../assets/images/dark-green-copper-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products purple-heart-border">
  <h3 class="purple-heart-col">PRODUCT Insight <a href="#"><img src="../assets/images/purple-heart-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  <div class="col-lg-4 insight-mb-spc">
  <div class="insights-products silver-border">
  <h3 class="silver-col">PRODUCT Insight <a href="#"><img src="../assets/images/silver-icon.svg"></a></h3>
  <h2>Decide on using multiple call to action vs single call to action depending on the stage of the user journey</h2>
  <p>Marketing 101 teaches us to use one single, call to action (CTA) at the top of the funnel before the uer has shown interest in...</p>
  </div>
  </div>
  </div>
75990a4d9   Gurvinder Singh   insight added 
82
 
        <!-- body wrapper -->
921970bb2   Gurvinder Singh   new files 
83
 
      </div><!-- main wrapper -->
75990a4d9   Gurvinder Singh   insight added 
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
 
      <!-- main wrapper -->
    </main>
  </template>
  
  <script>
  import Vue from "vue";
  import router from "../router";
  
  export default {
    name: "Insight",
  
    data() {
      return {};
    },
    mounted() {},
    methods: {
      goToLogin() {
        this.$router.push("/");
      },
      goToSignUp() {
        this.$router.push("/signup");
      },
      
    },
  };
  </script>