@ptcwebops/ptcw-design 6.3.30-beta → 6.3.30

package/dist/collection/stories/organisms/eSupport/SupportPage/preview.stories.js

@@ -1,157 +0,0 @@
-import { html } from 'lit';
-
-export default  {
-    title: 'Organisms/E-Support Organisms/Support Page'
-
-}
-const SupportPage = args => {
-    return html `
-
-    <ptc-spacer></ptc-spacer>
-  <ptc-spacer></ptc-spacer>
-  <ptc-spacer></ptc-spacer>
-  <ptc-spacer></ptc-spacer>
-  <div class="ptc-container is-grid has-col-gap green-container">
-    <div class="is-col-12 is-col-7-md search-container">
-
-      <ptc-spacer></ptc-spacer>
-      <ptc-spacer></ptc-spacer>
-      <ptc-spacer></ptc-spacer>
-      <ptc-title type="h2" text-align="center" title-size="x-large" title-color="white" upperline="no-upperline" title-display="inline-block" title-shadow="" title-height="densest" title-margin="margin-3" title-weight="w-8" is-plm-hub="false">
-        Search the Knowledge Base
-      </ptc-title>
-      <ptc-search-field  placeholder-label="Search Technical Support Documentation and Articles" ></ptc-search-field>
-    </div>
-    <div class="is-col-12 is-col-5-md form-section">
-      <ptc-title upperline="none">Popular Tasks</ptc-title>
-      <!-- <ul> -->
-        <ptc-link>Product Pages</ptc-link>
-        <ptc-link>Product Pages</ptc-link>
-        <ptc-link>Product Pages</ptc-link>
-        <ptc-link>Product Pages</ptc-link>
-      
-    </div>
-  </div>
-
-  <ptc-spacer></ptc-spacer>
-  <ptc-spacer></ptc-spacer>
-  
-  <div class="ptc-container is-grid has-col-gap link-container ">
-    <div class="is-col-1"></div>
-    <div class="is-col-2 links"><ptc-link>Support</ptc-link>
-      <button class="btn" role="button" >
-      <span class="arrow">
-        <icon-asset slot="icon" type="solid" size="large" name="arrow-down" color="ptc-green"></icon-asset>
-      </span>
-      </button>
-    </div>
-    <div class="is-col-2 llinks"><ptc-link>Manage and monitor software</ptc-link>
-      <button class="btn" role="button" >
-        <span class="arrow">
-          <icon-asset slot="icon" type="solid" size="large" name="arrow-down" color="ptc-green"></icon-asset>
-        </span>
-        </button>
-    </div>
-    <div class="is-col-2 llinks"><ptc-link>Learn</ptc-link>
-      <button class="btn" role="button" >
-        <span class="arrow">
-          <icon-asset slot="icon" type="solid" size="large" name="arrow-down" color="ptc-green"></icon-asset>
-        </span>
-        </button>
-    </div>
-    <div class="is-col-2 llinks"><ptc-link>Service and Expertise</ptc-link>
-      <button class="btn" role="button" >
-        <span class="arrow">
-          <icon-asset slot="icon" type="solid" size="large" name="arrow-down" color="ptc-green"></icon-asset>
-        </span>
-        </button>
-    </div>
-    <div class="is-col-2 llinks"><ptc-link>PTC Partner Network</ptc-link>
-      <button class="btn" role="button" >
-        <span class="arrow">
-          <icon-asset slot="icon" type="solid" size="large" name="arrow-down" color="ptc-green"></icon-asset>
-        </span>
-        </button>
-    </div>
-    <div class="is-col-1 links"></div>
-  </div>
- <style>
-   
-
-   .btn {
-      display: none;
-      padding: 10px;
-      font-size: 16px;
-      font-weight: 500;
-      border: none;
-      background-color: transparent;
-      cursor: pointer;
-      align-items: center;
-      span {
-        margin-right: 8px;
-        align-items: center;
-      }
-      
-
-      
-   }
-
-  .llinks:hover  .btn {
-      display: block;
-      
-      
-  }
-
-  .links:hover  .btn {
-      display: flex;
-  }
-  .green-container {
-    background-color:#b3dda4 ;
-    padding: 10px;
-    .search-container{
-      background-color: #00890B;
-      padding:10px;
-      align-items: center;
-    }
-    .form-section {
-      background-color: white;
-      padding: 10px;
-
-      ptc-link {
-        padding: 5px;
-      }
-    }
-  }
-  .links {
-    align-content: center;
-    text-align: center;
-    padding-bottom: 16px;
-    align-items: center;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content:  space-between;
-  }
-
-  .llinks {
-    align-content: center;
-    text-align: center;
-    padding-bottom: 16px;
-    border-left: solid 2px #b3dda4;
-    padding: 10px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: space-between;
-
-  }
-  .link-container {
-    border-bottom: solid 2px #b3dda4;
-    /* margin: 15px; */
-  }
-
-  
-</style> 
-    `;}
-
-export const Preview = SupportPage.bind();