Plantilla:Premios Allie/styles.css

De Wikimedia Small Projects
Revisión del 01:25 19 oct 2022 de Hasley (discusión | contribs.)
(difs.) ← Revisión anterior | Revisión actual (difs.) | Revisión siguiente → (difs.)
@media only screen and (min-device-width: 600px) {
	.allie-title {
		font-size: 5.4em;
		font-family: 'Segoe UI';
		color: #fff;
		padding: 75px;
		background-image: radial-gradient(circle at 100% 100%, transparent 2px, #AA00FF 2px, #AA00FF 4px, transparent 4px),
			linear-gradient(to right, #AA00FF, #0091EA),
			radial-gradient(circle at 0% 100%, transparent 2px, #0091EA 2px, #0091EA 4px, transparent 4px),
			linear-gradient(to bottom, #0091EA, #64DD17),
			radial-gradient(circle at 0% 0%, transparent 2px, #64DD17 2px, #64DD17 4px, transparent 4px),
			linear-gradient(to left, #64DD17, #FF6D00),
			radial-gradient(circle at 100% 0%, transparent 2px, #FF6D00 2px, #FF6D00 4px, transparent 4px),
			linear-gradient(to top, #FF6D00, #AA00FF);
		border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
	}	
}

@media only screen and (max-device-width: 600px) {
	.allie-title {
		font-size: 2.4em;
		color: white;
		font-family: 'Segoe UI';
		background-color: #d32;
		padding: 45px;
	}	
}

/* from https://stackoverflow.com/a/38352601 */
.allie-aw-title {
	text-align: center;
	font-weight: bold;
    position: relative;
    padding: 8px 8px 32px 8px;
    background-color: #36c;
	color: #fff;
	font-size: 343%;
}

.allie-aw-title:after {
	background: linear-gradient(-45deg, #ffffff 16px, transparent 0), linear-gradient(45deg, #ffffff 16px, transparent 0);
    background-repeat: repeat-x;
    background-size: 32px 32px;
    content: " ";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 32px;
}

/* atr https://dev.to/dcodeyt/creating-beautiful-html-tables-with-css-428l */
* {
 font-family: Ubuntu;
 border-radius: 2px;
}

.mw-editsection {
	display: none;
}

.mw-collapsible-text {
	color: #fff;
}

h2, h3 {
	padding: .6rem;
	color: #fff;
	background:#2a4b8d;
	font-weight: bold;
}

body {
  margin: 0;
  padding: 0;
  background: #ccc;
}
 
.nav {
	padding-top: 1em;
	display: flex;
	justify-content: center;
}

.nav ul {
  list-style: none;
  background-color: #262626;
  text-align: center;
  width: 50%;
}
.nav li {
  font-family: 'Oswald', sans-serif;
  font-size: 1.2em;
  line-height: 40px;
  height: 40px;
}
 
.nav a {
  text-decoration: none;
  color: #fff !important;
  display: block;
}
 
.nav li:hover {
  background-color: #3366CC;
  transition: .3s background-color;
}
/*
.nav a.active {
  background-color: #fff;
  color: #444;
  cursor: default;
}
*/
@media screen and (min-width: 600px) {
  .nav li {
    width: 120px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
  }
  .allie-aw-title {
	background-image: url('https://upload.wikimedia.org/wikipedia/commons/e/e3/Wikisp-logo-icon-white.svg');
	background-position: 1% 10%;
	background-repeat: no-repeat;
  }
  /* Option 1 - Display Inline */
  .nav li {
    display: inline-block;
    margin-right: -4px;
  }
 
  /* Options 2 - Float
  .nav li {
    float: left;
  }
  .nav ul {
    overflow: auto;
    width: 600px;
    margin: 0 auto;
  }
  .nav {
    background-color: #444;
  }
  */
}