에어 테마

기본 색상 스킴에서도 동일한 문제를 확인했습니다. (이전에는 스킴을 변경한 적이 없습니다.)

이상하게도 배경과 아이콘이 동일한 --primary-low-mid 색상을 사용하고 있는데, 해당 부분에 대한 최근 변경 사항을 찾을 수 없습니다. :thinking:

2개의 좋아요

네, 보고해 주셔서 감사합니다. 문제를 찾아서 수정했습니다.

1개의 좋아요

여러분 안녕하세요. 저는 Air 테마를 사용 중인데, 포럼 홈페이지에서 사용자에게 최신 게시물을 표시하고 싶습니다. 하지만 Air 테마는 카테고리만 표시할 뿐, 최신 활동 게시물이 표시되지 않아요 (기본 테마에서는 표시되는데).

모바일 기기의 홈페이지에서 카테고리와 최신 게시물을 모두 표시하려면(카테고리 바로 아래에) 어떻게 해야 하나요?

모두 안녕하세요, 각 주제에 몇 명이 방문했는지 표시할 수 있을까요?

가장 깔끔한 방법은 아닐 수 있지만, 데스크톱 CSS에 다음 줄을 추가하세요

.topic-list-data.num.views {
  display: unset;
}
td.topic-list-data.num.views {
  display: flex;
  order: 4;
  justify-content: center;
  align-items: center;
}
1개의 좋아요

모두 안녕하세요, 방금 Air 테마로 업데이트했습니다. 참고로 이 테마를 정말 좋아합니다.

하지만 예전에는 discourse-trendy-login 플러그인을 사용해 로그인 화면에 배경 이미지를 설정해 두었는데, Air 테마를 사용하게 되자 배경 이미지가 표시되지 않습니다. 어떻게 설정해야 할까요? 미리 감사드립니다.

사이트 링크를 공유해 주시겠어요?

아래가 작동할 것 같아요:

.background-container {
    display: none;
}

작동하지 않는다면 여기서 다시 알려주세요.
1개의 좋아요

제이던, 안녕하세요.

이미지가 포함된 배너를 설정할 때 흥미로운 현상을 겪고 있습니다. 이미지가 늘어나서 가로로 스크롤이 되는 문제가 발생합니다.

반면 원박스(onebox)는 너비를 잘 준수하는 것 같습니다.

아래 이미지는 배너의 상단 바가 오른쪽으로 스크롤되어 클리닝 세드(cleaning sed)와 편집(edit)가 중앙에 위치하도록 된 모습을 보여줍니다.

여러 가지 이미지 크기를 시도해 보았습니다. 해당 토픽에서 사용자용 배너 게시물은 정상적으로 표시됩니다. 또한 RSS 플러그인을 사용하여 가져온 YouTube 박스에도 영향을 미치는 것 같습니다. 일반적인 YouTube 원박스는 테스트하지 않았습니다.

이 문제를 어떻게 수정할 수 있을까요? 그리고 CSS를 사용하여 보이는 배너의 높이를 늘릴 수 있는 방법이 있을까요?

카테고리 페이지에 하위 카테고리를 표시하는 방법에 대해 여러 분들이 질문하셨습니다. 이 글은 Modern Category + Group Boxes 컴포넌트에 관한 것이지만, 해당 컴포넌트에 별도의 주제(topic)가 없기 때문에(맞죠?) 여기서 제 조사 결과를 공유합니다:

다음은 작동하는 코드입니다:

/* Displays subcategories */
.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategories {
  display: inline-flex;
  flex-flow: wrap;
}

.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategory {
  display: inline-flex;
  align-items: baseline;
  margin-right: .3em;
}

/* Removes the category images from the list */
.custom-category-boxes:not(.above-discovery-categories-outlet) .subcategories .subcategory .subcategory-image-placeholder {
  display: none;
}

또한, 하위 카테고리가 많다면 한 줄에 하나의 카테고리씩 표시하는 것을 원할 수 있습니다.

/* One category per row */
.custom-category-boxes:not(.above-discovery-categories-outlet) {
  grid-template-columns: 1fr;
}

결과물은 다음과 같습니다:

