Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Data upload UI tweaks new #317

Merged
merged 8 commits into from
Apr 7, 2021
58 changes: 39 additions & 19 deletions lab/webapp/dist/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,9 @@ body {
/* file upload form styling */
.pennai .file-upload-segment {
max-width: 630px;
/* add 'overflow: auto' so the floated child
buttons stay contained within the segment */
overflow: auto;
}
.pennai .file-upload-form-dataset-input {
width: 40%;
Expand All @@ -63,21 +66,43 @@ body {
.pennai .file-upload-help-icon {
padding-left: 0;
}
.pennai .file-upload-ordinal-text-area {
width: 90%
.pennai .file-upload-header {
margin-top: 1em;
}
.pennai .file-upload-sortable-list {
.pennai .file-upload-pseudo-dialog-button {
size: "small";
float: right;
}
.pennai .file-upload-feature-text-info{
color:rgba(255, 255, 255, 0.9);
background-color:rgba(17, 17, 17, 0.9);
}
.pennai .file-upload-feature-text-input{
width: 100%;
color:rgba(255, 255, 255, 0.9);
background-color:rgba(17, 17, 17, 0.9);
resize: none;
}
.pennai .file-upload-centered-div {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 80vh;
}
.file-upload-sortable-list {
list-style-type: none;
margin: auto;
width: 80%;
padding: 10px 5px;
}
.pennai .file-upload-sortable-list-item {
.file-upload-sortable-list-item {
/*border-style: solid;*/
border: 1px solid;
text-align: center;
padding: 2px;
border-color: rgb(84,200,255);
color: rgba(255, 255, 255, 0.9);
border-radius: 4px;
}
/* This class is for the list item that moves
Expand All @@ -89,20 +114,9 @@ the element isn't visible at all.
See https://github.com/clauderic/react-sortable-hoc/issues/87
*/
.file-upload-sortable-list-item-helper {
border: 2px solid;
text-align: center;
/* something happens to the padding compared to the regular item defined above,
and the text is aligned at bottom of border instead of middle.
But these settings aren't effecting things. Huh.
*/
padding-top: 0 !important;
padding-bottom: 5px !important;
border-color: yellow; /* rgb(84,200,255);*/
border-radius: 4px;
z-index: 10; /*important*/
color: rgba(255,255,255,.9);
list-style-type: none; /*remove the bullet*/
}
list-style-type: none;
}
.pennai .file-upload-table {
line-height: 1;
}
Expand Down Expand Up @@ -426,17 +440,23 @@ See https://github.com/clauderic/react-sortable-hoc/issues/87
* The bug is in v1.3.1 and v2.0.0.
* Note that there's no way to reference a color value from the .ui class
* that defines the inverted color w/out adding a css preprocessor */
.pennai .inverted-dropdown-search .ui.search.dropdown {
.pennai .inverted-dropdown-search .ui.search.dropdown {
color: rgba(255,255,255,0.9);
border: 2px solid rgb(84,200,255);
border-radius: 4px;
padding: 0.4em 1em;
}
.pennai .inverted-dropdown-search .ui.search.dropdown > input.search {
.pennai .inverted-dropdown-search .ui.search.dropdown > input.search {
color: rgba(255,255,255,0.9);
}
/* Manual fix for color of dropdown text in an inline form.field dropdown control
within an inverted form.
*/
.pennai .inverted-dropdown-inline .ui.dropdown {
color: rgba(255,255,255,0.9);
border: 2px solid rgb(84,200,255);
border-radius: 4px;
padding: 0.4em 1em;
}

.gauge {
Expand Down
Loading