Template:Dev/hierarchy.css: Difference between revisions

Template page
No edit summary
No edit summary
 
(67 intermediate revisions by the same user not shown)
Line 1: Line 1:
.standard-title {
/* titles for pages */
.experimental-title {
   display: inline-block;
   display: inline-block;
   width: 100%;
   width: 100%;
Line 13: Line 14:
}
}


.header-container-hierarchy {
.standard-title {
   position: sticky;
   display: inline-block;
   width: 100%;
   width: 100%;
  font-weight: bold;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
}
/* hierarchy - generic */
.hierarchy-generic-holder {
  display: grid;
  grid-auto-flow: column;
  gap: 0;
  width: 100%;
  grid-auto-columns: 1fr;
}
.hierarchy-generic-container {
  align-self: center;
  justify-self: center;
  display: grid;
  align-items: center;
  justify-items: center;
  height: 100%;
  width: 75%;
}
.hierarchy-generic-button {
  flex: 1;
}
.hierarchy-generic-button a {
  text-decoration: none;
  font-family: Impact, Courier New, monospace;
  font-weight: normal;
  font-variant: small-caps;
  font-size: 4em;
  color: rgba(0,0,0,255);
  text-shadow:
    -1px 1px 0px yellow,
    -1px -1px 0px yellow,
    1px -1px 0px yellow,
    1px 1px 0px yellow;
}
.hierarchy-generic-button a:hover {
  filter: drop-shadow(2px 2px 3px yellow);
}
/* hierarchy - policy */
.hierarchy-policy-container {
  align-self: center;
  justify-self: center;
  display: grid;
  align-items: center;
  justify-items: center;
  height: 100%;
  width: 75%;
  margin-top: 10px;
  margin-bottom: 10px;
}
.hierarchy-policy-button a {
  text-decoration: none;
  font-family: Impact, Courier New, monospace;
  font-weight: normal;
  font-variant: small-caps;
  font-size: 2em;
  line-height: 75%;
  color: rgba(0,0,0,255);
  text-shadow:
    -1px 1px 0px yellow,
    -1px -1px 0px yellow,
    1px -1px 0px yellow,
    1px 1px 0px yellow;
}
.hierarchy-policy-button a:hover {
  filter: drop-shadow(2px 2px 3px yellow);
}
/* backgrounds - generated */
.cssgen-carbon {
background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;
}
.cssgen-carbon-fiber {
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
}
.cssgen-starry-sky {
background-color:black;
background-image:
radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px),
radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 30px),
radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px),
radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 30px);
background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
}
}

Latest revision as of 13:49, 26 October 2022

/* titles for pages */
.experimental-title {
  display: inline-block;
  width: 100%;
  font-weight: bold;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  box-shadow: 3px 3px 2px 0px #888888;
  background-color: #000000;
  color: #ffaa00;
}

.standard-title {
  display: inline-block;
  width: 100%;
  font-weight: bold;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
}

/* hierarchy - generic */
.hierarchy-generic-holder {
  display: grid;
  grid-auto-flow: column;
  gap: 0;
  width: 100%;
  grid-auto-columns: 1fr;
}

.hierarchy-generic-container {
  align-self: center;
  justify-self: center;
  display: grid;
  align-items: center;
  justify-items: center;
  height: 100%;
  width: 75%;
}

.hierarchy-generic-button {
  flex: 1;
}

.hierarchy-generic-button a {
  text-decoration: none;
  font-family: Impact, Courier New, monospace;
  font-weight: normal;
  font-variant: small-caps;
  font-size: 4em;
  color: rgba(0,0,0,255);
  text-shadow:
    -1px 1px 0px yellow,
    -1px -1px 0px yellow,
    1px -1px 0px yellow,
    1px 1px 0px yellow;
}

.hierarchy-generic-button a:hover {
  filter: drop-shadow(2px 2px 3px yellow);
}

/* hierarchy - policy */
.hierarchy-policy-container {
  align-self: center;
  justify-self: center;
  display: grid;
  align-items: center;
  justify-items: center;
  height: 100%;
  width: 75%;
  margin-top: 10px;
  margin-bottom: 10px;
}

.hierarchy-policy-button a {
  text-decoration: none;
  font-family: Impact, Courier New, monospace;
  font-weight: normal;
  font-variant: small-caps;
  font-size: 2em;
  line-height: 75%;
  color: rgba(0,0,0,255);
  text-shadow:
    -1px 1px 0px yellow,
    -1px -1px 0px yellow,
    1px -1px 0px yellow,
    1px 1px 0px yellow;
}

.hierarchy-policy-button a:hover {
  filter: drop-shadow(2px 2px 3px yellow);
}

/* backgrounds - generated */
.cssgen-carbon {
background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;
}

.cssgen-carbon-fiber {
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
}

.cssgen-starry-sky {
background-color:black;
background-image:
radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px),
radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 30px),
radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px),
radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 30px);
background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
}