290
edits
MediaWiki:Common.css: Difference between revisions
no edit summary
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
| Line 24: | Line 24: | ||
} | } | ||
.mode- | |||
.mode-selector-container { | |||
margin: 1em; | |||
text-align: center; | |||
} | } | ||
.mode- | .mode-toggle-button { | ||
background-color: #2ecc71; | |||
color: white; | |||
border: none; | |||
border-radius: 4px; | |||
padding: 0.75em 1.5em; | |||
font-size: 1em; | |||
cursor: pointer; | cursor: pointer; | ||
color: | transition: background-color 0.2s; | ||
box-shadow: 0 2px 4px rgba(0,0,0,0.1); | |||
width: auto; | |||
display: inline-flex; | |||
align-items: center; | |||
gap: 0.5em; | |||
} | } | ||
.mode- | .mode-toggle-button:hover { | ||
color: # | background-color: #27ae60; | ||
} | |||
.mode-toggle-button.active { | |||
background-color: #27ae60; | |||
box-shadow: inset 0 2px 4px rgba(0,0,0,0.1); | |||
} | |||
.toggle-arrow { | |||
font-size: 0.8em; | |||
margin-left: 0.5em; | |||
} | } | ||
| Line 42: | Line 67: | ||
display: none; | display: none; | ||
position: absolute; | position: absolute; | ||
left: | left: 50%; | ||
transform: translateX(-50%); | |||
background: white; | background: white; | ||
border: 1px solid # | border: 1px solid #ddd; | ||
border-radius: | border-radius: 4px; | ||
box-shadow: 0 | box-shadow: 0 4px 8px rgba(0,0,0,0.1); | ||
z-index: 1000; | z-index: 1000; | ||
min-width: | min-width: 250px; | ||
margin-top: 0.5em; | |||
} | } | ||
.mode-menu.visible { | .mode-menu.visible { | ||
display: block; | display: block; | ||
} | |||
.mode-menu-header { | |||
padding: 0.75em 1em; | |||
background: #f8f9fa; | |||
border-bottom: 1px solid #ddd; | |||
font-weight: bold; | |||
color: #202122; | |||
} | } | ||
.mode-option { | .mode-option { | ||
display: block; | display: block; | ||
padding: | padding: 1em; | ||
color: #202122; | color: #202122; | ||
text-decoration: none; | text-decoration: none; | ||
border-bottom: 1px solid #eee; | |||
} | |||
.mode-option:last-child { | |||
border-bottom: none; | |||
} | } | ||
.mode-option:hover { | .mode-option:hover { | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
} | } | ||
.mode-option.active { | .mode-option.active { | ||
background-color: # | background-color: #e8f5e9; | ||
} | |||
.mode-title { | |||
display: block; | |||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 0.25em; | |||
} | |||
.mode-description { | |||
display: block; | |||
font-size: 0.9em; | |||
color: #666; | |||
} | } | ||
/* Content marking styles */ | /* Content marking styles */ | ||
.manga-content { | .manga-content { | ||
border-left: | border-left: 3px solid #2ecc71; | ||
padding | padding: 0.5em 1em; | ||
margin: 0 | margin: 1em 0; | ||
background: #f8fff9; | |||
} | } | ||
.anime-content { | .anime-content { | ||
padding | padding: 0.5em 1em; | ||
margin: | margin: 1em 0; | ||
} | } | ||