lycarch/www/include/style.css

/**
 *   АРХИВ ПУБЛИКАЦИЙ ОБУЧАЮЩИХСЯ И СОТРУДНИКОВ СУНЦ УрФУ
 *   Copyright © 2021, А.М.Гольдин. ISC license
 */

@font-face {
   font-family: "pts"; src: url("../fonts/ptsans.otf") format("opentype");}
@font-face {
   font-family: "mon"; src: url("../fonts/mono.otf") format("opentype");}
html, body {
   height: 100%;}
body {
   display: flex; min-height: 100vh; flex-direction: column;
   margin:0px; padding:0px; font: 14pt pts;}
main {
   flex: 1;}

h2, h3, h4 {
   text-align: center; color: #060; font-size: 16pt;
   margin:20px 0px 15px;}
h3, h4 {
   font-size: 14pt; margin:20px 0px 10px;}
h4 {
   font-weight: normal; font-style: italic; margin:9pt 0px 3pt;}

p {
   -webkit-hyphens: auto; -moz-hyphens: auto;
   -ms-hyphens: auto; hiphens: auto; margin: 3pt 0px;}
p.c {
   text-indent: 0px; text-align: center;}

a {
   color: #090; text-decoration: none; outline: none;}
a:hover {
   color: #0a0; text-decoration: underline;} 

button {
   cursor: pointer;}
button:disabled {
   opacity: 0.3; cursor: default;}

header {
   background:#060; padding: 10px; overflow: auto;}
header img, header div {
   display: inline-block; vertical-align: middle;}
header img {
   width: 200px; margin-right: 40px;}
header p {
   margin: 5px 0px; -webkit-hyphens: none; -moz-hyphens: none;
   -ms-hyphens: none; hiphens: none;}
header p:first-child {
   font-size: 24pt; color: white; line-height: 105%;}
header p:nth-child(2) {
   font-size: 14pt; color: #ddd;}
header div:nth-of-type(2) {
   float: right;}
header input, header button {
   margin:3px; font-size: 70%; padding:3px; border: none;}
header input {
   width: 10em;}
header button {
   background: #090; color: white; width: 4em; height:1.9em;
   vertical-align: middle;}
header div:nth-of-type(2) p {
   color:white; padding-right: 12pt; font-size: 90%;
   text-align: right;}
header div:nth-of-type(2) p a {
   color: #0c0;}
.blink {
   animation: blink 1s infinite;}
@keyframes blink {
   from {opacity: 0.3;} to {opacity: 1;}}

nav {
   text-align: center;}
nav ul {
   margin: 6pt 0px; text-indent: 0px; padding:0px;}
nav li {
   list-style-type: none; display: inline-block; padding: 0px 6pt;}
nav a {
   text-transform: uppercase; font-size: 85%; color:gray;
   text-decoration: none; padding: 2px;}

iframe {
   width: 100%; height: 500px; border: 1px solid #060}

article {
   width: 1000px; max-width: 95%; margin: auto;}

/* Главная страница */
#mainPage p {
   text-align: justify; text-indent: 1.5em;}
#findRes p, #lastArts p {
   text-align: left;}
#mainPage p.c {
   text-indent: 0px; text-align: center;}
#mainPage button {
   display: block; padding: 3px 12pt; background: #060; color:white;
   border:none; margin: 10px auto;}
#mainPage select, #mainPage input {
   font-size: 100%; padding: 3px; text-align: center; margin: 5px;
   border: 1px solid gray; background: white;}
input#findAuthor {
   width: 10em;}
input#findKeys {
   width: 20em;}
   

/* Интерфейс редактора */
#editorPage u {
   color: #090; cursor: pointer;}
#editorPage output {
   display: none; width: 100%; padding: 5px; border: 1px solid gray;
   margin: 20px 0px; background: #eee;}
#editorPage output h3 {
   margin-top: 0px;}
#editorPage b {
   display: inline-block; width: 16em; margin-right: 5px; text-align: right;}
#editorPage output b {
   width: 12em; margin-right: 1em;}
#editorPage span {
   display: inline-block; width: 35em; vertical-align: top;}
#editorPage output span {
   width: 38em;}
#editorPage output h3 span {
   display: inline;}
#editorPage button {
   display: block; padding: 3px 12pt; background: #060; color:white;
   border:none; margin: 10px auto;}
#editorPage textarea, #editorPage select, #editorPage input {
   font-size: 100%; padding: 3px;}
#editorPage textarea {
   display:none; resize: none; width: 100%; height: 7em;
   font-family: pts, serif; margin: 10px auto;}
#editorPage select, #editorPage input {
   text-align: center; font-family: mon, monospace;
   border: 1px solid gray; background: white;}
#editorPage select#selReview, #editorPage select#selCorr {
   display: none; margin: 10px auto;}
#editorPage input {
   width: 8em;}
#edCoAu input, #edCoAu textarea {
   display: block; width:50%; margin: 10px auto;}

/* Таблица со списком статей */
table.artList {
   width: 100%; border-collapse: collapse;}
table.artList th, td {
   border: 1px solid black; padding: 5px; text-align: center;}
table.artList th {
   background: #eee;}
table.artList td:nth-child(3) {
   text-align: left;}
.pnt {cursor: pointer;}
td[title="Смотреть"] a:hover {
   text-decoration: none;}

/* Таблица для подтверждения соавторства */
table#coAuth td {
   text-align: left;}
