MediaWiki:Fandommobile.css

/* Mechanical Stats */ .stat-container { margin-top: 20px; padding: 16px 16px 0; border: 1px solid var(--theme-border-color); }

.divider{ height: 1px; margin: 10px 0; background-color: var(--theme-border-color); }

.divider-vertical { width: 1px; margin-right: 30px; background-color: var(--theme-border-color); }

.top-stats { display: flex; justify-content: space-between; } .top-stats__group { display: flex; } .top-stats__item { display: flex; flex-direction: column; align-items: center; } .top-stats__item--padded { padding: 0 3px; } .top-stats__label{ font-size: 20px; line-height: 20px; } .top-stats__value { margin-top: -4px; font-size: 24px; }

.top-stats__ac { display: flex; justify-content: center; align-items: center; height: 52px; width: 52px; background-image: url(https://static.wikia.nocookie.net/the-campaigns-of-kaptajn-bimse/images/8/80/Shield.svg/revision/latest?cb=20201110101124); } .top-stats__hp { display: flex; justify-content: center; align-items: center; height: 52px; width: 52px; background-image: url(https://static.wikia.nocookie.net/the-campaigns-of-kaptajn-bimse/images/a/a7/Heart.svg/revision/latest?cb=20201110142101); } .top-stats__eye { display: flex; justify-content: center; align-items: center; margin-top: -6px; height: 66px; width: 62px; background-image: url(https://static.wikia.nocookie.net/the-campaigns-of-kaptajn-bimse/images/0/01/Eye.svg/revision/latest?cb=20201111204612); } .top-stats__box{ display: flex; justify-content: center; align-items: center; height: 48px; width: 42px; margin: 0 4px; border: 2px solid; border-radius: 4px; }

.stats { display: flex; justify-content: space-between; margin-top: 20px; }

.stats-header { margin-bottom: 10px; font-size: 24px; }

.attributes { margin-right: 20px; } .attribute { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; font-size: 20px; } .attribute__label { margin-right: 6px; } .attribute__stat { position: relative; } .attribute__value { display: flex; justify-content: center; align-items: center; height: 52px; width: 46px; border: 2px solid var(--theme-border-color); border-radius: 4px; } .attribute__modifier { display: flex; justify-content: center; align-items: center; position: absolute; bottom: -8px; right: -12px; height: 28px; width: 28px; background: var(--theme-page-background-color); border: 2px solid var(--theme-border-color); border-radius: 100%; }

.skills { display: flex; justify-content: center; flex: 1 1 40%; } .skill { margin-bottom: 3px; } .skill::before { content: ""; display: inline-block; position: relative; width: 7px; height: 7px; top: -1px; margin-right: 4px; border: 1px solid var(--theme-page-text-color); border-radius: 50%; } .skill--saving-throw::before { margin-right: 6px; border-radius: 0; transform: rotateZ(45deg); } .skill--proficient::before { background-color: var(--theme-page-text-color); } .skill--expertise::before { background-color: var(--theme-link-color);; }

.proficiencies { display: flex; justify-content: space-between; margin-bottom: 20px; } .proficiencies__weapons { display: flex; flex: 1 1 40%; flex-direction: column; flex-wrap: wrap; max-height: 120px; } .proficiencies__armor { flex: 1 1 20%; } .proficiencies__tools { display: flex; flex-direction: column; flex: 1 1 40%; flex-wrap: wrap; max-height: 120px; }

.proficiency { margin-right: 10px; } .proficiency--faded { opacity: .3; } .proficiency--single { font-style: italic; }

.trait { margin-bottom: 10px; } .trait__header { font-weight:700; }

.abilities__label { font-weight:700; } .abilities__text { font-weight: normal; } .abilities__line { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 18px; }

.ability { margin-bottom: 10px; } .ability__header { margin-top: 14px; margin-bottom: -6px; font-size: 16px; font-weight:700; } .ability__header--collapse { cursor: pointer; } .ability__text { transition: ease .5s; max-height: 320px; overflow: hidden; } .ability__text--long { max-height: 600px; } .ability__text--massive { max-height: 940px; } .ability__text--collapsed { position : relative; max-height: 80px; } .ability__text--collapsed:after { content: ""; position: absolute; z-index: 1; bottom: 0; left: 0; pointer-events: none; background-image: linear-gradient(to bottom,	   	rgba(var(--theme-page-background-color--rgb),0),	    	rgba(var(--theme-page-background-color--rgb),1) 90%	    ); width: 100%; height: 60px; } .ability__header--archtype { font-size: 20px; } .ability__lvl { font-size: 12px; opacity: .5; } .ability__faded { opacity: .5; }

.collapse-arrow { display: inline-block; line-height: 13px; transition: .3s; } .collapse-arrow--collapsed { transform: rotate(180deg); } /* Mechanical Stats End*/

/* Navbox */ .navbox { display: grid; grid-template-areas: "header header"; grid-template-columns: 120px 1fr; gap: 2px 1px; padding: 2px; width: 100%; border: 1px solid #bfbfbf; } .navbox__header { grid-area: header; padding: 10px; text-align: center; background-color: var(--theme-sticky-nav-background-color); } .navbox__header a, .navbox__group a { color: var(--theme-page-dynamic-color-1); } .navbox__group { display: flex; align-items: center; padding: 16px 10px; background-color: var(--theme-page-background-color--secondary); } .navbox__links { display: flex; align-items: center; align-content: center; column-gap: 6px; flex-wrap: wrap; padding: 4px 10px; } /* Navbox End */