510 lines
9.5 KiB
CSS
510 lines
9.5 KiB
CSS
/*
|
|
Crowd Discusses Alternatives is a web application for more organized discussions that help people create alternative solutions, evaluate and rank them.
|
|
|
|
Copyright 2021-2022 Stavros Kalognomos
|
|
|
|
This file is part of Crowd Discusses Alternatives.
|
|
|
|
Crowd Discusses Alternatives is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
|
|
|
|
Crowd Discusses Alternatives is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License along with Crowd Discusses Alternatives. If not, see <https://www.gnu.org/licenses/>.
|
|
*/
|
|
* {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
--style-margin-left: 0.5em;
|
|
--style-padding: 0.2em;
|
|
box-sizing: border-box;
|
|
/*border: 1px solid black;*/
|
|
}
|
|
|
|
body {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
font-size: 100%;
|
|
background-color: #D3D3D3;
|
|
}
|
|
|
|
label, .div_as_label {
|
|
font-size: 1em;
|
|
font-weight: 500;
|
|
margin-left: var(--style-margin-left);
|
|
color: #800000;
|
|
position: relative;
|
|
top: -0.2em;
|
|
}
|
|
|
|
/*-->> For header that contains logo, signup, login, logout. -->>*/
|
|
.header_ul {
|
|
list-style-type: none;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
align-items: flex-end;
|
|
background-color: #66FFFF;
|
|
padding-left: 0.2em;
|
|
position: -webkit-sticky; /* Safari */
|
|
position: sticky;
|
|
top: 0;
|
|
}
|
|
|
|
.header_ul a { /*From class header-ul the a elements*/
|
|
font-size: 0.8em;
|
|
margin-right: 1em;
|
|
text-decoration: none;
|
|
}
|
|
|
|
#logo {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
font-size: 1.5em;
|
|
font-weight: 500;
|
|
color: #0000FF;
|
|
text-decoration: none;
|
|
margin-right: 2em;
|
|
}
|
|
/*<<-- For header that contains logo, signup, login, logout. <<--*/
|
|
|
|
form {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
input {
|
|
border: 1px solid;
|
|
border-radius: 2px;
|
|
margin-left: var(--style-margin-left);
|
|
padding: var(--style-padding);
|
|
}
|
|
|
|
.input_ids_entries, .input_strs_entries
|
|
{
|
|
width: 40%;
|
|
}
|
|
|
|
button {
|
|
border-style: none;
|
|
border-radius: 2px;
|
|
margin-left: 1.5em;
|
|
padding: var(--style-padding);
|
|
border: 1px solid grey;
|
|
}
|
|
|
|
button:hover {
|
|
border: 1px solid #800000;
|
|
color: #800000;
|
|
}
|
|
|
|
p {
|
|
font-size: 0.9em;
|
|
font-weight: 100;
|
|
margin-left: var(--style-margin-left);
|
|
padding: 1em;
|
|
}
|
|
|
|
footer {
|
|
list-style-type: none;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
align-items: flex-end;
|
|
background-color: #66FFFF;
|
|
padding-left: 0.2em;
|
|
}
|
|
|
|
footer p {
|
|
padding: 0.5em;
|
|
}
|
|
|
|
/*-->> For Navigation bar (dropdown menu). -->>*/
|
|
nav {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
align-items: flex-start;
|
|
margin-left: var(--style-margin-left);
|
|
position: -webkit-sticky; /* Safari */
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 2;
|
|
}
|
|
|
|
nav ul {
|
|
list-style-type: none;
|
|
padding: 0.2em;
|
|
font-size: 0.9em;
|
|
background-color: #ffe4b3; /* #fff5cc */
|
|
width: 10em;
|
|
border-left: 1px solid grey;
|
|
}
|
|
|
|
.dropdown_content {
|
|
display: none;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
nav ul:hover .dropdown_content, nav ul:hover .dropdown_content a {
|
|
display: block;
|
|
}
|
|
|
|
nav a {
|
|
text-decoration: none;
|
|
font-size: 0.9em;
|
|
color: black;
|
|
padding: 0.2em;
|
|
|
|
border-style: none;
|
|
border-radius: 2px;
|
|
border: 1px solid yellow;
|
|
}
|
|
|
|
nav a:hover {
|
|
border-style: none;
|
|
border-radius: 2px;
|
|
border: 1px solid #800000;
|
|
color: #800000;
|
|
}
|
|
/*<<-- For Navigation bar (dropdown menu). <<--*/
|
|
|
|
/*-->> For list of topics, or groups, or proposals, or comments, or references. -->>*/
|
|
.tgpcrAll {
|
|
margin-left: var(--style-margin-left);
|
|
margin-right: var(--style-margin-left);
|
|
z-index: 0;
|
|
}
|
|
|
|
.class_topic, .class_proposal, .class_comment, .class_requirement, .class_reference, .class_group, .class_similarity, .class_user, .class_message, .tgpcr_table_header {
|
|
width: 100%;
|
|
padding: var(--style-padding);
|
|
margin-bottom: var(--style-margin-left);
|
|
/*background-color: #fff5cc;*/
|
|
border: 1px solid grey;
|
|
border-radius: 7px;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.class_topic {
|
|
background-color: #66FFFF;
|
|
}
|
|
|
|
.class_proposal {
|
|
background-color: #fff5cc;
|
|
}
|
|
|
|
.class_comment {
|
|
background-color: #F0F8FF; /*#F5F5F5 #F0F8FF #E6E6FA #FFF8DC #FFF0F5 #F0FFF0 #F5F5DC #F0FFFF #FAEBD7 #FAFAD2 #DCDCDC #FDF5E6*/
|
|
}
|
|
|
|
.class_requirement {
|
|
background-color: white;
|
|
}
|
|
|
|
.class_reference {
|
|
background-color: #FFC0CB;
|
|
}
|
|
|
|
.class_group {
|
|
background-color: #DEB887; /*#FFA07A #DEB887 #DAA520 #FFDAB9 #FFDEAD #FFA07A #FFB6C1 #F4A460 #BDB76B #E9967A #F0E68C
|
|
#FFE4C4 #EEE8AA #DA70D6 #FA8072 #D2B48C #F5DEB3 #EE82EE*/
|
|
}
|
|
|
|
.class_similarity {
|
|
background-color: #FFA500; /* #FFA500 #FF8C00*/
|
|
}
|
|
|
|
.class_user {
|
|
background-color: #fff5cc;
|
|
}
|
|
|
|
.class_message {
|
|
background-color: white;
|
|
}
|
|
|
|
.class_topic div, .class_proposal div, .class_comment div, .class_requirement div, .class_reference div, .class_group div, .class_similarity div, .class_user div, .class_message div, .tgpcr_table_header div {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
padding: var(--style-padding);
|
|
}
|
|
|
|
.id_text {
|
|
width: 8em;
|
|
font-size: 0.8em;
|
|
color: blue;
|
|
}
|
|
|
|
.votes_text {
|
|
width: 3em;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.user_date_text {
|
|
width: 10em;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.tgpcr_text {
|
|
width: 55%;
|
|
min-width: 30em;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.username_text {
|
|
width: 10em;
|
|
font-size: 1em;
|
|
}
|
|
|
|
#table_header { /*not used names: topic_table_header*/
|
|
display: inline-block;
|
|
position: -webkit-sticky; /* Safari */
|
|
position: sticky;
|
|
top: 2em;
|
|
background-color: #ffe4b3;
|
|
z-index: 1;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
min-width: 30em;
|
|
height: 10em;
|
|
padding: var(--style-padding);
|
|
margin: var(--style-margin-left);
|
|
box-sizing: border-box;
|
|
border: 1px solid grey;
|
|
border-radius: 7px;
|
|
background-color: #f8f8f8;
|
|
font-size: 1em;
|
|
resize: none;
|
|
}
|
|
|
|
.commentsofg_p {
|
|
padding-top: 0em;
|
|
padding-left: 1em;
|
|
padding-right: 1em;
|
|
padding-bottom: 0.5em;
|
|
}
|
|
/*<<-- For list of topics, or groups, or proposals, or comments, or references. <<--*/
|
|
|
|
.div_showtgpcr p {
|
|
display: inline-block;
|
|
padding: 0px;
|
|
margin-bottom: 1.5em;
|
|
}
|
|
|
|
#showt p { /*not used names: #div_show_more_topics p*/
|
|
display: inline-block;
|
|
}
|
|
|
|
#form_toolbar {
|
|
flex-direction: row;
|
|
background-color: #ffe4b3;
|
|
}
|
|
|
|
#form_toolbar div {
|
|
margin-bottom: 0.5em;
|
|
margin-top: 0.5em;
|
|
}
|
|
|
|
#div_toolbar_select {
|
|
width: 100%;
|
|
}
|
|
|
|
.div_checkbox {
|
|
width: 10em;
|
|
}
|
|
|
|
.div_radio {
|
|
width: 15em;
|
|
}
|
|
|
|
#div_toolbar_btn {
|
|
width: 100%;
|
|
}
|
|
|
|
.div_checkbox label, .div_radio label {
|
|
font-size: 0.9em;
|
|
color: black;
|
|
}
|
|
|
|
.link_in_selected p {
|
|
padding-bottom: 0em;
|
|
padding-left: 1em;
|
|
padding-right: 1em;
|
|
padding-top: 1em;
|
|
}
|
|
|
|
.label_for {
|
|
font-size: 0.9em;
|
|
font-weight: 100;
|
|
color: black;
|
|
display: block;
|
|
width: 100%;
|
|
position: relative;
|
|
top: 0em;
|
|
padding: var(--style-padding);
|
|
margin-left: var(--style-margin-left);
|
|
}
|
|
|
|
.input_time_table {
|
|
margin-bottom: 0.5em;
|
|
width: 15em;
|
|
}
|
|
|
|
.div_inputlabel_timetable {
|
|
width: 100%;
|
|
padding: var(--style-padding);
|
|
margin: var(--style-margin-left);
|
|
box-sizing: border-box;
|
|
border: 1px solid grey;
|
|
border-radius: 7px;
|
|
}
|
|
|
|
.div_view_timetable, .div_view_timetable p {
|
|
padding: 0.5em;
|
|
margin-left: var(--style-margin-left);
|
|
margin-right: var(--style-margin-left);
|
|
}
|
|
|
|
.div_show_closing_date {
|
|
font-size: 1em;
|
|
margin-left: 2em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.input_url {
|
|
width: 100%;
|
|
margin-right: 0.5em;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.paragraphafterbutton {
|
|
display: inline-block;
|
|
padding: 0em;
|
|
margin-bottom: 0.7em;
|
|
}
|
|
|
|
.form_inline
|
|
{
|
|
display: inline;
|
|
}
|
|
|
|
.input_weightfactor, .input_score
|
|
{
|
|
width: 8em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.div_score
|
|
{
|
|
padding-left: 1em;
|
|
padding-right: 1em;
|
|
padding-top: 0.2em;
|
|
}
|
|
|
|
.div_totalscore
|
|
{
|
|
margin-top: 0.5em;
|
|
margin-left: 1em;
|
|
font-size: 1em;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/*-->> For about page. -->>*/
|
|
.aboutpage h2, .aboutpage p, .aboutpage ul
|
|
{
|
|
margin-left: var(--style-margin-left);
|
|
padding: 0.5em;
|
|
}
|
|
|
|
.aboutpage h2
|
|
{
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
.aboutpage p, .aboutpage ul
|
|
{
|
|
font-size: 1em;
|
|
}
|
|
|
|
.aboutpage ul
|
|
{
|
|
margin-left: 1.5em;
|
|
list-style-type: circle solid;
|
|
}
|
|
/*<<-- For about page. <<--*/
|
|
|
|
/*-->> For vote table info. -->>*/
|
|
.votetableinfo
|
|
{
|
|
border: 1px solid;
|
|
border-radius: 7px;
|
|
margin: 1.5em;
|
|
margin-top: 0.5em;
|
|
padding: 0.5em;
|
|
}
|
|
|
|
.votetableinfotitle
|
|
{
|
|
font-size: 0.9em;
|
|
margin-bottom: 0.3em;
|
|
}
|
|
|
|
.votetableinfo ul
|
|
{
|
|
font-size: 0.9em;
|
|
margin-left: 0.3em;
|
|
list-style-type: none;
|
|
}
|
|
/*<<-- For vote table info. <<--*/
|
|
|
|
/*-->> For temporary results. -->>*/
|
|
.temporaryresults
|
|
{
|
|
margin-left: 1.5em;
|
|
margin-right: 1.5em;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.temporaryresults h2
|
|
{
|
|
margin-top: 0.4em;
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
.temporaryresults th, td
|
|
{
|
|
border: 1px solid;
|
|
border-radius: 2px;
|
|
font-size: 0.9em;
|
|
padding-left: 0.2em;
|
|
padding-right: 0.2em;
|
|
}
|
|
|
|
.indexofresults, .aliasofresults
|
|
{
|
|
width: 6em;
|
|
}
|
|
|
|
.voteofresults
|
|
{
|
|
width: 4em;
|
|
}
|
|
|
|
.usernameofresults
|
|
{
|
|
width: 7em;
|
|
}
|
|
|
|
.hashnumberofresults
|
|
{
|
|
width: 37em;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.hashnumberofresultstitle
|
|
{
|
|
width: 32.9em;
|
|
font-size: 0.9em;
|
|
}
|
|
/*<<-- For temporary results. <<--*/ |