198 lines · 4.1 KB · CSS
RawDownload
/* based on Fomantic UI segment module, with just the parts extracted that we use. If you find any   unused rules here after refactoring, please remove them. */ .ui.segment {  position: relative;  margin: 1rem 0;  padding: 1em;  border-radius: 0.28571429rem;  border: 1px solid var(--color-secondary);  background: var(--color-box-body);  color: var(--color-text);}.ui.segment:first-child {  margin-top: 0;}.ui.segment:last-child {  margin-bottom: 0;} .ui.grid.segment {  margin: 1rem 0;  border-radius: 0.28571429rem;} .ui.segment.tab:last-child {  margin-bottom: 1rem;} .ui.segments {  flex-direction: column;  position: relative;  margin: 1rem 0;  border: 1px solid var(--color-secondary);  border-radius: 0.28571429rem;  background: var(--color-box-body);  color: var(--color-text);}.ui.segments:first-child {  margin-top: 0;}.ui.segments:last-child {  margin-bottom: 0;} .ui.segments > .segment {  top: 0;  bottom: 0;  border-radius: 0;  margin: 0;  width: auto;  box-shadow: none;  border: none;  border-top: 1px solid var(--color-secondary);}.ui.segments:not(.horizontal) > .segment:first-child {  top: 0;  bottom: 0;  border-top: none;  margin-top: 0;  margin-bottom: 0;  border-radius: 0.28571429rem 0.28571429rem 0 0;} .ui.segments:not(.horizontal) > .segment:last-child {  top: 0;  bottom: 0;  margin-top: 0;  margin-bottom: 0;  border-radius: 0 0 0.28571429rem 0.28571429rem;} .ui.segments:not(.horizontal) > .segment:only-child {  border-radius: 0.214285717rem;}.ui.segments:not(.horizontal) > .segment:has(~ .tw-hidden) { /* workaround issue with :last-child ignoring hidden elements */  border-radius: 0.28571429rem;} .ui.segments > .ui.segments {  border-top: 1px solid var(--color-secondary);  margin: 1rem;}.ui.segments > .segments:first-child {  border-top: none;}.ui.segments > .segment + .segments:not(.horizontal) {  margin-top: 0;} .ui.horizontal.segments {  display: flex;  flex-direction: row;  background-color: transparent;  padding: 0;  margin: 1rem 0;  border-radius: 0.28571429rem;  border: 1px solid var(--color-secondary);} .ui.horizontal.segments > .segment {  margin: 0;  min-width: 0;  border-radius: 0;  border: none;  box-shadow: none;  border-left: 1px solid var(--color-secondary);} .ui.segments > .horizontal.segments:first-child {  border-top: none;}.ui.horizontal.segments:not(.stackable) > .segment:first-child {  border-left: none;}.ui.horizontal.segments > .segment:first-child {  border-radius: 0.28571429rem 0 0 0.28571429rem;}.ui.horizontal.segments > .segment:last-child {  border-radius: 0 0.28571429rem 0.28571429rem 0;} .ui.clearing.segment::after {  content: "";  display: block;  clear: both;} .ui[class*="left aligned"].segment {  text-align: left;}.ui[class*="center aligned"].segment {  text-align: center;} .ui.secondary.segment {  background: var(--color-secondary-bg);  color: var(--color-text-light);} .ui.attached.segment {  top: 0;  bottom: 0;  border-radius: 0;  margin: 0 -1px;  width: calc(100% + 2px);  max-width: calc(100% + 2px);  box-shadow: none;  border: 1px solid var(--color-secondary);  background: var(--color-box-body);  color: var(--color-text);}.ui.attached:not(.message) + .ui.attached.segment:not(.top) {  border-top: none;} .ui[class*="top attached"].segment {  bottom: 0;  margin-bottom: 0;  top: 0;  margin-top: 1rem;  border-radius: 0.28571429rem 0.28571429rem 0 0;}.ui.segment[class*="top attached"]:first-child {  margin-top: 0;} .ui.segment[class*="bottom attached"] {  bottom: 0;  margin-top: 0;  top: 0;  margin-bottom: 1rem;  border-radius: 0 0 0.28571429rem 0.28571429rem;}.ui.segment[class*="bottom attached"]:last-child {  margin-bottom: 1rem;} .ui.fitted.segment:not(.horizontally) {  padding-top: 0;  padding-bottom: 0;}.ui.fitted.segment:not(.vertically) {  padding-left: 0;  padding-right: 0;} .ui.segments .segment,.ui.segment {  font-size: 1rem;} .ui.error.segment {  border-color: var(--color-error-border) !important;} .ui.warning.segment {  border-color: var(--color-warning-border) !important;}