diff --git a/aio/src/styles/2-modules/_filetree.scss b/aio/src/styles/2-modules/_filetree.scss index f619a284ff..94dc4a4fee 100644 --- a/aio/src/styles/2-modules/_filetree.scss +++ b/aio/src/styles/2-modules/_filetree.scss @@ -1,38 +1,37 @@ -aio-filetree { +.filetree { background: $offwhite; - box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, .2); - border: 4px solid $lightgray; - margin: 0 0 5px 0; - padding: 10px; - display: flex; - flex-direction: column; - height: 100%; -} + box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12); + border: 2px solid $lightgray; + margin: 0 0 24px 0; + padding: 24px; -aio-folder { + .file { + display: block; + font-family: $main-font; + line-height: 32px; + color: $lightgray; + } + + .children { padding-left: 24px; position: relative; overflow: hidden; - display: flex; - flex-direction: column; -} -aio-file { - display: block; - position: relative; - line-height: 32px; - padding-left: 5px; + .file { + position: relative; - &:before { - content: ''; - left: -18px; - bottom: 16px; - width: 5px; - height: 9999px; - position: absolute; - border-width: 0 0 1px 1px; - border-style: solid; - border-color: $lightgray; - border-radius: 0 0 0 3px; + &:before { + content: ''; + left: -18px; + bottom: 16px; + width: 16px; + height: 9999px; + position: absolute; + border-width: 0 0 1px 1px; + border-style: solid; + border-color: $lightgray; + border-radius: 0 0 0 3px; + } } + } } \ No newline at end of file diff --git a/aio/src/styles/2-modules/_subsection.scss b/aio/src/styles/2-modules/_subsection.scss index f3ee7e6965..eb81602d8a 100644 --- a/aio/src/styles/2-modules/_subsection.scss +++ b/aio/src/styles/2-modules/_subsection.scss @@ -1,7 +1,11 @@ .l-sub-section { color: $darkgray; background-color: $lightgray; - border-left: 10px solid $mediumgray; + border-left: 8px solid $mediumgray; padding: 16px; - margin-bottom: 10px; + margin-bottom: 8px; + + h3 { + margin: 8px 0 0; + } } \ No newline at end of file