_details.scss 4.1 KB
Newer Older
olga's avatar
olga committed
1
@import "icon-fonts";
2
.main {
olga's avatar
olga committed
3
    margin:2em 0 5em;
4
	h4 .title{
olga's avatar
olga committed
5
		font-size: 24px;
6
	}
olga's avatar
olga committed
7 8 9
    .rt {
        padding-top:5px;
    }
olga's avatar
olga committed
10 11 12
    .actions-per-item {
        padding: 0;
    }
13 14
}

olga's avatar
olga committed
15
.object-details {
Athina Bekakou's avatar
Athina Bekakou committed
16
	h4 {
olga's avatar
olga committed
17 18 19
        font-size: 14px;
        letter-spacing: 1px;
 	    .lt{
20
            display: block;
olga's avatar
olga committed
21
            float: left;
olga's avatar
olga committed
22 23
            max-width: 60%;
            word-wrap: break-word;
olga's avatar
olga committed
24 25
        }
        .rt {
26
            display: block;
olga's avatar
olga committed
27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
            overflow: hidden;
        }
        .arrow {
		    position: relative;
            padding: 0 8px;
		    &:hover {
			    top: 2px;
			    cursor: pointer;
		    }
	    }
       .label{
            float: right;
            margin-left: 15px;
            margin-bottom: 10px;
            &.important {
                font-weight: bold;
            }
        }
        em {
            float: none;
            &.os-info {
                float: right;
                position: relative;
                bottom: 3px;
                img {
                    height: 26px; // *** i think that is the size of all images temp use for preview
                }
            }
	    }
Athina Bekakou's avatar
Athina Bekakou committed
56 57
	}
	h3 {
olga's avatar
olga committed
58
        font-size: 18px;
olga's avatar
olga committed
59
		margin: 0 0 1em;
olga's avatar
olga committed
60 61 62 63 64 65 66 67 68 69 70
        font-weight: 400;
        line-height: $details-title-height;
        em {
            margin-left: 10px;
            font-size: 14px;
        }
        span[class^="snf-details"] {
            float: left;
            margin-right: 8px;
            font-size: $details-title-height;
        }
71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91
        .popover-dismiss {
            display: inline-block;
            @include circle(24px,$snf_gray-light);
            text-align: center;
            font-weight: bold;
            vertical-align: middle;
            line-height: 24px;
            cursor: pointer;
            margin-left:10px;
            color: $almost-white;
            &:hover {
                background: lighten($snf_gray-light, 10%);
            }
        }
        .popover {
            .popover-content {
                font-size: 12px;
                color: $snf_reverse-text-color;
                line-height: 130%;
            }
        }
Athina Bekakou's avatar
Athina Bekakou committed
92
	}
olga's avatar
olga committed
93 94 95
    .icon-link {
        margin-right: 10px;
    }
Athina Bekakou's avatar
Athina Bekakou committed
96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114
	p {
		margin: 10px 20px;
		font-style: italic;
	}

	.length {
		margin-left: 6px;
		border: 0 none;
		font-style: italic;
		&::before {
		    content: '( ';
		}
		&::after {
		    content: ' )';
		}
	}
	&>.object-details {
		margin-left: -20px;
		margin-right: -20px;
olga's avatar
olga committed
115
		padding:12px 20px;
Athina Bekakou's avatar
Athina Bekakou committed
116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142
	}
}

.object-details-content .nav-tabs>li {
	a {
		opacity: 0.7;
		color: white;
	}
	&.active>a {
		opacity: 1;
		border-color: transparent;
		background: $gray-light;
		color: white;
		border-radius: 0;
	}
	&:not(.active)>a:hover {
		opacity: 1;
		color: white;
		border-color: transparent;
		background: transparent;
	}
}

.tab-pane {
	overflow: auto;
}

143
.part-two {
144 145 146 147
     h2 {
        font-size: 24px;
        margin-bottom: 2em;
        padding-top: 1em;
olga's avatar
olga committed
148
        border-top: 2px solid $gray-light-extra;		
149 150 151 152
    }
   
	&>.object-details {
        border-bottom: 2px solid $gray-light-extra;		
olga's avatar
olga committed
153
        background: lighten($body-bg, 3%);
olga's avatar
olga committed
154
		padding:14px 20px;
155
		.object-details {
olga's avatar
olga committed
156 157 158 159
			padding: 5px 20px;
            &:hover {
                background: lighten($body-bg, 5%);
            }
160
		}
161 162 163 164 165
        .custom-btn {
            span {
                padding: 5px;
            }
        }
olga's avatar
olga committed
166 167 168 169
    }
    .object-details-content {
        padding: 0 $details-title-height;
    }
170
    
171 172 173
}


olga's avatar
olga committed
174 175
.snf-details-volume {
    @extend .snf-volume-full;
176 177
}

olga's avatar
olga committed
178 179
.snf-details-vm {
    @extend .snf-pc-full;
180
}
olga's avatar
olga committed
181 182
.snf-details-project {
    @extend .snf-clipboard-h;
183
}
olga's avatar
olga committed
184 185
.snf-details-network {
    @extend .snf-network-full;
186
}
olga's avatar
olga committed
187 188
.snf-details-quota {
    @extend .snf-wallet-full;
189 190
}

olga's avatar
olga committed
191 192
.snf-details-nic {
    @extend .snf-nic-full;
olga's avatar
olga committed
193
}
olga's avatar
olga committed
194 195
.snf-details-user {
    @extend .snf-user-full;
olga's avatar
olga committed
196
}
olga's avatar
olga committed
197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217

.show-hide-all {
    span.snf-font-arrow-up {
        @extend .snf-arrow-up;
        display: none;
        padding: 0;
    }
    span.snf-font-arrow-down {
        @extend .snf-arrow-down;
        display: inline;
        padding: 0;
    }
    &.open {
        .snf-font-arrow-up {
            display: inline;
        } 
        .snf-font-arrow-down {
            display: none;
        }
    }
}