table#coAuth td.coAuGo {
   cursor: pointer; color: #090; text-align: center;}
table#coAuth td.coAuGo:hover {
   color: #0a0; text-decoration: underline;}

/* Список файлов, загруженных пользователем */
div#filesCat {
   text-align: left;}
div#filesCat p {
   display: inline-block; width: 15em; text-align: left;
   vertical-align: middle;}
div#filesCat p img {
   display: inline-block; width: 5em; vertical-align: middle;
   border: 1px solid gray; margin: 1em;}
div#filesCat p span {
   cursor: pointer;}

/* О редакции */
aside {
   width:max-content; margin: 20px auto;}
aside div {
   margin: 10px 0px;}
#office {
   font-size: 90%;}
aside img {
   display: inline-block; width: 100px; border: 1px solid #060;
   vertical-align: middle;}
aside p {
   display: inline-block; vertical-align: middle; padding-left: 20px;}

/* Мануал для авторов */
section p {
   text-indent: 1.5em; text-align: justify;}
section p.ni {
   text-indent: 0px;}
section ul, section ol {
   margin: 3pt;}
section ul li {
   list-style-type: "— ";}
section li {
   margin-top: 3pt; margin-bottom: 3pt;}
section div {
   width: 30em; max-width: 100%; margin: 12px auto;}
section div div {
      margin: 3pt auto;}
section div p {
   text-indent: 0px; text-align: left; margin: 2pt 0px;}
section div div p {
      font-size: 85%; font-style: italic; padding-left: 1.5em;}
pre, tt {
   font-family: mon, monospace; font-size: 100%;}
pre {
   margin: 6pt 3em;}
tt {
   background: #eee; padding: 1px 2pt;}
section table {
   max-width: 95%; margin: 12pt auto; border-top: 1pt solid black;
   border-collapse: collapse; font-size: 95%;}
section th, section td {
   border-right: 0.25pt solid black; border-bottom: 0.25pt solid black;
   padding: 3pt; text-align: center;}
section th:first-child, section td:first-child  {
   border-left: none;}
section th:last-child, section td:last-child  {
   border-right: none;}
section td:first-child  {
   text-align: left;}
section th {
   border-bottom-width: 1pt; font-weight: normal; font-size: 85%;}
section img.inline {
   vertical-align: middle; position: relative; top: -3.5pt;}

/* Отправка/редактирование статьи */
div#sendPage button, div#sendForm button {
   display:block; margin:12pt auto; padding:3pt 12pt;
   background: #060; color:white; border:none;}
div#sendForm {
   padding:1%; background: #eee; text-align: center;}
div#sendForm input, div#sendForm textarea, div#sendForm select {
   display:block; width:98%; margin:3pt auto; font-size:100%;
   font-family: mon, monospace; padding:2pt; margin:3pt;}
div#sendForm select {
   font-family: pts, sans-serif; padding:0px; }
div#sendForm input::placeholder, div#sendForm textarea::placeholder {
   font-family: pts, serif; color: red}
div#sendForm input[readonly] {
   background: white; border: 1px solid gray;}
div#sendForm input#sendFileInp {
      display: none;}
div#sendForm textarea {
   padding: 3pt; resize: none;}
div#sendForm textarea#pBibl::placeholder,
div#sendForm input#flName::placeholder,
div#sendForm input#pCoAuthors::placeholder {
   color: #555;}

/* Отправка данных о соавторе (модальное окно) */
div#inputCoAuth {
   display: none; width: 400px; height: 440px;
   border: 1px solid #060; border-radius: 5px;
   position: absolute; top: 50%; left: 50%;
   margin: -220px 0px 0px -200px; background: #efe;}
div#inputCoAuth button, div#inputCoAuth input,
div#inputCoAuth textarea, div#inputCoAuth p, div#inputCoAuth span {
   display:block; margin:12pt auto; padding:3pt; width: 350px;
   font-size: 100%; border-radius: 3px;}
div#inputCoAuth button {
   background: #060; color:white; border:none;} 
div#inputCoAuth textarea {
   resize: none; font-size: 90%;}
div#inputCoAuth span {
   text-align: center; font-weight: bold;}
div#inputCoAuth p {
   font-size: 90%; color: #666; text-align: center;}

/* Интерфейс рецензента и корректора */
#revButt, #revSendButt, #corrPage button {
   display:block; margin:12pt auto; padding:3pt 12pt;
   background: #060; color:white; border:none;}
#revButt, #corrPage button {
   display:inline; margin: 10px 10px 12px; vertical-align: middle;}
textarea#revRec, select#revSel, select#revArtID, select#corrArtID {
   display:block; margin:3pt auto; font-size:100%;
   font-family: mon, monospace; padding:3pt;}
textarea#revRec {
   resize: none; width: 100%; height: 10em; font-family: pts, serif;}
select#revSel, select#revArtID, select#corrArtID {
   text-align: center; border: 1px solid gray; background: white;}
select#revArtID, select#corrArtID {
   display: inline;}
#corrPage a {
   display: none;}

footer {
   background: #ddd; text-align: center; font-size: 70%;
   margin-top: 24pt; padding: 5px;}
footer div {
   width: 1000px; max-width: 95%; margin: auto;}