diff --git a/assets/styles/layouts/article/blocks/_alpha.scss b/assets/styles/layouts/article/blocks/_alpha.scss index 0a3199cba..10a894b45 100644 --- a/assets/styles/layouts/article/blocks/_alpha.scss +++ b/assets/styles/layouts/article/blocks/_alpha.scss @@ -22,73 +22,83 @@ .expand { border: none; padding: 0; - } - ul { - padding: 0; - margin: -1rem 0 1.5rem 2rem; - list-style: none; + .expand-content p { + margin-left: 2rem; + } - a { - color: $article-heading; - font-weight: $medium; - position: relative; + ul { - &.discord:before { - content: url('/svgs/discord.svg'); - display: inline-block; - height: 1.1rem; - width: 1.25rem; - vertical-align: top; - margin: 2px .65rem 0 0; - } + margin-top: -1rem; - &.community:before { - content: "\e900"; - color: $article-heading; - margin: 0 .65rem 0 0; - font-size: 1.2rem; - font-family: 'icomoon-v2'; - vertical-align: middle; - } + &.feedback-channels { - &.slack:before { - content: url('/svgs/slack.svg'); - display: inline-block; - height: 1.1rem; - width: 1.1rem; - vertical-align: text-top; - margin-right: .65rem; - } - - &.reddit:before { - content: url('/svgs/reddit.svg'); - display: inline-block; - height: 1.1rem; - width: 1.2rem; - vertical-align: top; - margin: 2px .65rem 0 0; - } - - &::after { - content: "\e90a"; - font-family: 'icomoon-v4'; - font-weight: bold; - font-size: 1.3rem; - display: inline-block; - position: absolute; - @include gradient($grad-burningDusk); - background-clip: text; - -webkit-text-fill-color: transparent; - right: 0; - transform: translateX(.25rem); - opacity: 0; - transition: transform .2s, opacity .2s; - } - - &:hover { - &::after {transform: translateX(1.5rem); opacity: 1;} - } + padding: 0; + margin: -1rem 0 1.5rem 2rem; + list-style: none; + + a { + color: $article-heading; + font-weight: $medium; + position: relative; + + &.discord:before { + content: url('/svgs/discord.svg'); + display: inline-block; + height: 1.1rem; + width: 1.25rem; + vertical-align: top; + margin: 2px .65rem 0 0; + } + + &.community:before { + content: "\e900"; + color: $article-heading; + margin: 0 .65rem 0 0; + font-size: 1.2rem; + font-family: 'icomoon-v2'; + vertical-align: middle; + } + + &.slack:before { + content: url('/svgs/slack.svg'); + display: inline-block; + height: 1.1rem; + width: 1.1rem; + vertical-align: text-top; + margin-right: .65rem; + } + + &.reddit:before { + content: url('/svgs/reddit.svg'); + display: inline-block; + height: 1.1rem; + width: 1.2rem; + vertical-align: top; + margin: 2px .65rem 0 0; + } + + &::after { + content: "\e90a"; + font-family: 'icomoon-v4'; + font-weight: bold; + font-size: 1.3rem; + display: inline-block; + position: absolute; + @include gradient($grad-burningDusk); + background-clip: text; + -webkit-text-fill-color: transparent; + right: 0; + transform: translateX(.25rem); + opacity: 0; + transition: transform .2s, opacity .2s; + } + + &:hover { + &::after {transform: translateX(1.5rem); opacity: 1;} + } + } + } } } } diff --git a/layouts/partials/article/alpha.html b/layouts/partials/article/alpha.html index d9923fe20..034e18e10 100644 --- a/layouts/partials/article/alpha.html +++ b/layouts/partials/article/alpha.html @@ -13,22 +13,39 @@
{{ $displayName }} is in public alpha and available for testing and feedback, - but is not meant for production use. During the alpha period we - may make breaking changes that will require you to blow away your data and start - over. You should have copies of your data in other places during the alpha period. - Both the product and this documentation are works in progress. New builds get - created on every merge into main, so things will be moving quickly for the next - month or so. We welcome and encourage your input about your experience with the alpha. - Get started in minutes - and join our public channels for updates and to share feedback. + but is not meant for production use. + Both the product and this documentation are works in progress. + We welcome and encourage your input about your experience with the alpha. + Get started in minutes + and join our public channels for updates and to share feedback.