diff --git a/themes/vue/layout/partials/header.ejs b/themes/vue/layout/partials/header.ejs index 0816e99d41..a916a038f7 100644 --- a/themes/vue/layout/partials/header.ejs +++ b/themes/vue/layout/partials/header.ejs @@ -1,9 +1,9 @@ diff --git a/themes/vue/layout/partials/main_menu.ejs b/themes/vue/layout/partials/main_menu.ejs index 7474e22f56..f0cb3d32b2 100644 --- a/themes/vue/layout/partials/main_menu.ejs +++ b/themes/vue/layout/partials/main_menu.ejs @@ -1,8 +1,4 @@ -
  • -
    - -
    -
  • + <%- partial('partials/learn_dropdown') %> <%- partial('partials/ecosystem_dropdown') %>
  • @@ -10,3 +6,9 @@
  • <%- partial('partials/support_vue_dropdown') %> <%- partial('partials/language_dropdown') %> + +
  • +
    + +
    +
  • \ No newline at end of file diff --git a/themes/vue/source/css/_ad.styl b/themes/vue/source/css/_ad.styl index 253b7cd19e..aa048c40cb 100644 --- a/themes/vue/source/css/_ad.styl +++ b/themes/vue/source/css/_ad.styl @@ -5,7 +5,7 @@ position: fixed z-index: 99 bottom: 10px - right: 10px + left: 10px padding: 10px background-color: #fff border-radius: 3px diff --git a/themes/vue/source/css/_common.styl b/themes/vue/source/css/_common.styl index 7c84f711a1..023a7ca0ae 100644 --- a/themes/vue/source/css/_common.styl +++ b/themes/vue/source/css/_common.styl @@ -41,6 +41,8 @@ code margin: 0 2px border-radius: 2px white-space: nowrap + text-align: left + direction: ltr em color: $light @@ -63,7 +65,7 @@ input.button text-indent: 1.4em; > svg position: absolute - left: 0.4em + right: 0.4em top: 0.4em width: 2em &.white @@ -79,7 +81,9 @@ input.button z-index: 1 padding: 0 60px 30px overflow-x: hidden - + text-align: right + direction: rtl + #nav .nav-link cursor: pointer @@ -101,7 +105,7 @@ input.button overflow-y: auto position: absolute top: 100% - right: -15px + left: -20px background-color: #fff padding: 10px 0 border: 1px solid #ddd diff --git a/themes/vue/source/css/_demo.styl b/themes/vue/source/css/_demo.styl index d83b11062b..1477797835 100644 --- a/themes/vue/source/css/_demo.styl +++ b/themes/vue/source/css/_demo.styl @@ -9,6 +9,9 @@ -ms-user-select: none user-select: none overflow-x: auto + &.ltr + text-align: left + direction: ltr h1 margin: 0 0 .5em font-size: 1.8em diff --git a/themes/vue/source/css/_header.styl b/themes/vue/source/css/_header.styl index b63e8c62c9..0b0aff5eb5 100644 --- a/themes/vue/source/css/_header.styl +++ b/themes/vue/source/css/_header.styl @@ -30,7 +30,7 @@ body.docs margin: 0 padding: 0 position: absolute - right: 30px + left: 80px top: $heading-padding-vertical height: $header-height line-height: $header-height @@ -42,6 +42,7 @@ body.docs margin: 0 .6em .nav-dropdown + text-align: right .nav-link &:hover, &.current border-bottom: none @@ -93,7 +94,7 @@ body.docs color: $dark outline: none border-radius: 15px - margin-right: 10px + margin-left: 10% transition: border-color .2s ease background: #fff url(../images/search.png) 8px 5px no-repeat background-size: 20px @@ -108,9 +109,11 @@ body.docs color: $dark font-family: $logo-font font-weight: 500 + position: absolute + left: 89% img vertical-align: middle - margin-right: 6px + margin-left: 6px width: $header-height height: $header-height diff --git a/themes/vue/source/css/_scrimba.styl b/themes/vue/source/css/_scrimba.styl index be2cd296a5..d754b20fc8 100644 --- a/themes/vue/source/css/_scrimba.styl +++ b/themes/vue/source/css/_scrimba.styl @@ -7,7 +7,10 @@ a color #486491 !important position relative - padding-left 36px + padding-right 36px + display block + font-weight normal !important + line-height 25px &:before content '' position absolute @@ -15,7 +18,7 @@ width 30px height 30px top -5px - left -4px + right -4px border-radius 50% background-color #73abfe &:after @@ -25,7 +28,7 @@ width 0 height 0 top 5px - left 8px + right 6px border-top 5px solid transparent border-bottom 5px solid transparent border-left 8px solid #fff diff --git a/themes/vue/source/css/_sidebar.styl b/themes/vue/source/css/_sidebar.styl index 7389f74556..7eed122a78 100644 --- a/themes/vue/source/css/_sidebar.styl +++ b/themes/vue/source/css/_sidebar.styl @@ -2,9 +2,11 @@ .sidebar position: absolute + direction: ltr + border-left: solid 1px #eee z-index: 10 top: $header-height - left: 0 + right: 0 bottom: 0 overflow-x: hidden overflow-y: auto @@ -20,13 +22,15 @@ li margin-top: .5em .sidebar-inner + direction rtl width: 260px - padding: $content-padding-top + 40px 0px 60px 20px + padding: $content-padding-top + 40px 20px 60px 0px .version-select vertical-align: middle margin-left: 5px .menu-root padding-left: 0 + padding-inline-start: 0 .sidebar-link color: $light &.current @@ -63,19 +67,21 @@ margin: 0 @media screen and (max-width: 900px) + #ad + display: none .sidebar position: fixed z-index: 10 background-color: #f9f9f9 height: 100% top: 0 - left: 0 + right: 0 box-shadow: 0 0 10px rgba(0,0,0,.2) transition: all .4s cubic-bezier(0.4, 0, 0, 1) - -webkit-transform: translate(-280px, 0) - transform: translate(-280px, 0) + -webkit-transform: translate(280px, 0) + transform: translate(280px, 0) .sidebar-inner - padding: 50px 10px 10px 20px + padding: 10px 10px 10px 20px box-sizing: border-box .sidebar-inner-index padding: 10px 10px 10px 20px @@ -87,6 +93,11 @@ &.open -webkit-transform: translate(0, 0) transform: translate(0, 0) + padding-inline-start: 10px + ul + padding-inline-start: 10px + div.list + display: none @media print .sidebar diff --git a/themes/vue/source/css/_sponsors-index.styl b/themes/vue/source/css/_sponsors-index.styl index 3290e2bcda..1d542e2859 100644 --- a/themes/vue/source/css/_sponsors-index.styl +++ b/themes/vue/source/css/_sponsors-index.styl @@ -1,4 +1,5 @@ #sponsors + direction: rtl text-align: center padding: 35px 40px 45px background-color: #f6f6f6 diff --git a/themes/vue/source/css/_sponsors-sidebar.styl b/themes/vue/source/css/_sponsors-sidebar.styl index 1cada3a13d..b5e35a9774 100644 --- a/themes/vue/source/css/_sponsors-sidebar.styl +++ b/themes/vue/source/css/_sponsors-sidebar.styl @@ -36,7 +36,7 @@ position fixed z-index 99 top 90px - right 20px + left 20px @media screen and (min-width: 1300px) #sidebar-sponsors-platinum-left diff --git a/themes/vue/source/css/_syntax.styl b/themes/vue/source/css/_syntax.styl index ea683ac95a..56424af1d8 100644 --- a/themes/vue/source/css/_syntax.styl +++ b/themes/vue/source/css/_syntax.styl @@ -12,6 +12,10 @@ pre code display: block .hljs + &-comment + display inline-block + direction rtl + &-tag, &-tag &-title, &-change, diff --git a/themes/vue/source/css/_vue-mastery.styl b/themes/vue/source/css/_vue-mastery.styl index 57ed75d303..d7bedab018 100644 --- a/themes/vue/source/css/_vue-mastery.styl +++ b/themes/vue/source/css/_vue-mastery.styl @@ -8,7 +8,10 @@ a color #486491 !important position relative - padding-left 36px + padding-right 36px + display block + font-weight normal !important + line-height 25px &:before content '' position absolute @@ -16,7 +19,7 @@ width 30px height 30px top -5px - left -4px + right -4px border-radius 50% background-color #73abfe &:after @@ -26,7 +29,7 @@ width 0 height 0 top 5px - left 8px + right 6px border-top 5px solid transparent border-bottom 5px solid transparent - border-left 8px solid #fff \ No newline at end of file + border-left 8px solid #fff diff --git a/themes/vue/source/css/index.styl b/themes/vue/source/css/index.styl index 3795a04679..fa4fc3fc9a 100644 --- a/themes/vue/source/css/index.styl +++ b/themes/vue/source/css/index.styl @@ -29,6 +29,7 @@ body #hero, #news + direction: rtl padding: $space 40px 30px background-color: #fff .inner @@ -44,12 +45,13 @@ body .hero-logo width: 215px height: 215px - float: right - margin-right: 60px + float: left + margin-left: 60px h1 - font-weight: 300 + font-weight: 200 margin: 0 - font-size: 3.2em + font-size: 2.5em + line-height: 2em h2 font-family: $logo-font font-weight: 500 @@ -88,7 +90,7 @@ body .newsletter-input width: 100% box-sizing: border-box - padding: 10px 80px 10px 20px + padding: 10px 20px 10px 80px height: 50px border-radius: 50px border: 1px solid #ccc @@ -101,7 +103,7 @@ body padding: 4px 20px margin: 0 height: calc(100% - 8px) - right: 4px + left: 4px top: 4px #special-sponsor @@ -121,6 +123,7 @@ body #highlights background-color: #fff padding-bottom: 70px + direction: rtl .inner max-width: $width margin: 0 auto @@ -144,6 +147,7 @@ body padding: $space 0 color: #fff text-align: center + direction: rtl .social-icon margin 0 5px svg diff --git a/themes/vue/source/css/page.styl b/themes/vue/source/css/page.styl index c229717971..6f3474b629 100644 --- a/themes/vue/source/css/page.styl +++ b/themes/vue/source/css/page.styl @@ -54,7 +54,7 @@ display: inline-block vertical-align: middle width: 280px - margin-left: 20px + margin-right: 20px h1 margin: 0 0 1em h2, h3 @@ -80,9 +80,9 @@ content: "#" color: $green position: absolute - left: -0.7em + right: -0.7em margin-top: -0.05em - padding-right: 0.5em + padding-left: 0.5em font-size: 1.2em line-height: 1 font-weight: bold @@ -138,12 +138,14 @@ background-color: #f8f8f8 code background-color: #efefef + text-align: left + direction: ltr p &.tip, &.success padding: 12px 24px 12px 30px margin: 2em 0 - border-left-width: 4px - border-left-style: solid + border-right-width: 4px + border-right-style: solid background-color: $codebg position: relative border-bottom-right-radius: $radius @@ -151,7 +153,7 @@ &:before position: absolute top: 14px - left: -12px + right: -12px color: #fff width: 20px height: 20px @@ -166,12 +168,12 @@ em color: $medium &.tip - border-left-color: $red + border-right-color: $red &:before content: "!" background-color: $red &.success - border-left-color: $green + border-right-color: $green &:before content: "\f00c" font-family: FontAwesome @@ -181,6 +183,10 @@ margin-top: 2em height: 1em +/* just for display the table in ltr */ +.installation-guide + table + direction: ltr; .footer color: $light margin-top: 2em @@ -204,8 +210,8 @@ position: relative padding: 0 bottom: 0 - right: 0 - float: right + left: 0 + float: left padding: 0 0 20px 30px @media screen and (max-width: 900px)