Your IP : 216.73.217.13
// ------------------------------------
// Joomla! specific styles
// ------------------------------------
//
// Generic Styles
// -------------------------
// Article Titles
// -------------------------
h2.item-title,
.item-title h2 {
clear: both;
display: block;
margin: 0;
a {
&:hover,
&:active,
&:focus {
text-decoration: none;
}
}
}
// Page Header
.page-header,
.categories-list {
h1 {
margin-bottom: $spacer;
text-transform: uppercase;
}
h2 {
margin: 0 0 1rem;
a {
&:hover,
&:focus,
&:active {
}
}
}
}
// Article Aside
// -------------------------
.article-aside {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.article-info {
display: flex;
flex-wrap: wrap;
align-items: center;
font-size: $font-size-sm;
margin-bottom: 0;
a {
// Link states
&:hover,
&:focus,
&:active {
}
}
.article-info-term {
display: none;
}
dd {
display: flex;
align-items: center;
margin: 0;
white-space: nowrap;
> div {
display: inline-block;
}
// Separator
&:after {
@include separator();
color: $gray-500;
font-size: $font-size-base;
margin: 0 6px;
}
&:last-child:after {
display: none;
}
// Hide the icons
.fa,
[class^='icon-'],
[class*=' icon-'] {
//display: none;
}
.fa {
margin-right: 6px;
}
}
}
.edit-link a {
color: $gray-600;
font-size: $font-size-sm;
position: relative;
div[role='tooltip'] {
background: rgba(0, 0, 0, 0.8);
border-radius: 3px;
color: $white;
font-size: $font-size-sm;
padding: 4px 6px;
position: absolute;
opacity: 0;
right: 0;
top: 24px;
transition: all 0.25s ease-in-out;
white-space: nowrap;
}
&:hover {
div[role='tooltip'] {
opacity: 1;
}
}
}
// Author
.createdby {
display: flex;
flex-wrap: wrap;
align-items: center;
[itemprop='name'] {
font-weight: $font-weight-bold;
color: $body-color;
}
.author-img {
display: inline-block;
border-radius: 50%;
height: 24px;
overflow: hidden;
margin-right: 8px;
width: 24px;
img {
max-width: 100%;
}
}
span {
margin-left: 4px;
}
}
// Category Name
.category-name {
[itemprop='genre'] {
font-weight: $font-weight-bold;
}
a {
margin-left: 4px;
}
}
// URL
.article-url {
}
// Publish Date
.published {
time {
}
}
// Modified Date
.modifydate {
}
// Hits
.hits {
}
// Article Desciption
.contentdescription {
}
.contentdescription p {
}
// Content rating
.content_rating {
color: $gray-600;
display: inline-block;
font-size: $font-size-xs;
height: 24px;
margin: 0 0.5rem 0 0;
text-transform: uppercase;
vertical-align: middle;
& > p {
display: inline-block;
}
& + .form-inline {
display: inline-block;
}
}
.content_vote {
select {
}
.btn {
}
.w-auto {
display: inline-block;
}
}
// Article Tools
// -------------------------
.icons {
.btn {
@extend .btn-sm;
.caret {
display: none;
}
}
.icon-cog {
margin: 0;
}
.dropdown-menu {
border-radius: 0;
padding-top: 0;
padding-bottom: 0;
a {
display: block;
padding: calc($spacer / 2);
&:last-child {
border: 0;
}
&:hover,
&:focus,
&:active {
text-decoration: none;
}
}
}
}
// Tags
// -------------------------
.tags {
display: block;
@include clearfix();
> li {
float: left;
margin-right: calc($spacer / 4);
line-height: 1;
> a {
display: block;
padding: calc($spacer / 3) calc($spacer / 2);
}
}
}
.com-tags-tag.tag-category {
h2 {
border-bottom: 1px solid $border-color;
font-size: $h3-font-size;
font-weight: $font-weight-bold;
margin-bottom: $spacer;
padding-bottom: calc($spacer / 2);
}
.filters {
margin-bottom: $spacer;
width: 100%;
}
.category {
display: block;
width: 100%;
}
.list-group {
.list-group-item {
border-radius: 0;
border: 0;
border-bottom: 1px solid $border-color;
margin: 0;
padding: $spacer 0 0;
@extend .clearfix;
a {
color: $body-color;
&:hover,
&:focus,
&:active {
color: $link-hover-color;
}
}
&:hover {
background-color: transparent;
}
}
}
.item-tag-title {
font-size: $h4-font-size;
font-weight: $font-weight-semibold;
margin: 0 0 $spacer;
}
.item-tag-image {
display: block;
float: left;
margin-right: $spacer;
max-width: 33.33%;
margin-bottom: $spacer;
img {
max-width: 100%;
}
}
}
// Article Images
// -------------------------
.item-image {
@include clearfix();
margin-bottom: $spacer;
img {
max-width: 100%;
}
}
// Float Left Image
.pull-left.item-image,
.item-image.pull-left {
margin-right: $spacer;
}
// Float right Image
.pull-right.item-image,
.item-image.pull-right {
margin-left: $spacer;
}
// Image caption
.img_caption img {
}
div.img_caption {
position: relative;
p.img_caption {
background: $gray-lighter;
bottom: 0;
clear: both;
left: 0;
margin: 0;
padding: 5px;
position: absolute;
text-align: center;
width: 100%;
}
}
figure {
&.pull-left {
margin-left: 0;
margin-right: $spacer * 2;
}
&.pull-right {
margin: calc($spacer / 2) 0 0 $spacer * 2;
}
figcaption {
background-color: $gray-800;
color: $gray-500;
font-size: $font-size-xs;
letter-spacing: 0.5px;
padding: calc($spacer / 4) ($spacer-sm);
text-transform: uppercase;
text-align: center;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}
&.pull-none.item-image {
img {
width: 100%;
}
}
}
// Item intro text
.item-intro {
margin-bottom: 1.5rem;
}
// Article Index
// -----------
.article-index {
background-color: $gray-100;
padding: $spacer;
margin-bottom: $spacer;
width: 50%;
&.pull-right {
margin-left: $spacer;
}
&.pull-left {
margin-right: $spacer;
}
h3 {
font-size: $font-size-lg;
}
ul {
border: 0;
display: block;
li {
border-bottom: 1px dotted $border-color;
display: block;
padding: calc($spacer / 2) 0;
a {
color: $body-color;
&:hover,
&:focus,
&:active {
color: $link-hover-color;
}
}
}
}
}
.com-content-article__body {
.pagenavcounter {
margin-bottom: $spacer;
}
.pager {
ul {
list-style: none;
margin: 0;
padding: 0;
li {
border: 1px solid $border-color;
border-radius: 3px;
display: inline-block;
padding: calc($spacer / 2) $spacer;
}
}
}
// Slider style
.pane-sliders {
.panel {
margin-bottom: $spacer;
h3.title {
margin: 0;
padding: calc($spacer / 2) $spacer;
&.pane-toggler-down {
margin-bottom: $spacer;
}
a {
color: $body-color;
&:hover,
&:focus,
&:active {
color: $link-hover-color;
text-decoration: none;
}
}
}
.content {
padding: $spacer;
}
}
}
// Accordion
.accordion {
padding: 0;
.card {
border: 1px solid $border-color;
margin-bottom: 0.5rem;
.card-header {
background: transparent;
border-bottom: 0;
}
.card-body {
border-top: 1px solid $border-color;
}
.btn-link {
color: var(--body-text-color);
}
}
}
// Tabs style
dl.tabs {
display: block;
width: 100%;
@include clearfix();
dt {
float: left;
margin-right: $spacer;
margin-bottom: -1px;
padding: calc($spacer / 2) $spacer;
&.open {
}
h3 {
font-size: $font-size-base;
margin: 0;
a {
&:hover,
&:focus,
&:active {
text-decoration: none;
}
}
}
}
}
}
// Read more
// -----------
.readmore {
margin-top: $spacer;
margin-bottom: 0;
.btn {
padding: 0;
white-space: normal;
// Link States
&:hover,
&:active,
&:focus {
}
// The Arrow
.icon-chevron-right {
}
}
}
// Items More
// -----------
.items-more {
padding-top: $spacer;
margin-top: $spacer;
.nav-tabs {
display: block;
> li {
margin: 0;
padding: 2px 0;
}
> li > a {
border: 0;
display: inline-block;
padding: $spacer-sm;
position: relative;
left: 0;
transition: left 0.2s ease;
&:before {
@include icon('\f0f6');
margin-right: 5px;
}
// Link States
&:hover,
&:active,
&:focus {
left: 3px;
}
}
}
}
//
// List Layouts
// -------------------------
// Leading Items
// -------------
.items-leading {
// Single Item
.col {
padding-top: $spacer-sm;
padding-bottom: $spacer-sm;
&:first-child {
padding-top: 0;
}
.item-image {
max-height: $line-height-base * 8;
overflow: hidden;
}
p {
margin-top: $spacer-sm;
margin-bottom: 0;
}
}
}
// Intro Items
// -------------
.items-row {
// Single Item
.item {
padding-top: $spacer;
padding-bottom: $spacer;
// Styles on Desktop
@include media-breakpoint-up(md) {
padding-top: $spacer;
padding-bottom: $spacer * 2;
}
.item-title {
font-size: $h3-font-size;
}
.item-image {
overflow: hidden;
}
.item-content {
.page-header {
margin-bottom: 0.5rem;
}
}
p {
margin-top: $spacer-sm;
margin-bottom: 0;
}
}
// defloat the intro image in multi comlumns
&.cols-2 .item,
&.cols-3 .item,
&.cols-4 .item,
&.cols-5 .item,
&.cols-6 .item {
.item-image {
float: none;
width: 100%;
margin-left: 0;
margin-right: 0;
overflow: hidden;
}
}
}
// Blog Layout
// -----------
.blog,
.blog-featured {
.items-leading {
.blog-item {
margin-bottom: $spacer-lg;
}
}
.blog-items {
.blog-item {
margin-bottom: $spacer-lg;
}
}
// The Article
.blog-item {
}
.blog-item-content {
}
}
// Reset the duplicate container inside t4-body-main
.blog-featured {
padding-left: 0;
padding-right: 0;
}
//
// Article Page
// -------------------------
.item-page {
[itemprop='articleBody'] {
margin-top: $spacer;
margin-bottom: $spacer;
}
.pull-left,
.pull-right {
@include media-breakpoint-down(sm) {
float: none;
margin: 0 0 $spacer;
img {
max-width: 100%;
}
}
}
.article-info {
.createdby {
display: none;
}
}
}
//
// Generic Category
// -------------------------
.category-desc {
padding: $spacer;
margin-top: $spacer-xl;
margin-bottom: $spacer-xl;
@include border-radius($border-radius);
> img {
float: left;
max-width: 200px;
margin-right: $spacer;
}
}
.category {
margin: 0;
padding: 0;
li {
padding-top: $spacer-sm;
padding-bottom: $spacer-sm;
list-style: none;
}
.list {
}
.list-title {
a {
&:hover,
&:focus,
&:active {
}
}
}
// Striped Style
&.row-striped,
&.list-striped {
li:nth-child(odd) {
background: $table-accent-bg;
}
}
}
// Filters
// T4: Joomla! use <fieldset> that break "display: flex".
// So we need to re-style the layout without using BS "btn-toolbar" styles
// More info here: https://bugs.chromium.org/p/chromium/issues/detail?id=262679
.filters {
// @extend .d-flex;
// @extend .flex-row;
// @extend .align-items-baseline;
margin-bottom: $spacer-lg;
legend {
display: block;
font-size: $font-size-base;
font-weight: $font-weight-bold;
width: 100%;
}
legend,
.btn-group,
.input-group {
}
.input-group + .btn-group {
}
}
//
// Categories List
// -------------------------
.categories-list {
.page-header {
border-top: 1px dotted $border-color;
padding: $spacer 0;
margin: 0;
font-size: $font-size-lg;
@include clearfix;
// Badges
.badge {
font-size: $font-size-sm;
position: relative;
top: -2px;
margin-left: $spacer;
width: auto;
height: auto;
}
// Collapse Toggle
.btn {
background: none;
border: 0;
line-height: 1;
span {
font-size: $font-size-base;
}
}
}
// Indent Sub Categories
.page-header + .fade,
.fade > div {
padding-left: $spacer;
}
// Category Desc
.category-desc {
margin-top: $spacer-sm;
padding-bottom: $spacer-sm;
padding: 0;
border: 0;
}
.com-content-categories__items {
// @extend .d-flex;
// @extend .flex-row;
// @extend .align-items-stretch;
flex-wrap: wrap;
margin-left: $grid-gutter-width * -0.5;
margin-right: $grid-gutter-width * -0.5;
.com-content-categories__item {
flex-basis: 100%;
margin-bottom: $spacer * 2;
padding-left: $grid-gutter-width * 0.5;
padding-right: $grid-gutter-width * 0.5;
@include media-breakpoint-up(md) {
flex-basis: 50%;
}
@include media-breakpoint-up(lg) {
flex-basis: 33.33%;
margin: 0;
}
.item-inner {
border-radius: $border-radius;
border: 1px solid $border-color;
height: 100%;
padding: $spacer * 2;
}
}
}
}
//
// Category List
// -------------------------
.category-list {
#adminForm {
padding-bottom: $spacer;
p {
display: block;
width: 100%;
}
p.counter {
width: auto;
}
}
table.category {
margin-bottom: $spacer;
}
}
.content-category {
.category-desc {
@extend .clearfix;
}
.control-group {
margin-left: $spacer-sm;
margin-top: $spacer-sm;
}
.filters {
width: 100%;
}
// Sub Cat
.cat-children {
padding-top: $spacer;
padding-bottom: $spacer;
> h3 {
font-size: $font-size-base;
font-weight: $font-weight-bold;
margin-bottom: 0;
}
.category-desc {
border: 0;
padding: 0;
margin: 0;
}
> div {
padding-top: $spacer;
padding-bottom: $spacer;
h3 {
font-size: $font-size-lg;
font-weight: $font-weight-semibold;
}
}
}
}
//
// Feature Contact
// -------------------------
.com_contact {
table.category {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
tr:nth-child(2n) {
background-color: $gray-100;
}
th,
td {
padding: calc($spacer/1.5) $spacer;
}
th {
background-color: $gray-100;
border-bottom: 1px solid $border-color;
}
}
}
//
// Contact Category
// -------------------------
.contact-category {
h2 {
}
.category-desc {
}
// T4: Joomla! add ".row" to the <li>. So we need to make <ul> ".container"
.category {
@include make-container();
}
}
//
// Contacts
// -------------------------
.contact {
.page-header {
margin-bottom: $spacer;
}
// Contact list
#selectForm {
border-bottom: 1px solid $border-color;
margin-bottom: $spacer;
padding-bottom: $spacer;
}
dt {
float: left;
margin-right: $spacer-xs;
}
dd {
}
[itemprop='jobTitle'] {
margin-left: auto;
}
#slide-contact {
padding: 0;
.card {
border: 0;
border-radius: $border-radius;
margin-bottom: $spacer;
}
.card-header {
background-color: $gray-300;
border: 0;
font-weight: $font-weight-bold;
margin: 0;
text-transform: uppercase;
&:first-child {
border-radius: 0;
}
}
.card-body {
background-color: $gray-100;
}
}
// Contact Form
#contact-form {
.control-label {
float: none;
}
input.form-control,
textarea.form-control {
max-width: 100%;
}
.controls {
margin-left: 0;
@include media-breakpoint-up(md) {
margin-left: 220px;
}
}
input.form-check-input {
min-width: 16px;
width: auto;
}
fieldset:first-child {
.control-group:last-child {
.control-label {
display: inline-block;
@include media-breakpoint-up(sm) {
display: block;
}
}
.controls {
display: inline-block;
@include media-breakpoint-up(sm) {
display: block;
}
input[type='checkbox'] {
width: auto;
min-width: 16px;
}
}
}
}
fieldset.default {
.control-label {
float: none;
margin-top: 0;
}
.controls {
margin-left: 0;
}
}
}
.contact-links {
ul.nav {
border: 0;
li {
padding-right: $spacer;
a {
background-color: $gray-100;
color: $gray-600;
line-height: 1;
padding: calc($spacer / 2) $spacer;
&:hover,
&:focus,
&:active {
color: $link-hover-color;
}
}
}
}
}
.email-copy {
display: flex;
align-items: center;
> div {
margin-right: calc($spacer / 2);
padding-left: 0;
input[type='checkbox'] {
margin-left: 0;
}
}
> input[type='checkbox'] {
@extend .form-check-input;
margin: 0 calc($spacer / 2) 0 0;
}
}
.contact-miscinfo {
@extend .alert;
@extend .alert-info;
}
// Plain style
.plain-style {
#contact-form {
input,
textarea {
max-width: 100%;
}
}
}
#contact-form fieldset.captcha {
.controls {
margin-left: 0;
}
}
}
.grecaptcha-badge {
z-index: 100;
}
//
// Newsfeed
// -------------------------
.newsfeed {
.feed-description {
color: $text-muted;
}
> ol {
margin: 0;
margin-top: $spacer;
padding: 0;
}
> ol > li {
list-style: none;
padding: $spacer 0;
}
.feed-link {
font-size: $font-size-lg;
}
.feed-item-description {
margin-top: $spacer;
figure {
margin-bottom: $spacer-lg;
}
.lead {
font-size: $font-size-base;
}
.feedflare {
}
}
}
//
// Newsfeed
// -------------------------
.newsfeed-category {
#filter-search {
min-width: 200px;
}
.category {
li {
padding: $spacer;
}
}
}
//
// Pagination
// -------------------------
.pagination-wrap {
padding-top: 2rem;
margin-bottom: 2rem;
.counter {
float: right;
margin: 0;
}
ul {
padding: 0;
list-style: none;
li {
display: inline-block;
}
}
}
//
// Search
// -------------------------
.search {
hr {
border-top: 1px solid $border-color;
opacity: 1;
}
.btn-toolbar {
margin-bottom: $spacer;
.btn {
@extend .btn-primary;
margin-left: $spacer-sm;
}
}
.searchintro {
}
fieldset {
#searchphraseall-lbl,
#searchphraseany-lbl {
margin-right: $spacer;
}
legend {
font-size: $font-size-base;
text-transform: uppercase;
font-weight: $font-weight-bold;
}
}
.ordering-box {
// @extend .d-flex;
// @extend .flex-row;
// @extend .align-items-baseline;
label {
}
select {
width: auto;
max-width: 200px;
margin-left: $spacer-sm;
}
}
.form-limit {
}
//
// The Results
.search-results,
#search-results {
margin-top: $spacer;
.highlight {
border-radius: 2px;
padding: 1px 4px;
}
.result-title {
margin-top: $spacer * 2;
font-size: $font-size-base;
}
.result-category {
}
.result-text {
}
.result-created {
border-bottom: 1px solid $border-color;
padding-bottom: $spacer * 2;
font-size: $font-size-sm;
}
}
}
//
// The Empty Result
#search-result-empty {
margin-top: $spacer-lg;
}
// Smart Search
// -------------------------
div#finder-filter-window .filter-branch {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
.finder-selects {
float: none;
flex-basis: 100%;
margin: 0 0 $spacer 0;
@include media-breakpoint-up(sm) {
flex-basis: auto;
margin: 0 $spacer 0r 0;
}
@include media-breakpoint-up(md) {
margin: 0 $spacer * 1.5 $spacer 0;
}
@include media-breakpoint-up(lg) {
margin-bottom: 0;
}
label {
clear: right;
display: block;
margin-bottom: calc($spacer / 2);
width: 100%;
}
}
}
div#finder-filter-window #finder-filter-select-dates {
display: flex;
margin-bottom: $spacer;
.filter-date {
display: flex;
align-items: center;
br {
display: none;
}
select.inputbox {
margin-bottom: 0 !important;
margin-left: calc($spacer / 2);
}
}
}
#search-results {
padding-top: calc($spacer / 2);
.result-item {
border-bottom: 1px solid $border-color;
padding: $spacer 0;
}
}
#highlighter-start {
display: none;
}
//
// Tag Category
// -------------------------
.tag-category {
.filters {
position: relative;
.btn-group .btn {
@extend .btn-secondary;
}
.btn-group.pull-right {
margin-top: $spacer;
@include media-breakpoint-up(sm) {
margin: 0;
float: none !important;
position: absolute;
right: 0;
top: 0;
}
}
.input-group-append {
.btn {
border-radius: 0;
+ .btn {
border-radius: 0 5px 5px 0;
}
}
}
}
.category h3 {
font-size: $font-size-lg;
}
}
.input-group-btn {
.btn + .btn {
margin-left: 0;
}
}
// List all tags
.all-tags {
margin: 0;
padding: 0;
list-style: none;
@include clearfix();
li {
float: left;
padding: 0 calc($spacer / 2);
a {
border: 1px solid $border-color;
border-radius: 25px;
color: $gray-600;
padding: calc($spacer / 2) $spacer;
transition: $transition-base;
&:hover,
&:focus,
&:active {
background-color: $gray-600;
color: $white;
text-decoration: none;
i {
opacity: 1;
}
}
i {
opacity: 0.4;
}
}
}
}
//
// Login page
// --------------------------
.login-wrap {
max-width: 400px;
margin: 0 auto;
// From
.frm-login-form {
.control-group {
.control-label {
float: none;
padding-top: 0;
}
.controls {
margin: 0;
}
}
}
label {
margin-bottom: 4px;
}
input {
max-width: 100%;
}
.login-description {
}
.login-input {
}
.login__secretkey {
}
.login-remember {
input.inputbox {
display: inline-block;
margin-top: 0;
margin-right: 4px;
position: relative;
vertical-align: middle;
width: 16px;
}
}
.login-submit {
.btn {
width: 100%;
}
}
.other-links {
ul {
margin: 0;
padding: 0;
list-style: none;
text-align: center;
li {
display: inline-block;
padding: 0 calc($spacer/2);
}
}
}
}
.plg_system_webauthn_login_button {
svg {
fill: var(--t4-btn-color);
width: 2rem;
}
}
// Remind
div.com-users-remind,
div.com-users-reset {
background-color: $gray-100;
border-radius: $border-radius;
max-width: 450px;
margin: 0 auto;
padding: $spacer * 2;
fieldset {
legend {
border: 0;
font-size: 1rem;
margin-bottom: 1rem;
}
}
.control-group {
.control-label {
float: none;
margin-bottom: calc($spacer/2);
width: 100%;
}
.controls {
margin: 0;
.form-control {
max-width: 100%;
width: 100%;
}
}
}
.com-users-remind__submit,
.com-users-reset__submit {
margin-bottom: 0;
}
}
//
// Register
// --------------------------
.registration {
fieldset {
margin-bottom: $spacer * 1.5;
padding-top: $spacer * 2.5;
position: relative;
&::before {
background-color: $gray-200;
content: '';
height: 3px;
position: absolute;
left: 0;
top: 8px;
width: 100%;
}
legend {
background-color: #fff;
display: inline-block;
font-size: 12px;
font-weight: 700;
margin-bottom: 24px;
padding-right: 6px;
position: absolute;
top: 0;
text-transform: uppercase;
letter-spacing: 1px;
width: auto;
z-index: 20;
}
fieldset {
margin-bottom: 0;
padding-top: calc($spacer/2);
&::before {
display: none;
}
}
.control-group {
.control-label {
@include media-breakpoint-down(sm) {
float: none;
}
}
.controls {
@include media-breakpoint-down(sm) {
margin-left: 0;
}
input,
textarea {
@include media-breakpoint-down(sm) {
max-width: 100%;
width: 100%;
}
}
input[type='radio'] {
max-width: auto;
width: auto;
}
.field-calendar {
input {
width: auto;
}
}
}
.controls {
.radio {
display: flex;
align-items: center;
label {
margin-right: $spacer;
&.form-check {
margin-right: 0;
}
}
}
}
// Field media
joomla-field-media {
.field-media-input {
max-width: 237px;
}
.input-group {
.button-select {
border-bottom-right-radius: 5px;
}
}
}
}
}
// Style for J4
meter {
min-width: 288px;
+ div {
font-size: 0.8rem;
text-align: left !important;
}
}
.password-group {
.input-group {
flex-wrap: nowrap;
}
}
form div.com-users-registration__submit {
.controls {
margin-left: 0;
}
}
}
//
// Edit Article
// --------------------------
#jform_title {
max-width: unset;
}
//
// User Profile
// --------------------------
.profile .btn-toolbar {
padding: 0;
}
.profile fieldset {
margin-bottom: $spacer;
legend {
border-bottom: 1px solid $border-color;
font-weight: normal;
font-size: $h4-font-size;
padding-bottom: calc($spacer/4);
}
dt {
@include media-breakpoint-up(md) {
text-align: right;
}
}
dt,
dd {
border-bottom: 1px dashed $border-color;
margin: 0;
padding-top: calc($spacer/2);
padding-bottom: calc($spacer/2);
}
}
// Window popup
// ---------------------------
.contentpane {
padding: $spacer;
#pop-print {
position: absolute;
right: $spacer;
top: $spacer;
a {
background-color: $gray-200;
display: block;
padding: calc($spacer / 2) $spacer;
&:hover,
&:focus,
&:active {
background-color: $link-hover-color;
color: $white;
}
}
}
#mailto-window {
position: relative;
// Window title
h2 {
font-size: $font-size-lg;
font-weight: 600;
margin: 0;
}
input[type='checkbox'] {
display: inline-block;
width: auto;
}
.mailto-close {
position: absolute;
top: $spacer;
right: $spacer;
}
}
// Email form
#mailtoForm,
form.com-mailto__form {
.control-group {
margin-bottom: calc($spacer/2);
}
.control-label {
display: block;
float: none;
}
.controls {
margin-left: 0;
input {
max-width: 100%;
width: 100%;
}
}
.com-mailto__submit {
margin: 0;
padding-top: $spacer;
}
}
}
//
// AUTHOR LISTING PAGE
// -------------------------
.author-list {
padding: $spacer * 3 0;
}
// A author
.author-block {
// Author avatar
.author-avatar {
margin-bottom: $spacer;
a,
span {
border-radius: 50%;
display: block;
margin: 0 auto;
max-width: 120px;
overflow: hidden;
}
}
// Author name
.author-name {
font-weight: 600;
margin-bottom: calc($spacer / 2);
}
// Author job title
.author-title {
font-size: $font-size-sm;
margin-bottom: $spacer;
text-transform: uppercase;
}
// About me
.author-about-me {
margin-bottom: $spacer;
}
.author-socials {
display: flex;
justify-content: center;
a {
color: var(--body-text-color);
margin: 0 4px;
&:hover,
&:focus,
&:active {
color: var(--body-link-hover-color);
}
}
}
&.author-block-list {
margin-top: $spacer * 2;
margin-bottom: $spacer * 2;
text-align: center;
@include media-breakpoint-up(md) {
margin-top: 0;
}
}
&.author-block-posts {
margin-top: $spacer * 2;
margin-bottom: $spacer * 2;
text-align: center;
@include media-breakpoint-up(md) {
max-width: 70%;
margin: 0 auto $spacer * 3;
}
@include media-breakpoint-up(lg) {
max-width: 50%;
}
}
&.author-block-post-detail {
background-color: $gray-100;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: $spacer * 2;
margin-bottom: $spacer * 2;
padding: $spacer * 1.5;
text-align: center;
@include media-breakpoint-up(md) {
margin-bottom: 0;
justify-content: flex-start;
text-align: left;
}
.author-avatar {
margin-bottom: $spacer;
@include media-breakpoint-up(md) {
margin-right: $spacer * 2;
margin-bottom: 0;
}
}
.author-other-info {
@include media-breakpoint-up(sm) {
flex: 1;
text-align: left;
}
}
.author-title {
margin-bottom: calc($spacer/2);
}
.author-socials {
@include media-breakpoint-up(sm) {
justify-content: flex-start;
}
}
}
&.pos-before-content {
margin-bottom: $spacer * 1.5;
}
}
// Author page
.author-posts {
.item {
margin-bottom: $spacer * 2;
.article-info dd.category::after {
display: none;
}
}
.btn-load-more {
&:hover,
&:focus,
&:active {
cursor: pointer;
}
}
}
// Background Alert J4
.alert-wrapper .alert-message {
background: transparent;
color: inherit;
}
//Fix: chosen dropdown
.chzn-container-single {
.chzn-single div b {
background: url('../../../media/jui/css/chosen-sprite.png') no-repeat 0px 2px;
}
}
// Fix: Edit module button
.jmodedit {
position: absolute;
top: 0;
right: 0;
z-index: 300;
}