Vorlage:Portal Mainpage.css: Unterschied zwischen den Versionen

/* .bs-layout-container { border: 1px solid lightblue; } .bs-layout-cell { border: 1px solid orange; }

  • /

/* Links top */ .bs-layout-container.links-top { margin-bottom: 10px; } .testwiki-icon-admin::before { content: "\e971"; font-family: icomoon; font-style: normal; color: #CCCCCC; margin-left: 2px; } @media all and ( max-width: 500px ) { .bs-layout-container.links-top { justify-content: flex-start; } }

/* Intro */ .bs-layout-container.intro-text{ font-size: 24px; }

.bs-layout-container.intro-text p{ font-size: 14px; }

/* Important information*/

.testwiki-important-information-container {} .testwiki-important-information-container .testwiki-label { font-weight: bold; margin-right: 5px; } .testwiki-important-information-container .testwiki-panel-trigger { margin-left: 5px; margin-right: 5px; color: #0060DF; } .testwiki-important-information-container .testwiki-panel-trigger i::before { font-family: 'fontawesome'; content: "\f0d7"; font-style: normal; margin-right: 5px; } .testwiki-important-information-container .testwiki-panel-trigger[aria-expanded="true"] i::before { content: "\f0d8"; }

.testwiki-important-information-container .testwiki-panel-trigger[aria-expanded="true"] { color: #0060DF; } .testwiki-important-information-container .panel-body { border: 1px solid #CCCCCC; margin-top: 30px; margin-bottom: 30px; }

@media all and ( max-width: 500px ) { .testwiki-important-information-container .testwiki-label { display: block; } }

/* Contact primary */ .bs-layout-container.contact-primary { border-top: 3px solid #F0F0F0; border-bottom: 3px solid #F0F0F0; margin-top: 30px; margin-bottom: 30px; } .bs-layout-container.contact-primary .bs-layout-cell { margin-top: 0; margin-bottom: 0; padding-bottom: 0; min-height: 170px !important; } .bs-layout-container.contact-primary .bs-layout-cell p { margin-top: 0 !important; margin-bottom: 0 !important; } .bs-layout-cell.personal-contact { min-width: 305px !important; } .bs-layout-cell.personal-contact > .floatleft { margin-top: 10px; margin-bottom: 0; margin-right: 5px !important; } .bs-layout-cell.personal-contact > .body { display: block; float: left; } @media all and ( max-width: 320px ) { .bs-layout-cell.personal-contact > .body { clear:both; } } } @media all and ( min-width: 321px ) { .bs-layout-cell.personal-contact > .body { float: left; } }

.bs-layout-cell.webinar, .bs-layout-cell.helpdesk, .bs-layout-cell.tour{ width: 195px !important; position: relative; } .bs-layout-cell.webinar a, .bs-layout-cell.helpdesk a, .bs-layout-cell.tour a { display: block; position: absolute; bottom: 35px; } .bs-layout-cell.webinar a > img, .bs-layout-cell.helpdesk a > img, .bs-layout-cell.tour a > img { max-width: 100%; } .bs-layout-cell.webinar a span, .bs-layout-cell.helpdesk a span, .bs-layout-cell.tour a span { display: inline-block; height: 16px; } @media all and ( min-width: 721px ) and ( max-width: 1080px ) { .bs-layout-container.contact-primary .bs-layout-cell { min-width: 40%; } } @media all and ( max-width: 721px ) { .bs-layout-cell.webinar a, .bs-layout-cell.helpdesk a, .bs-layout-cell.tour a { position: relative; bottom: auto; } }

/* Use cases*/ .bs-layout-container.use-cases { margin-top: 30px; } .bs-layout-container.use-cases .bs-layout-cell { background-color: #F0F0F0; text-align: center; padding: 30px; }

.bs-layout-container.use-cases .use-case-headline { display: block; margin-top: 30px; margin-bottom: 20px; font-size: 1.2em; font-weight: bold; } .bs-layout-container.use-cases .use-case-headline a, .bs-layout-container.use-cases .use-case-headline a.extern, .bs-layout-container.use-cases .use-case-headline a:focus, .bs-layout-container.use-cases .use-case-headline a.extern:focus { color: #0060df !important; }

.bs-layout-container.use-cases .use-case-headline a:hover, .bs-layout-container.use-cases .use-case-headline a.extern:hover { color: #006eff !important; }

.bs-layout-container.use-cases a, .bs-layout-container.use-cases a.extern, .bs-layout-container.use-cases a:hover, .bs-layout-container.use-cases a.extern:hover, .bs-layout-container.use-cases a:focus, .bs-layout-container.use-cases a.extern:focus { font-weight: bold; color: #C6752D !important; }

/* Common */

/* i.arrows-white and i.arrows-blue background-image is set in MediaWiki:Common.css

  • /

.portal-link i.arrows-white, .portal-link i.arrows-blue { display: inline-block; width: 26px; height: 16px; }


.portal-link { width: 100%; padding: 5px; }

.portal-link a.external { background-image: none; }

.portal-link.yellow { background-color: #C6752D; } .portal-link.yellow a, .portal-link.yellow i { color: white !important; } .portal-link.yellow a:hover, .portal-link.yellow a:focus { text-decoration: none; color: white !important; }

.vertical-separator { margin-left: 2px; margin-right: 3px; border-left: 1px solid #CCCCCC; }

/*
        
        .bs-layout-container { border: 1px solid lightblue; }
        
        .bs-layout-cell { border: 1px solid orange; }
        
        */
        
        /* Links top */
        
        .bs-layout-container.links-top {
        
        	margin-bottom: 10px;
        
        }
        
        .testwiki-icon-admin::before {
        
        	content: "\e971";
        
        	font-family: icomoon;
        
        	font-style: normal;
        
        	color: #CCCCCC;
        
        	margin-left: 2px;
        
        }
        
        @media all and ( max-width: 500px ) {
        
        	.bs-layout-container.links-top {
        
        		justify-content: flex-start;
        
        	}
        
        }
        
        
        
        /* Intro */
        
        .bs-layout-container.intro-text{
        
        	font-size: 24px;
        
        }
        
        
        
        .bs-layout-container.intro-text p{
        
        	font-size: 14px;
        
        }
        
        
        
        /* Important information*/
        
        
        
        .testwiki-important-information-container {}
        
        .testwiki-important-information-container .testwiki-label {
        
        	font-weight: bold;
        
        	margin-right: 5px;
        
        }
        
        .testwiki-important-information-container .testwiki-panel-trigger {
        
        	margin-left: 5px;
        
        	margin-right: 5px;
        
        	color: #0060DF;
        
        }
        
        .testwiki-important-information-container .testwiki-panel-trigger i::before {
        
        	font-family: 'fontawesome';
        
        	content: "\f0d7";
        
        	font-style: normal;
        
        	margin-right: 5px;
        
        }
        
        .testwiki-important-information-container .testwiki-panel-trigger[aria-expanded="true"] i::before {
        
        	content: "\f0d8";
        
        }
        
        
        
        .testwiki-important-information-container .testwiki-panel-trigger[aria-expanded="true"] {
        
        	color: #0060DF;
        
        }
        
        .testwiki-important-information-container .panel-body {
        
        	border: 1px solid #CCCCCC;
        
        	margin-top: 30px;
        
        	margin-bottom: 30px;
        
        }
        
        
        
        @media all and ( max-width: 500px ) {
        
        	.testwiki-important-information-container .testwiki-label {
        
        		display: block;
        
        	}
        
        }
        
        
        
        /* Contact primary */
        
        .bs-layout-container.contact-primary {
        
        	border-top: 3px solid #F0F0F0;
        
        	border-bottom: 3px solid #F0F0F0;
        
        	margin-top: 30px;
        
        	margin-bottom: 30px;
        
        }
        
        .bs-layout-container.contact-primary .bs-layout-cell {
        
        	margin-top: 0;
        
        	margin-bottom: 0;
        
        	padding-bottom: 0;
        
        	min-height: 170px !important;
        
        }
        
        .bs-layout-container.contact-primary .bs-layout-cell p {
        
        	margin-top: 0 !important;
        
        	margin-bottom: 0 !important;
        
        }
        
        .bs-layout-cell.personal-contact {
        
        	min-width: 305px !important;
        
        }
        
        .bs-layout-cell.personal-contact > .floatleft {
        
        	margin-top: 10px;
        
        	margin-bottom: 0;
        
        	margin-right: 5px !important;
        
        }
        
        .bs-layout-cell.personal-contact > .body {
        
        	display: block;
        
        
        	float: left;
            
            
        }
        
        @media all and ( max-width: 320px ) {
        
        .bs-layout-cell.personal-contact > .body {
        
        	clear:both;
        
        
        }
            
            	
            
            }
            
            
        	}
            
            }
            
            @media all and ( min-width: 321px ) {
            
            .bs-layout-cell.personal-contact > .body {
            
            	float: left;
            
            	}
            
            }
            
            
            
            
        .bs-layout-cell.webinar,
        
        .bs-layout-cell.helpdesk,
        
        .bs-layout-cell.tour{
        
        	width: 195px !important;
        
        	position: relative;
        
        }
        
        .bs-layout-cell.webinar a,
        
        .bs-layout-cell.helpdesk a,
        
        .bs-layout-cell.tour a {
        
        	display: block;
        
        	position: absolute;
        
        	bottom: 35px;
        
        }
        
        .bs-layout-cell.webinar a > img,
        
        .bs-layout-cell.helpdesk a > img,
        
        .bs-layout-cell.tour a > img {
        
        	max-width: 100%;
        
        }
        
        .bs-layout-cell.webinar a span,
        
        .bs-layout-cell.helpdesk a span,
        
        .bs-layout-cell.tour a span {
        
        	display: inline-block;
        
        	height: 16px;
        
        }
        
        @media all and ( min-width: 721px ) and ( max-width: 1080px ) {
        
        	.bs-layout-container.contact-primary .bs-layout-cell {
        
        		min-width: 40%;
        
        	}
        
        }
        
        @media all and ( max-width: 721px ) {
        
        	.bs-layout-cell.webinar a,
        
        	.bs-layout-cell.helpdesk a,
        
        	.bs-layout-cell.tour a {
        
        		position: relative;
        
        		bottom: auto;
        
        	}
        
        }
        
        
        
        /* Use cases*/
        
        .bs-layout-container.use-cases {
        
        	margin-top: 30px;
        
        }
        
        .bs-layout-container.use-cases .bs-layout-cell {
        
        	background-color: #F0F0F0;
        
        	text-align: center;
        
        	padding: 30px;
        
        }
        
        
        
        .bs-layout-container.use-cases .use-case-headline {
        
        	display: block;
        
        	margin-top: 30px;
        
        	margin-bottom: 20px;
        
        	font-size: 1.2em;
        
        	font-weight: bold;
        
        }
        
        .bs-layout-container.use-cases .use-case-headline a,
        
        .bs-layout-container.use-cases .use-case-headline a.extern,
        
        .bs-layout-container.use-cases .use-case-headline a:focus,
        
        .bs-layout-container.use-cases .use-case-headline a.extern:focus {
        
        	color: #0060df !important;
        
        }
        
        
        
        .bs-layout-container.use-cases .use-case-headline a:hover,
        
        .bs-layout-container.use-cases .use-case-headline a.extern:hover {
        
        	color: #006eff !important;
        
        }
        
        
        
        .bs-layout-container.use-cases a,
        
        .bs-layout-container.use-cases a.extern,
        
        .bs-layout-container.use-cases a:hover,
        
        .bs-layout-container.use-cases a.extern:hover,
        
        .bs-layout-container.use-cases a:focus,
        
        .bs-layout-container.use-cases a.extern:focus {
        
        	font-weight: bold;
        
        	color: #C6752D !important;
        
        }
        
        
        
        /* Common */
        
        
        
        /*
        
        i.arrows-white and i.arrows-blue background-image is set in MediaWiki:Common.css
        
        */
        
        .portal-link i.arrows-white,
        
        .portal-link i.arrows-blue {
        
        	display: inline-block;
        
        	width: 26px;
        
        	height: 16px;
        
        }
        
        
        
        
        
        .portal-link {
        
        	width: 100%;
        
        	padding: 5px;
        
        }
        
        
        
        .portal-link a.external {
        
        	background-image: none;
        
        }
        
        
        
        .portal-link.yellow {
        
        	background-color: #C6752D;
        
        }
        
        .portal-link.yellow a,
        
        .portal-link.yellow i {
        
        	color: white !important;
        
        }
        
        .portal-link.yellow a:hover,
        
        .portal-link.yellow a:focus {
        
        	text-decoration: none;
        
        	color: white !important;
        
        }
        
        
        
        .vertical-separator {
        
        	margin-left: 2px;
        
        	margin-right: 3px;
        
        	border-left: 1px solid #CCCCCC;
        
        }
Zeile 93: Zeile 93:
 
.bs-layout-cell.personal-contact > .body {
 
.bs-layout-cell.personal-contact > .body {
 
display: block;
 
display: block;
float: left;
 
 
}
 
}
 
@media all and ( max-width: 320px ) {
 
@media all and ( max-width: 320px ) {
 
.bs-layout-cell.personal-contact > .body {
 
.bs-layout-cell.personal-contact > .body {
 
clear:both;
 
clear:both;
 +
}
 
}
 
}
+
@media all and ( min-width: 321px ) {
 +
.bs-layout-cell.personal-contact > .body {
 +
float: left;
 +
}
 
}
 
}
 +
 
.bs-layout-cell.webinar,
 
.bs-layout-cell.webinar,
 
.bs-layout-cell.helpdesk,
 
.bs-layout-cell.helpdesk,

Anhänge

Diskussionen