Mirrors/tachiyomi-website
2
0
Fork 0
mirror of https://github.com/tachiyomiorg/website.git synced 2024-12-21 23:51:58 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix side navigation padding outside Help (#204)

Browse Source 
* Only apply Help.vue style to the Help page

* Linting
This commit is contained in:
Soitora 2020-05-16 15:38:40 +02:00 committed by GitHub
parent 9e716b406a
commit 126ec8a287
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 215 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/.vuepress/components/Help.vue
View File

@ -22,7 +22,10 @@
:href="helpItem.link" :href="helpItem.link"
tabindex="1" tabindex="1"
> >
<div class="card" :class="'card__' + helpItem.title"> <div
class="card"
:class="'card__' + helpItem.title"
>
<header v-if="helpItem.faqApp"> <header v-if="helpItem.faqApp">
<CellphoneAndroidIcon /> <CellphoneAndroidIcon />
<h3>{{ helpItem.title }}</h3> <h3>{{ helpItem.title }}</h3>
@ -60,7 +63,10 @@
rel="noreferrer" rel="noreferrer"
tabindex="1" tabindex="1"
> >
<div class="card" :class="'card__' + helpItem.title"> <div
class="card"
:class="'card__' + helpItem.title"
>
<header v-if="helpItem.discord"> <header v-if="helpItem.discord">
<DiscordIcon /> <DiscordIcon />
<span> <span>
@ -125,7 +131,7 @@ export default {
DiscordIcon, DiscordIcon,
RedditIcon, RedditIcon,
GithubIcon, GithubIcon,
LifebuoyIcon LifebuoyIcon,
}, },
computed: { computed: {
@ -145,18 +151,18 @@ export default {
return ( return (
this.algolia && this.algolia.apiKey && this.algolia.indexName this.algolia && this.algolia.apiKey && this.algolia.indexName
); );
} },
} },
}; };
</script> </script>
<style lang="stylus"> <style lang="stylus">
.page .help-page
.page
padding-left 0 !important padding-left 0 !important
padding-bottom 2rem padding-bottom 2rem
display block display block
.theme-custom-content
.theme-custom-content
max-width 75rem max-width 75rem
margin 0 auto margin 0 auto
padding 2rem 2.5rem padding 2rem 2.5rem
@ -181,7 +187,7 @@ export default {
input input
background #ffffff url('/assets/img/search.83621669.svg') 0.6rem 0.9rem no-repeat background #ffffff url('/assets/img/search.83621669.svg') 0.6rem 0.9rem no-repeat
background-size 1rem background-size 1rem
box-shadow 0 0 30px rgba(177,174,174,0.322) box-shadow 0 0 30px rgba(177, 174, 174, 0.322)
border 1px solid #cfd4db border 1px solid #cfd4db
font-size 1.2rem font-size 1.2rem
height 3rem height 3rem
@ -218,7 +224,7 @@ export default {
h3 h3
display inline-block display inline-block
margin-left 1.8rem margin-left 1.8rem
margin-bottom 0px margin-bottom 0
h3 h3
margin 10px margin 10px
p p
@ -227,8 +233,8 @@ export default {
font-size 0.95rem font-size 0.95rem
&:hover &:hover
border-bottom 2px solid $accentColor border-bottom 2px solid $accentColor
border-bottom-left-radius 0px border-bottom-left-radius 0
border-bottom-right-radius 0px border-bottom-right-radius 0
position relative position relative
.material-design-icon .material-design-icon
color $accentColor color $accentColor
@ -252,7 +258,6 @@ export default {
border-bottom 2px solid $githubAccentColor border-bottom 2px solid $githubAccentColor
h3 h3
color $githubAccentColor color $githubAccentColor
.column .column
border 1px solid #cfd4db border 1px solid #cfd4db
border-radius 6px border-radius 6px
@ -264,11 +269,10 @@ export default {
.card .card
box-shadow 0 0 30px #b1aeae52, 0 0 0 1px #fff, 0 0 0 3px rgba(50, 100, 150, 0.4) box-shadow 0 0 30px #b1aeae52, 0 0 0 1px #fff, 0 0 0 3px rgba(50, 100, 150, 0.4)
outline none outline none
.row .row
display grid display grid
grid-template-columns repeat(4, 1fr); grid-template-columns repeat(4, 1fr)
grid-auto-rows: 1fr; grid-auto-rows 1fr
grid-gap 1rem grid-gap 1rem
&:after &:after
content '' content ''
@ -276,6 +280,8 @@ export default {
clear both clear both
@media screen and (max-width $MQMobile) @media screen and (max-width $MQMobile)
.help-page
.page
.theme-custom-content .theme-custom-content
padding 2rem 0.75rem padding 2rem 0.75rem
padding-bottom 0 padding-bottom 0
@ -316,8 +322,8 @@ export default {
right 0 right 0
top -4px top -4px
h3 h3
margin-left 0px margin-left 0
margin-bottom 0px margin-bottom 0
h3 h3
font-size 1.5rem font-size 1.5rem
display inline-block display inline-block
@ -342,9 +348,7 @@ export default {
h3 h3
color $githubAccentColor color $githubAccentColor
.row .row
grid-template-columns repeat(1, 1fr); grid-template-columns repeat(1, 1fr)
.help-page
.navbar .navbar
padding-left 1rem padding-left 1rem
.logo .logo
@ -356,6 +360,7 @@ export default {
.site-name.can-hide .site-name.can-hide
display none display none
.nav-links.can-hide .nav-links.can-hide
.nav-item, .repo-link .nav-item,
.repo-link
padding-left 0.8em padding-left 0.8em
</style> </style>