discourse/app/assets/stylesheets/mobile/lightbox.scss

.lightbox .meta,
.lightbox:hover .meta {
  opacity: 0.7;
  transition: none;
}

.meta {
  align-items: center;
  background: var(--secondary);
  color: var(--primary-high);
  height: 25px;
  width: 25px;
  bottom: 0;
  right: 0;

  .filename,
  .informations,
  .d-icon-far-image {
    display: none;
  }

  .d-icon-discourse-expand {
    color: var(--primary-high);
  }
}
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00			`.lightbox .meta,`
			`.lightbox:hover .meta {`
A more subtle mobile lightbox hint 2018-08-28 14:25:54 -05:00			`opacity: 0.7;`
FIX: Refactor lightbox mobile icon - Fixes a performance issue on a site with lots of images in posts - turns out that "filter: invert(100%)" performs very poorly on Safari/iPhone - also disables transition on the element on mobile 2018-12-06 14:32:26 -06:00			`transition: none;`
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00			`}`

			`.meta {`
A more subtle mobile lightbox hint 2018-08-28 14:25:54 -05:00			`align-items: center;`
FEATURE: automatic dark mode (#10341) A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting. 2020-08-03 21:57:10 -05:00			`background: var(--secondary);`
			`color: var(--primary-high);`
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00			`height: 25px;`
			`width: 25px;`
			`bottom: 0;`
A more subtle mobile lightbox hint 2018-08-28 14:25:54 -05:00			`right: 0;`
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00
			`.filename,`
DEV: Refactor icons used in lightbox HTML Uses <svg> elements instead of hacky CSS pseudoelements Adds a migration to mark posts with lightboxes as needing a rebake 2019-03-22 10:52:06 -05:00			`.informations,`
			`.d-icon-far-image {`
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00			`display: none;`
			`}`
alignment fix 2018-08-28 15:27:34 -05:00
DEV: Refactor icons used in lightbox HTML Uses <svg> elements instead of hacky CSS pseudoelements Adds a migration to mark posts with lightboxes as needing a rebake 2019-03-22 10:52:06 -05:00			`.d-icon-discourse-expand {`
FEATURE: automatic dark mode (#10341) A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting. 2020-08-03 21:57:10 -05:00			`color: var(--primary-high);`
DEV: Refactor icons used in lightbox HTML Uses <svg> elements instead of hacky CSS pseudoelements Adds a migration to mark posts with lightboxes as needing a rebake 2019-03-22 10:52:06 -05:00			`}`
UX: Show only the expand icon in lightboxes on mobile. 2018-08-20 15:08:23 -05:00			`}`