박스에는 높이 제한이 있는 것 같지만 이를 제거하는 방법을 아직 찾지 못했습니다. 아직 하위 카테고리가 충분하지 않아 데스크톱에서는 문제가 보이지 않지만, 모바일에서는 한계에 도달하고 있습니다:

이 문제를 해결할 아이디어가 있으신가요?

2개의 좋아요

크롬과 엣지 브라우저에서 이 테마와 함께 반응형 오류가 발생합니다. 파이어폭스에서는 문제가 없습니다.
어떻게 수정할 수 있을까요?
감사합니다.

데스크톱에서 토픽 목록의 아바타를 원형으로 유지하는 방법이 있을까요? 모바일에서는 원형으로 표시되는데, 데스크톱에서는 왜 사각형으로 표시되는지 궁금합니다.

1개의 좋아요

안녕하세요. 제 Air 테마에서 데스크톱 아바타가 모바일과 동일하게 원형으로 표시되고 있습니다.

아바타를 사각형으로 변경하는 컴포넌트가 혹시 있을까요?

원포스트에 따르면 사각형으로 보여야 할 것 같은데…

아니요, 그렇지 않습니다. 저는 Discourse 기본 테마와 Air 테마를 사용하고 있습니다. Discourse 기본 테마는 원형 형식을 사용하고 있습니다. 위 다른 게시판의 이미지를 보면 모두 정사각형입니다.

그리고 아바타가 매끄럽지 않게 보입니다.

1개의 좋아요

이 #customization:theme-component를 사용해 수정할 수 있을 것 같습니다.

2개의 좋아요

제가 필요로 하는 바로 그거네요. 정말 감사합니다!

1개의 좋아요

이 테마의 배경을 어떻게 변경하는지 알려주실 수 있나요?

더 구체적으로 말씀해 주시겠어요? 배경에 사진을 넣을 수 있는 곳이 몇 군데 있습니다.

안녕하세요 @jordan.vidrine. 몇몇 부분에서 콘텐츠 주위에 컨테이너가 없는 것을 확인했습니다.

저는 이러한 요소들을 버블 형태로 처리하는 쪽을 선호합니다. 예를 들어 흰색 배경에서 파란색 배경으로 텍스트가 이동할 때 가독성이 떨어지기 때문입니다.

이것은 배지(Badges)에 해당합니다. 하지만 “Earned …” 부분에서도 같은 문제가 발생합니다.

흰색 직사각형 열 대신 버블 형태를 선호하는 이유는 더 좋은 시각적 효과를 줄 것이라고 생각하기 때문입니다. 이는 다른 플로팅 요소나 모던 카테고리 그룹 헤더에도 적용하면 좋을 것입니다.

1개의 좋아요

에어(Air) 테마의 온라인 사용자 위젯을 지원하기 위한 커스텀:플러그인

커스텀:테마-컴포넌트 생성

공통 CSS를 편집하고 다음 코드를 추가하세요.

// Whis Online Customization
.discovery-list-container-top-outlet.online_users_widget {
      display: flex;
      padding-top: .38em;
      background-color: var(--secondary);
      border: 1px solid rgba(var(--primary-rgb), 0.2);
      border-radius: 0.65em;
      transition: box-shadow 100ms ease-in-out;
      box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
}

에어 테마에서 컴포넌트 활성화

결과: 이전에는 배경색이나 테두리가 없어 보기 어려웠습니다.

이러한 문제가 있는 몇 가지 영역을 수정하고 싶습니다.

예시는 이전 게시물에 나와 있습니다.


편집: 글로벌 배너에 대한 추가 수정 문제

글로벌 배너 사양에 대한 추가 정보:


//global banner image fix
#banner img {
    width: 100%;
    height: auto;
}

이 코드 스니펫을 제공해 주신 @awesomerobot님께 특별한 감사의 말씀을 드립니다.

1개의 좋아요

여러분 안녕하세요, 이 테마에 사용자 지정 CSS를 추가하려고 했는데, 다른 테마 사용자 설정 옵션과 함께 해당 옵션이 보이지 않아요. 제가 놓치고 있는 게 있을까요?