partage

Unnamed repository; edit this file 'description' to name the repository.
git clone git://git.z3bra.org/partage.git
Log | Files | Refs | README | LICENSE

partage.css (1386B)


      1 body {
      2 	padding: 5%;
      3 	margin: auto;
      4 	max-width: 540px;
      5 	font-family: serif;
      6 	font-size: 1.5rem;
      7 	text-align: center;
      8 	background-color: #eeeeee;
      9 	color: #222222;
     10 }
     11 
     12 header {
     13 	display: flex;
     14 	flex-direction: column;
     15 	flex-wrap: wrap-reverse;
     16 	align-items: center;
     17 	align-content: center;
     18 }
     19 
     20 section {
     21 	display: flex;
     22 	justify-content: flex-end;
     23 	font-size: initial;
     24 }
     25 
     26 section#formsettings > * {
     27 	margin-top: 20px;
     28 	margin-left: 20px;
     29 }
     30 
     31 img#logo {
     32 	height: 100%;
     33 	max-height: 30vh;
     34 }
     35 
     36 h1 {
     37 	font-size: 4.0rem;
     38 }
     39 
     40 ul {
     41 	list-style: none;
     42 	text-align: left;
     43 	display: inline-block;
     44 }
     45 
     46 .dropzone {
     47 	padding-top: 60px;
     48 	padding-bottom: 60px;
     49 	border: 2px dashed #888888;
     50 	border-radius: 8px;
     51 	text-align: center;
     52 	margin: auto;
     53 	color: #888888;
     54 }
     55 
     56 .dropzone.dragover {
     57 	color: #222222;
     58 	border-color: #222222;
     59 }
     60 
     61 /* font attributes are not inherited by default */
     62 input, input::file-selector-button {
     63 	text-align: inherit;
     64 	font-family: inherit;
     65 	font-size: inherit;
     66 }
     67 
     68 @media (min-aspect-ratio: 18/9) {
     69 	header {
     70 		flex-direction: row;
     71 	}
     72 	h1 { font-size: 3rem; margin-right: 10px; }
     73 	img#logo {
     74 		height: 50%;
     75 		max-height: 20vh;
     76 		order: 2;
     77 	}
     78 }
     79 
     80 @media (prefers-color-scheme: light) {
     81 	a { color: black; }
     82 	body {
     83 		color: #222222;
     84 		background-color: #eeeeee;
     85 	}
     86 }
     87 
     88 @media (prefers-color-scheme: dark) {
     89 	a { color: white; }
     90 	body {
     91 		color: #eeeeee;
     92 		background-color: #222222;
     93 	}
     94 }