jules
/
PushingScores
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

and css

master
zeroth 4 years ago
parent
df441d67c2
commit
c7e16c6ace
1 changed files with 115 additions and 83 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 198
      static/css/style.css

198
static/css/style.css
View File

@ -1,7 +1,6 @@
*, *:after, *:before {
box-sizing: border-box;
-moz-box-sizing: border-box;
}
/********************************************************/
/* FONTS */
/********************************************************/
@font-face {
font-family: 'Compagnon Bold';
@ -49,14 +48,18 @@ font-weight: normal;
font-style: roman;
}
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
/********************************************************/
/* ALL PAGES - LAYOUT */
/********************************************************/
*, *:after, *:before {
box-sizing: border-box;
-moz-box-sizing: border-box;
}
body{
/* background: #ffffff; */
color:black;
font-family: 'Montserrat', sans-serif;
top:0;
@ -64,34 +67,20 @@ body{
margin: 0;
width: 100%;
height: 100%;
}
h2,h3{
font-family: 'Steps Thin Mono';
}
a{
color: black;
}
div.home > a{
border-bottom: 1px dashed black;
padding: 0.1em;
margin: 0.5em;
line-height: 1.5em;
}
.text a:visited{
color: red;
}
.text a:hover{
background: : red;
color: white;
}
div#wrapper{
width: 100%;
}
div#top{
position: relative;
background: white;
@ -103,6 +92,9 @@ div#bottom{
width: 100%;
}
div.content-block{
padding: 0 5em 0 10em;
}
/********************************************************/
/* SELECTION */
@ -115,21 +107,45 @@ div#bottom{
background: magenta; /* Gecko Browsers */
}
/********************************************************/
/* WORDPATH */
/********************************************************/
#thewordpath{
font-family: 'Compagnon Light';
/* font-style: roman; */
display: block;
width: 100%;
top:0;
right: 0;
left: 0;
padding: 0;
margin: 0;
padding: 10px;
width: auto;
}
.word{
color:black;
}
/********************************************************/
/* FIRST PAGE */
/* HOMEPAGE */
/********************************************************/
div.homecontent{
div.homepage{
/* padding-top: 4em; */
}
div.home > a{
border-bottom: 1px dashed black;
padding: 0.1em;
margin: 0.5em;
line-height: 1.5em;
}
div.home{
/* padding: 1em 5em 1em 7.5em; */
padding-left: 15em;
padding-top: 2em;
padding-bottom: 3em;
padding-right: 5em;
padding: 5em 5em 1em 7.5em;
text-align: justify;
font-size: 0.8em;
}
@ -139,7 +155,6 @@ div.home a:hover{
color: white;
}
div.explanation{
font-size: 0.75em;
float: right;
@ -152,10 +167,11 @@ div.explanation{
/********************************************************/
/* NAVIGATION */
/********************************************************/
header{
margin-top: 7em;
margin-right: 10em;
position: fixed;
position: absolute;
top:17em;
-webkit-transform-origin: 0 50%;
-moz-transform-origin: 0 50%;
@ -173,20 +189,14 @@ header{
display: inline-block;
background: none;
padding-top: 0.5em;
padding-left: 5em;
}
#logobox a, #logobox a:visited{
color: black;
}
/*#logobox a:hover{
animation: blinker 0.05s linear infinite;
}
*/
/*@keyframes blinker {
50% { opacity: 0; }
}*/
#logobox h1{
font-size: 5em;
font-size: 5vw;
font-family: 'Steps Thin Mono';
margin-top: 0;
}
@ -207,10 +217,11 @@ nav ul.menu {
margin-top: 0.6em;
}
/********************************************************/
/* BUTTONS */
/********************************************************/
/* here we are testing the button*/
/*generate the score*/
div.generate-button {
position: fixed;
@ -222,6 +233,7 @@ div.generate-button {
border-radius: 50%;
animation: giro 24s infinite linear;
background:red;
position: fixed;
}
div.generate-button > span:first-child {
@ -245,6 +257,7 @@ div.generate-button span {
}
/*index*/
div.generate-button-index {
position: fixed;
width: 5rem;
@ -255,6 +268,7 @@ div.generate-button-index {
border-radius: 50%;
animation: giro 7.5s infinite linear;
background: magenta;
position: fixed;
}
div.generate-button-index > span:first-child {
@ -276,7 +290,6 @@ div.generate-button-index span {
text-transform: uppercase;
}
/*about*/
div.generate-button-about {
@ -289,6 +302,7 @@ div.generate-button-about {
border-radius: 50%;
animation: girominus 10s infinite linear;
background:yellow;
position: fixed;
}
div.generate-button-about > span:first-child {
@ -314,21 +328,13 @@ div.generate-button-about span {
100% {transform: rotate(-1turn)}
}
@keyframes giro {
100% {transform: rotate(1turn)}
}
/********************************************************/
/* TEXT */
/* DESCRIPTION PAGE */
/********************************************************/
a{
@ -342,6 +348,7 @@ a:visited {
ul{
list-style: none;
}
li a{
text-decoration: none;
color: #0000FF
@ -364,39 +371,13 @@ li:hover {
img{
max-width: 90%;
height: auto;
margin-bottom: 15px;
}
video{
max-width: 90%;
}
/********************************************************/
/* THE CLICKED WORDS DISPLAYED */
/********************************************************/
#thewordpath{
font-family: 'Compagnon Light';
/* font-style: roman; */
display: block;
width: 100%;
top:0;
right: 0;
left: 0;
padding: 0;
margin: 0;
padding: 10px;
width: auto;
}
.word{
color:black;
}
/********************************************************/
/* THE CONTENT IN TWO COLUMNS */
/********************************************************/
.description{
width: 80%;
}
@ -404,6 +385,15 @@ video{
float: right;
width: 50%;
}
.text a:visited{
color: red;
}
.text a:hover{
background: : red;
color: white;
}
.item{
float: left;
width: 50%;
@ -441,7 +431,7 @@ nav.nav_bottom {
height: auto;
bottom: 0px;
text-transform: uppercase;
font-size: 15px;
/*font-size: 15vw;*/
line-height: 18px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@ -501,6 +491,7 @@ span.folder-corner {
font-style: italic;
}
/********************************************************/
/* ABOUT PAGE */
/********************************************************/
@ -513,9 +504,9 @@ div.about {
/********************************************************/
/* INDEX OF FOLDERS */
/* THE INDEX */
/********************************************************/
div.allcontentindex{
div.theindexpage{
padding: 0 0 5em 0;
width: 70%;
margin: 0 auto;
@ -549,3 +540,44 @@ a.li-index:hover {
background: transparent;
color: black;
}
/********************************************************/
/* OTHER DISPLAYS */
/********************************************************/
/* Use a media query to add a breakpoint at 800px: */
@media screen and (max-width: 600px) {
/*all pages*/
div.content-block {
padding: 0em 2em 0em 2.5em; /* The width is 100%, when the viewport is 800px or smaller */
}
#logobox{
padding: 0em;
}
/*home*/
div.home{
padding: 0em;
}
/*diverge*/
div.diverge_all{
padding: 0em;
}
/*description*/
div.text{
width: 100%;
}
div.item{
width: 100%;
}
div.about{
width: 100%;
}
div.descriptionpage{
display: flex;
flex-direction: column-reverse;
}
/*index*/
div.theindexpage{
width: 100%;
}
}
Write Preview
Loading…
Cancel
Save