alu/cse110-fa22-group29
1
0
Fork 0
mirror of https://github.com/cse110-fa22-group29/cse110-fa22-group29.git synced 2024-11-10 05:34:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix css style issues,

Browse Source 
removed css for rating stars

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2022-11-15 01:08:32 +00:00
parent 66dd92f0dc
commit 837ba92d7d
3 changed files with 177 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
source/static/CreatePage.css
View File

@ -10,7 +10,7 @@ body {
}
fieldset {
border: 2px solid rgb(214, 214, 214);
border: 2px solid rgb(214 214 214);
box-sizing: border-box;
display: block;
width: max-content;
@ -26,7 +26,7 @@ label[for="ingredients"] p {
}
label[for="numRatings"] {
margin: 10px 0 0 0;
margin: 10px 0 0;
}
label[for^="rating"] {
@ -52,6 +52,7 @@ main {
display: flex;
flex-flow: row wrap;
}
.tag {
background-color: grey;
border-radius: 7px;
@ -63,7 +64,7 @@ margin: 3px;
.tag::before {
display: inline-block;
content: 'x';
content: "x";
height: 15px;
width: 15px;
margin-right: 4px;
@ -75,54 +76,8 @@ cursor: pointer;
.tag:hover::before {
color: red;
}
.danger {
background-color: rgb(254, 171, 171);
background-color: rgb(254 171 171);
border-color: red;
}
.hidden,
.rating:not(:checked) > input { /* Hide radio circles while star rating */
display: none;
}
/* Unchecked stars */
.rating:not(:checked) > label {
/* Make stars line up sideways and not vertically */
float:right;
/* Hide label text */
width:1em;
overflow:hidden;
white-space:nowrap;
font-size:200%;
line-height:1.2;
color:#b3b3cc;
}
.rating:not(:checked) > label:before {
content:'★';
}
/* Checked star color */
.rating > input:checked ~ label {
color: #FFBF00;
}
.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
color: orangered;
}
.rating > input:checked + label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
color: orangered;
}
.rating > label:active {
position:relative;
}

57
source/static/ReviewCard.css
View File

@ -10,7 +10,7 @@
}
fieldset {
border: 2px solid rgb(214, 214, 214);
border: 2px solid rgb(214 214 214);
box-sizing: border-box;
display: block;
width: max-content;
@ -26,7 +26,7 @@
}
label[for="numRatings"] {
margin: 10px 0 0 0;
margin: 10px 0 0;
}
label[for^="rating"] {
@ -52,6 +52,7 @@
display: flex;
flex-flow: row wrap;
}
.tag {
background-color: grey;
border-radius: 7px;
@ -63,7 +64,7 @@
.tag::before {
display: inline-block;
content: 'x';
content: "x";
height: 15px;
width: 15px;
margin-right: 4px;
@ -71,56 +72,12 @@
color: white;
cursor: pointer;
}
.tag:hover::before {
color: red;
}
.danger {
background-color: rgb(254, 171, 171);
background-color: rgb(254 171 171);
border-color: red;
}
.hidden,
.rating:not(:checked) > input { /* Hide radio circles while star rating */
display: none;
}
/* Unchecked stars */
.rating:not(:checked) > label {
/* Make stars line up sideways and not vertically */
float:right;
/* Hide label text */
width:1em;
overflow:hidden;
white-space:nowrap;
font-size:200%;
line-height:1.2;
color:#b3b3cc;
}
.rating:not(:checked) > label:before {
content:'★';
}
/* Checked star color */
.rating > input:checked ~ label {
color: #FFBF00;
}
.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
color: orangered;
}
.rating > input:checked + label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
color: orangered;
}
.rating > label:active {
position:relative;
}

122
source/static/reset.css
View File

@ -1,17 +1,74 @@
/* This is a generic CSS file that sets preliminary rules for content that should be the same across pages */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
@ -25,8 +82,17 @@ body {
line-height: 1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
@ -34,13 +100,16 @@ nav ul {
list-style: none;
}
blockquote, q {
blockquote,
q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
blockquote::before,
blockquote::after,
q::before,
q::after {
content: "";
content: none;
}
@ -57,23 +126,30 @@ table {
border-spacing: 0;
}
input, select {
input,
select {
vertical-align: middle;
}
img, fieldset, object {
img,
fieldset,
object {
border: none;
}
*, *:after, *:before {
*,
*::after,
*::before {
box-sizing: border-box;
}
button, label {
button,
label {
cursor: pointer;
}
html, body {
html,
body {
height: 100%;
}