github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-30 08:43:45 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity
18c542dc02
discourse/app/assets/stylesheets/common/base/sidebar-more-section-links.scss

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

51 lines
1.2 KiB
SCSS
Raw Normal View History

UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
.sidebar-more-section-links-details {
UX: sidebar styling, spacing consistency, etc (#18059)
2022-08-24 09:33:15 +08:00
&:focus-within,
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
&:hover {
background: var(--d-sidebar-highlight-color);
}
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
.sidebar-more-section-links-details-summary {
UX: sidebar focus styles, remove hover for touch (#17713)
2022-07-29 01:04:00 +08:00
color: var(--primary-high);
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
transition: background-color 0.25s;
UX: sidebar focus styles, remove hover for touch (#17713)
2022-07-29 01:04:00 +08:00
display: flex;
align-items: center;
list-style: none;
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
box-sizing: border-box;
UX: sidebar focus styles, remove hover for touch (#17713)
2022-07-29 01:04:00 +08:00
UX: Add icons to all section links in Sidebar (#18378) This commit introduces an icon to all links in the sidebar. If an icon has not been configured, we will fall back to a generic "link" icon. As part of this commit, we also standardised the size of each prefix to 20px by 20px and set a fix margin. This is to allow sufficient space for text prefixes and image prefixes to be displayed. Tests have been intentionally left out for now as I don't feel like asserting for the icons will bring much value at this point. Time shall prove me wrong. Co-authored-by: awesomerobot <kris.aubuchon@discourse.org>
2022-09-29 12:28:01 +08:00
.sidebar-more-section-links-icon-wrapper {
display: flex;
align-items: center;
justify-content: center;
width: var(--d-sidebar-section-link-prefix-width);
height: var(--d-sidebar-section-link-prefix-width);
margin-right: var(--d-sidebar-section-link-prefix-margin-right);
.d-icon {
color: var(--primary-medium);
font-size: var(--font-down-1);
}
UX: sidebar focus styles, remove hover for touch (#17713)
2022-07-29 01:04:00 +08:00
}
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
&::before {
display: none;
}
}
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
.sidebar-more-section-links-details-content-wrapper {
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
position: absolute;
width: 100%;
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
z-index: z("modal", "content") + 1;
background: transparent;
}
FEATURE: Add review link to community section for logged in user (#18374) When there are pending reviewables, the review section link is displayed in the main section. When there are no pending reviewables, the review section link is displayed under the more links drawer. Internal ref: /t/74210
2022-09-28 09:58:07 +08:00
.sidebar-more-section-links-details-content {
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
background-color: var(--secondary);
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
box-shadow: shadow("dropdown");
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
margin: 0 calc(var(--d-sidebar-row-horizontal-padding) * 2 / 3);
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
UX: Revamp styling of sidebar The following changes are made in this commit: 1. Move caret icon in sidebar section header to the right. 1. Each row in sidebar takes the full width which enables us to do a full width highlight on hover and when sidebar link is active. 1. Ensure each row in Sidebar is of the same height. Internal refs: /t/70546, /t/72196, /t/71820
2022-08-18 15:03:28 +08:00
.sidebar-row {
FIX: Replace R2 gem with rtlcss for generating RTL CSS (#19636) We've had a couple of problems with the R2 gem where it generated a broken RTL CSS bundle that caused a badly broken layout when Discourse is used in an RTL language, see a3ce93b and 5926386. For this reason, we're replacing R2 with `rtlcss` that can handle modern CSS features better than R2 does. `rltcss` is written in JS and available as an npm package. Calling the `rltcss` from rubyland is done via the `rtlcss_wrapper` gem which contains a distributable copy of the `rtlcss` package and loads/calls it with Mini Racer. See https://github.com/discourse/rtlcss_wrapper for more details. Internal topic: t/76263.
2023-02-01 19:21:15 +08:00
padding: 0.33rem calc(var(--d-sidebar-row-horizontal-padding) / 3);
UX: Reduce number of links displayed in Community by default (#17703) Additional links are hidden by default and can be accessed via the "more..." link.
2022-07-28 16:46:46 +08:00
}
}
}
Reference in New Issue Copy Permalink