Skip to content

Commit

Permalink
Merge pull request #1277 from EnergySage/persistent-side-nav
Browse files Browse the repository at this point in the history 
feat: made side nav persistent on XL and XXL breakpoints
  • Loading branch information
@ericdouglaspratt
ericdouglaspratt authored Apr 17, 2024
2 parents cac2880 + afd2fd1 commit d255068
Show file tree
Hide file tree
Showing 8 changed files with 167 additions and 130 deletions.
22 changes: 11 additions & 11 deletions es-design-system/components/ds-atoms-list.vue
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
<template>
<ul>
<ul class="list-unstyled pl-100">
<li>
<b-link to="/atoms/color">
<ds-link to="/atoms/color">
Color
</b-link>
</ds-link>
</li>
<li>
<b-link to="/atoms/typography">
<ds-link to="/atoms/typography">
Typography
</b-link>
</ds-link>
</li>
<li>
<b-link to="/atoms/layout">
<ds-link to="/atoms/layout">
Layout
</b-link>
</ds-link>
</li>
<li>
<b-link to="/atoms/spacing">
<ds-link to="/atoms/spacing">
Spacing
</b-link>
</ds-link>
</li>
<li>
<b-link to="/atoms/icons">
<ds-link to="/atoms/icons">
Icons
</b-link>
</ds-link>
</li>
</ul>
</template>
Expand Down
18 changes: 9 additions & 9 deletions es-design-system/components/ds-examples-list.vue
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
<template>
<ul>
<ul class="list-unstyled pl-100">
<li>
<b-link :to="{ name: 'examples-nuxt-components___en' }">
<ds-link to="/examples/nuxt-components">
Nuxt Components
</b-link>
</ds-link>
</li>
<li>
<b-link :to="{ name: 'examples-form-field-validation___en' }">
<ds-link to="/examples/form-field-validation">
Form with Field Validation
</b-link>
</ds-link>
</li>
<li>
<b-link :to="{ name: 'examples-form-validation___en' }">
<ds-link to="/examples/form-validation">
Form with (form level) Validation
</b-link>
</ds-link>
</li>
<li>
<b-link :to="{ name: 'examples-file-upload___en' }">
<ds-link to="/examples/file-upload">
File Upload
</b-link>
</ds-link>
</li>
</ul>
</template>
Expand Down
32 changes: 16 additions & 16 deletions es-design-system/components/ds-link-list.vue
View file
Original file line number Diff line number Diff line change
@@ -1,43 +1,43 @@
<template>
<ul>
<ul class="ds-link-list list-unstyled">
<li>
<div class="h4">
<b-link to="/">
Bootstrap 4
</b-link>
<ds-link to="/">
Home
</ds-link>
</div>
</li>
<li>
<div class="h4">
<b-link to="/atoms">
<ds-link to="/atoms">
Atoms
</b-link>
</ds-link>
</div>
<DsAtomsList />
<ds-atoms-list class="mb-100" />
</li>
<li>
<div class="h4">
<b-link to="/molecules">
<ds-link to="/molecules">
Molecules
</b-link>
</ds-link>
</div>
<DsMoleculesList />
<ds-molecules-list class="mb-100" />
</li>
<li>
<div class="h4">
<b-link to="/organisms">
<ds-link to="/organisms">
Organisms
</b-link>
</ds-link>
</div>
<DsOrganismsList />
<ds-organisms-list class="mb-100" />
</li>
<li>
<div class="h4">
<b-link to="/examples">
<ds-link to="/examples">
Examples
</b-link>
</ds-link>
</div>
<DsExamplesList />
<ds-examples-list class="mb-100" />
</li>
</ul>
</template>
Expand Down
25 changes: 25 additions & 0 deletions es-design-system/components/ds-link.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
<template>
<component
:is="element"
class="font-weight-semibold"
:to="to">
<slot />
</component>
</template>

<script>
export default {
name: 'DsLink',
props: {
to: {
type: String,
required: true,
},
},
computed: {
element() {
return this.$route.path === this.to ? 'div' : 'b-link';
},
},
};
</script>
102 changes: 51 additions & 51 deletions es-design-system/components/ds-molecules-list.vue
View file
Original file line number Diff line number Diff line change
@@ -1,129 +1,129 @@
<template>
<ul>
<ul class="list-unstyled pl-100">
<li>
<b-link to="/molecules/es-accordion">
<ds-link to="/molecules/es-accordion">
EsAccordion
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-badge">
<ds-link to="/molecules/es-badge">
EsBadge
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-breadcrumbs">
<ds-link to="/molecules/es-breadcrumbs">
EsBreadcrumbs
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-button">
<ds-link to="/molecules/es-button">
EsButton
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-card">
<ds-link to="/molecules/es-card">
EsCard
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-collapse">
<ds-link to="/molecules/es-collapse">
EsCollapse
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-data-table">
<ds-link to="/molecules/es-data-table">
EsDataTable
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-file-input">
<ds-link to="/molecules/es-file-input">
EsFileInput
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-form-input">
<ds-link to="/molecules/es-form-input">
EsFormInput
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-form-msg">
<ds-link to="/molecules/es-form-msg">
EsFormMsg
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-form-radio-cards">
<ds-link to="/molecules/es-form-radio-cards">
EsFormRadioCards
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-form-textarea">
<ds-link to="/molecules/es-form-textarea">
EsFormTextarea
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-horizontal-list">
<ds-link to="/molecules/es-horizontal-list">
EsHorizontalList
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-modal">
<ds-link to="/molecules/es-modal">
EsModal
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-pagination">
<ds-link to="/molecules/es-pagination">
EsPagination
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-popover">
<ds-link to="/molecules/es-popover">
EsPopover
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-progress">
<ds-link to="/molecules/es-progress">
EsProgress
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-progress-circle">
<ds-link to="/molecules/es-progress-circle">
EsProgressCircle
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-rating">
<ds-link to="/molecules/es-rating">
EsRating
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-slider">
<ds-link to="/molecules/es-slider">
EsSlider
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-support">
<ds-link to="/molecules/es-support">
EsSupport
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-tabs">
<ds-link to="/molecules/es-tabs">
EsTabs
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-verification-code">
<ds-link to="/molecules/es-verification-code">
EsVerificationCode
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-video">
<ds-link to="/molecules/es-video">
EsVideo
</b-link>
</ds-link>
</li>
<li>
<b-link to="/molecules/es-view-more">
<ds-link to="/molecules/es-view-more">
EsViewMore
</b-link>
</ds-link>
</li>
</ul>
</template>
Expand Down
Loading

0 comments on commit d255068

Please sign in to comment.