123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115 |
- /* Authors : Carlos C. Corrada-Bravo
- David J. Ortiz-Rivera
-
- Organization : Centro de Desarrollo y Consultoria Computacional
- Project : OPASO Material Registry
- File : materials.css
- Description : Styling for materials page */
-
- .download{
- margin-right: 0px;
- }
-
- td[value=mat_name]{
- cursor: pointer;
- }
-
- td[value=cas]{
- max-width: 250px;
- }
-
- .material-data-icon-wrapper{
- width: 100%;
- cursor: pointer;
- text-align: right;
- padding: 15px 15px 0px;
- }
-
- .material-data-shader{
- top: 0;
- left: 0;
- z-index: 5;
- width: 100%;
- height: 100%;
- position: absolute;
- will-change: transform;
- transform: translateX(-100%);
- background-color: rgba(0,0,0,0);
- transition: all 0.25s ease-in-out;
- }
-
- .material-data-wrapper{
- left: 0;
- top: 0px;
- width: 300px;
- height: 100%;
- background-color: #fff;
- border-right: 1px solid rgb(52,53,54);
- }
-
- .material-data-row,.material-name-wrapper{
- width: 100%;
- padding: 5px 15px;
- display: inline-block;
- word-break: break-all;
- border-bottom: 0.5px solid rgb(52,53,54);
- }
- .material-data-row{
- padding-left: 30px;
- }
-
- .material-name-wrapper{
- border-bottom: 1px solid rgb(52,53,54);
- }
-
- .material-data-header{
- margin-bottom: 7.5px;
- }
-
- .material-data-sub-header{
- width: initial;
- color: #060606;
- }
-
- .material-data-text-wrapper{
- width: 100%;
- padding-left: 15px;
- display: inline-block;
- }
-
- .material-data-text{
- float: right;
- color: #060606;
- }
-
- .material-name{
- float: left;
- color: #060606;
- width: initial;
- display: inline-block;
- }
-
- .hide-material-data-icon{
- color: darkgray;
- }
-
- .slide-right{
- transform: translateX(0%);
- transition: transform 0.25s ease-in-out;
- }
-
- @media screen and (max-width: 991px){
- .download{
- margin-bottom: 0px;
- }
-
- .material-data-shader{
- z-index: 9999;
- }
-
- .material-data-wrapper{
- top: 0px;
- width: 90%;
- height: 100%;
- }
- }
|