mirror of
https://github.com/oceanprotocol/docs.git
synced 2024-11-26 19:49:26 +01:00
visual hierarchy styling
This commit is contained in:
parent
0f66a8cc99
commit
497a7cebcc
@ -48,7 +48,7 @@ module.exports = {
|
|||||||
{
|
{
|
||||||
resolve: 'gatsby-remark-images',
|
resolve: 'gatsby-remark-images',
|
||||||
options: {
|
options: {
|
||||||
maxWidth: 640,
|
maxWidth: 666,
|
||||||
quality: 80,
|
quality: 80,
|
||||||
withWebp: true,
|
withWebp: true,
|
||||||
linkImagesToOriginal: false,
|
linkImagesToOriginal: false,
|
||||||
|
@ -1,7 +1,11 @@
|
|||||||
@import 'variables';
|
@import 'variables';
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
padding: 0 $spacer;
|
padding: 0 $spacer / 2;
|
||||||
max-width: $break-point--large;
|
max-width: $break-point--large;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
|
||||||
|
@media (min-width: $break-point--small) {
|
||||||
|
padding: 0 $spacer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,10 +2,7 @@
|
|||||||
|
|
||||||
.footer {
|
.footer {
|
||||||
margin-top: $spacer;
|
margin-top: $spacer;
|
||||||
padding-top: $spacer;
|
|
||||||
margin-bottom: $spacer;
|
margin-bottom: $spacer;
|
||||||
padding-bottom: $spacer;
|
|
||||||
border-top: .1rem solid $brand-grey-lighter;
|
|
||||||
font-size: $font-size-small;
|
font-size: $font-size-small;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
|
@ -3,6 +3,7 @@
|
|||||||
.repository {
|
.repository {
|
||||||
padding: $spacer / $line-height;
|
padding: $spacer / $line-height;
|
||||||
border: 1px solid $brand-grey-lighter;
|
border: 1px solid $brand-grey-lighter;
|
||||||
|
background: $brand-white;
|
||||||
border-radius: $border-radius;
|
border-radius: $border-radius;
|
||||||
margin-bottom: 4%;
|
margin-bottom: 4%;
|
||||||
|
|
||||||
|
@ -28,14 +28,14 @@
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
padding: $spacer $spacer * $line-height;
|
padding: $spacer $spacer * $line-height;
|
||||||
border-radius: $border-radius;
|
border-radius: $border-radius;
|
||||||
box-shadow: rgba($brand-black, .15) 0px 9px 18px;
|
box-shadow: rgba($brand-black, .1) 0px 9px 18px;
|
||||||
color: $brand-grey;
|
color: $brand-grey;
|
||||||
background: $brand-white;
|
background: $brand-white;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
&:hover,
|
&:hover,
|
||||||
&:focus {
|
&:focus {
|
||||||
box-shadow: rgba($brand-black, .15) 0px 12px 20px;
|
box-shadow: rgba($brand-black, .1) 0px 12px 20px;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
transform: translate3d(.2rem, 0, 0);
|
transform: translate3d(.2rem, 0, 0);
|
||||||
|
@ -17,7 +17,7 @@ body {
|
|||||||
font-family: $font-family-base;
|
font-family: $font-family-base;
|
||||||
font-weight: $font-weight-base;
|
font-weight: $font-weight-base;
|
||||||
line-height: $line-height;
|
line-height: $line-height;
|
||||||
background: $brand-white;
|
background: darken($brand-white, 1%);
|
||||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
@ -7,17 +7,30 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
flex: 0 0 30%;
|
flex: 0 0 27%;
|
||||||
padding-right: $spacer * 2;
|
padding-right: $spacer;
|
||||||
margin-top: $spacer / 2;
|
margin-top: $spacer / 2;
|
||||||
|
position: sticky;
|
||||||
|
top: $spacer;
|
||||||
|
|
||||||
+ .main {
|
+ .main {
|
||||||
flex: 0 0 70%;
|
flex: 0 0 73%;
|
||||||
max-width: $break-point--small;
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
background: $brand-white;
|
||||||
|
padding: 0 $spacer;
|
||||||
|
border: 1px solid $brand-grey-lighter;
|
||||||
|
|
||||||
|
@media (min-width: $break-point--medium) {
|
||||||
|
padding: 0 $spacer * 2;
|
||||||
|
border-top: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mainSingle {
|
.mainSingle {
|
||||||
|
composes: main;
|
||||||
max-width: $break-point--small;
|
max-width: $break-point--small;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user