.container-fluid { margin: 2em 4em; padding: 2em; } // ********ICONS******** .back-icon { opacity: 0.4; } .mat-mini-fab { width: 2.5em; height: 2.5em; color: #212121; background-color: #F7DD72; } .mat-mini-fab-icon, .status-icon { font-size: 1.2em; } .actions-btn:hover { background-color: #129D99; color: #FFFFFF; } .status-icon { color: #A7A7A7; } .account-icon { font-size: 2.5em; } // ********BUTTONS******** .version-btn { // width: 6.7em; height: 1.8em; border: 1px solid #707070; border-radius: 4px; background-color: transparent; } .id-btn { background: url('../../../../assets/images/NoPath.png') no-repeat center; width: 1em; margin-right: 0.3em; align-self: center; } .dmp-btn { width: 35em; height: 2.3em; background-color: #129D99; border-radius: 4px; flex-direction: rows; justify-content: space-between; border: none; } .dmp-btn, .dmp-btn > mat-icon { color: #ffffff; opacity: 0.8; } .show-more-btn { width: 31.6em; padding: 0 1em; background-color: #ffffff00; color: #129D99; font-weight: 700; } .frame-btn { border: 1px solid #212121; color: black; } .finalize-btn { border: 1px solid #129D99; color: #129D99; } .frame-btn, .finalize-btn { background: #FFFFFF; box-shadow: 0px 2px 6px #00000029; } .remove-btn { border: none; background-color: transparent; font-size: 0.875em; font-weight: bold; margin-left: auto; } .invite-btn{ width: 9.4em; height: 2.9em; background: #FFFFFF; box-shadow: 0px 3px 6px #1E202029; border: 2px solid #212121; border-radius: 30px; } .account_btn { background: white; color: #D5D5D5; border: none; height: 2.9em; } // ********TEXT******** .dataset-logo { width: 6em; height: 2.6em; background: #F7DD72; border-radius: 4px; font-size: 0.875em; // color: #212121; // color: black; // opacity: 0.75; } .label-txt { font-size: 0.875em; } .label2-txt { font-size: 1em; } .label-txt, .label2-txt { color: #848484; } .dataset-label { font-weight: bold; width: auto; } .uppercase { text-transform: uppercase; } .researcher { font-size: 0.875em; color: #008887; padding-right: 0.5em; align-self: center;; } .header { opacity: 0.6; margin-top: 1em; margin-bottom: 0.5em; } .dataset-label, .header { font-size: 1.25em; color: #212121; } .desc-txt { width: 48.25em; font-size: 1em; color: #212121; margin-bottom: 1.875em; } .dmp-btn-label { margin-right: 1em; overflow: hidden; color: #FFFFFF; opacity: 0.8; } .doi-label { font-size: 1em; color: #212121; opacity: 0.6; margin-bottom: 0.3em; } .doi-txt { font-size: 0.8em; letter-spacing: 0.009em; color: #7D7D7D; width: 12em; height: 1em; overflow: hidden; border: none; padding: 0px; } .doi-panel { height: 3.5em; background: #FAFAFA; border: 1px solid #D1D1D1; border-radius: 4px; flex-direction: row; justify-content: space-between; } .doi-link { color: white; } .frame { background: #FFFFFF; box-shadow: 0px 1px 5px #00000026; border-radius: 4px; overflow: hidden; } .frame-txt { color: #000000; } .finalize-txt { color: #129D99; } .frame-txt, .finalize-txt { font-size: 0.75em; font-weight: bold; letter-spacing: 0px; text-transform: uppercase; cursor: pointer; } .hr-line { border: 1px solid #DBDBDB; // width: 274px; // width: 17em; width: 100%; } .authors { display: flex; flex-direction: row; justify-content: space-between; width: 100%; } .authors-label { font-size: 0.875em; color: #212121; height: 1.4em; margin-bottom: 0px; } .authors-role { font-size: 0.875em; color: #A8A8A8; height: 1.4em; margin-bottom: 0px; } // ********CENTER ELEMENTS******** .mat-mini-fab, .mat-mini-fab-icon, .actions-btn, .status-icon, .dataset-logo, .frame-btn, .finalize-btn { display: flex; justify-content: center; align-items: center; } .dataset-label, .dmp-btn, .doi-panel, .researcher { display: flex; align-items: center; } .show-more-btn { display: flex; justify-content: center; }