root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _details.scss @ ef5eff50
History | View | Annotate | Download (4.6 kB)
| 1 | e4a6c3b8 | Olga Brani | $details-icon-large : 90px; |
|---|---|---|---|
| 2 | e4a6c3b8 | Olga Brani | |
| 3 | e4a6c3b8 | Olga Brani | .details {
|
| 4 | e4a6c3b8 | Olga Brani | $details-top-title-h : 0.4 * $details-top-height; |
| 5 | e4a6c3b8 | Olga Brani | $details-top-more-h : ( $details-top-height - $details-top-title-h )/2; |
| 6 | e4a6c3b8 | Olga Brani | position:relative; |
| 7 | e4a6c3b8 | Olga Brani | border-left: 1px solid $border-color-1; |
| 8 | e4a6c3b8 | Olga Brani | border-right: 1px solid $border-color-1; |
| 9 | e4a6c3b8 | Olga Brani | .lt {
|
| 10 | e4a6c3b8 | Olga Brani | width: $details-lt-width; |
| 11 | e4a6c3b8 | Olga Brani | float: left; |
| 12 | e4a6c3b8 | Olga Brani | text-align: center; |
| 13 | e4a6c3b8 | Olga Brani | border-right: 1px solid $border-color-1; |
| 14 | e4a6c3b8 | Olga Brani | height: $details-top-height; |
| 15 | e4a6c3b8 | Olga Brani | line-height: $details-top-height; |
| 16 | e4a6c3b8 | Olga Brani | } |
| 17 | e4a6c3b8 | Olga Brani | .rt {
|
| 18 | e4a6c3b8 | Olga Brani | overflow: hidden; |
| 19 | e4a6c3b8 | Olga Brani | } |
| 20 | e4a6c3b8 | Olga Brani | .top {
|
| 21 | e4a6c3b8 | Olga Brani | @extend .clearfix; |
| 22 | e4a6c3b8 | Olga Brani | border-bottom:1px solid $border-color-1; |
| 23 | e4a6c3b8 | Olga Brani | position: relative; |
| 24 | e4a6c3b8 | Olga Brani | z-index: 1; |
| 25 | e4a6c3b8 | Olga Brani | .img-wrap {
|
| 26 | e4a6c3b8 | Olga Brani | position: relative; |
| 27 | e4a6c3b8 | Olga Brani | vertical-align: middle; |
| 28 | e4a6c3b8 | Olga Brani | width: auto; |
| 29 | e4a6c3b8 | Olga Brani | height: $details-icon-large; |
| 30 | e4a6c3b8 | Olga Brani | .snf-pc-full, |
| 31 | e4a6c3b8 | Olga Brani | .snf-network-full {
|
| 32 | e4a6c3b8 | Olga Brani | font-size: $details-icon-large; |
| 33 | e4a6c3b8 | Olga Brani | } |
| 34 | e4a6c3b8 | Olga Brani | .os {
|
| 35 | e4a6c3b8 | Olga Brani | @include sprite('../images/os-unknown.png', 30px, 30px);
|
| 36 | e4a6c3b8 | Olga Brani | position: absolute; |
| 37 | e4a6c3b8 | Olga Brani | background-size:100%; |
| 38 | e4a6c3b8 | Olga Brani | left: 42px; |
| 39 | e4a6c3b8 | Olga Brani | top: 15px; |
| 40 | e4a6c3b8 | Olga Brani | &.windows { background-image:url('../images/os-windows.png'); }
|
| 41 | e4a6c3b8 | Olga Brani | &.kubuntu { background-image:url('../images/os-kubuntu.png'); }
|
| 42 | e4a6c3b8 | Olga Brani | &.fedora { background-image:url('../images/os-fedora.png'); }
|
| 43 | e4a6c3b8 | Olga Brani | } |
| 44 | e4a6c3b8 | Olga Brani | } |
| 45 | e4a6c3b8 | Olga Brani | .title {
|
| 46 | e4a6c3b8 | Olga Brani | height: $details-top-title-h; |
| 47 | e4a6c3b8 | Olga Brani | padding: 0 0 0 $details-top-more-padding-lt; |
| 48 | e4a6c3b8 | Olga Brani | } |
| 49 | e4a6c3b8 | Olga Brani | .actions, .tabs {
|
| 50 | e4a6c3b8 | Olga Brani | border-top: 1px solid $border-color-1; |
| 51 | e4a6c3b8 | Olga Brani | height: $details-top-more-h; |
| 52 | e4a6c3b8 | Olga Brani | line-height: $details-top-more-h; |
| 53 | e4a6c3b8 | Olga Brani | padding: 0 0 0 $details-top-more-padding-lt; |
| 54 | e4a6c3b8 | Olga Brani | } |
| 55 | e4a6c3b8 | Olga Brani | .actions {
|
| 56 | e4a6c3b8 | Olga Brani | font-size: emCalc(14px); |
| 57 | e4a6c3b8 | Olga Brani | a {
|
| 58 | e4a6c3b8 | Olga Brani | text-transform: capitalize; |
| 59 | e4a6c3b8 | Olga Brani | } |
| 60 | e4a6c3b8 | Olga Brani | } |
| 61 | e4a6c3b8 | Olga Brani | .tabs {
|
| 62 | e4a6c3b8 | Olga Brani | font-size: emCalc(22px); |
| 63 | e4a6c3b8 | Olga Brani | } |
| 64 | e4a6c3b8 | Olga Brani | ul {
|
| 65 | e4a6c3b8 | Olga Brani | list-style: none outside none; |
| 66 | e4a6c3b8 | Olga Brani | padding:0; |
| 67 | e4a6c3b8 | Olga Brani | margin: 0; |
| 68 | e4a6c3b8 | Olga Brani | li {
|
| 69 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 70 | e4a6c3b8 | Olga Brani | padding: 0 20px 0 0 ; |
| 71 | e4a6c3b8 | Olga Brani | margin: 0; |
| 72 | e4a6c3b8 | Olga Brani | line-height: $details-top-more-h; |
| 73 | e4a6c3b8 | Olga Brani | } |
| 74 | e4a6c3b8 | Olga Brani | } |
| 75 | e4a6c3b8 | Olga Brani | h1 {
|
| 76 | e4a6c3b8 | Olga Brani | font-size: emCalc(16px); |
| 77 | e4a6c3b8 | Olga Brani | margin: 0; |
| 78 | e4a6c3b8 | Olga Brani | padding-top: 16px; |
| 79 | e4a6c3b8 | Olga Brani | span {
|
| 80 | e4a6c3b8 | Olga Brani | font-size: emCalc(12px); |
| 81 | e4a6c3b8 | Olga Brani | display: block; |
| 82 | e4a6c3b8 | Olga Brani | font-weight: normal; |
| 83 | e4a6c3b8 | Olga Brani | } |
| 84 | e4a6c3b8 | Olga Brani | } |
| 85 | e4a6c3b8 | Olga Brani | } |
| 86 | e4a6c3b8 | Olga Brani | .content {
|
| 87 | e4a6c3b8 | Olga Brani | &.hidden {
|
| 88 | e4a6c3b8 | Olga Brani | display: none; |
| 89 | e4a6c3b8 | Olga Brani | } |
| 90 | e4a6c3b8 | Olga Brani | } |
| 91 | e4a6c3b8 | Olga Brani | .info-simple {
|
| 92 | e4a6c3b8 | Olga Brani | padding: 0 0 0 $details-lt-width; |
| 93 | e4a6c3b8 | Olga Brani | .info-block {
|
| 94 | e4a6c3b8 | Olga Brani | padding:$details-top-more-padding-lt; |
| 95 | e4a6c3b8 | Olga Brani | background: url('../images/dashed_atom-x.png') repeat-x bottom;
|
| 96 | e4a6c3b8 | Olga Brani | dl {
|
| 97 | e4a6c3b8 | Olga Brani | margin-bottom: 0; |
| 98 | e4a6c3b8 | Olga Brani | font-size: emCalc(14px); |
| 99 | e4a6c3b8 | Olga Brani | dt {
|
| 100 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 101 | e4a6c3b8 | Olga Brani | width: 42%; |
| 102 | e4a6c3b8 | Olga Brani | vertical-align: top; |
| 103 | e4a6c3b8 | Olga Brani | font-weight: normal; |
| 104 | e4a6c3b8 | Olga Brani | .snf-font {
|
| 105 | e4a6c3b8 | Olga Brani | width: 40px; |
| 106 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 107 | e4a6c3b8 | Olga Brani | font-size: emCalc(24px); |
| 108 | e4a6c3b8 | Olga Brani | position: relative; |
| 109 | e4a6c3b8 | Olga Brani | bottom: -2px; |
| 110 | e4a6c3b8 | Olga Brani | } |
| 111 | e4a6c3b8 | Olga Brani | } |
| 112 | e4a6c3b8 | Olga Brani | dd {
|
| 113 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 114 | e4a6c3b8 | Olga Brani | width: 45%; |
| 115 | e4a6c3b8 | Olga Brani | margin-bottom: 1em; |
| 116 | e4a6c3b8 | Olga Brani | } |
| 117 | e4a6c3b8 | Olga Brani | } |
| 118 | ef5eff50 | Olga Brani | .tags {
|
| 119 | e4a6c3b8 | Olga Brani | text-align:left; |
| 120 | ef5eff50 | Olga Brani | li {
|
| 121 | ef5eff50 | Olga Brani | list-style: none outside none; |
| 122 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 123 | ef5eff50 | Olga Brani | margin-right: 25px; |
| 124 | ef5eff50 | Olga Brani | } |
| 125 | ef5eff50 | Olga Brani | .tag {
|
| 126 | ef5eff50 | Olga Brani | vertical-align: middle; |
| 127 | ef5eff50 | Olga Brani | } |
| 128 | ef5eff50 | Olga Brani | .delete {
|
| 129 | ef5eff50 | Olga Brani | margin-left: 10px; |
| 130 | e4a6c3b8 | Olga Brani | } |
| 131 | e4a6c3b8 | Olga Brani | .btns {
|
| 132 | e4a6c3b8 | Olga Brani | margin-top: 77px; |
| 133 | e4a6c3b8 | Olga Brani | margin-bottom: 20px; |
| 134 | e4a6c3b8 | Olga Brani | a:first-child {
|
| 135 | e4a6c3b8 | Olga Brani | margin-right: 15px; |
| 136 | e4a6c3b8 | Olga Brani | } |
| 137 | e4a6c3b8 | Olga Brani | } |
| 138 | e4a6c3b8 | Olga Brani | .buttons {
|
| 139 | e4a6c3b8 | Olga Brani | margin-top: 25px; |
| 140 | e4a6c3b8 | Olga Brani | margin-bottom: 25px; |
| 141 | e4a6c3b8 | Olga Brani | } |
| 142 | e4a6c3b8 | Olga Brani | h3 {
|
| 143 | e4a6c3b8 | Olga Brani | margin: 0; |
| 144 | e4a6c3b8 | Olga Brani | font-size: emCalc(14px); |
| 145 | e4a6c3b8 | Olga Brani | font-weight: normal; |
| 146 | e4a6c3b8 | Olga Brani | } |
| 147 | e4a6c3b8 | Olga Brani | } |
| 148 | e4a6c3b8 | Olga Brani | &.charts {
|
| 149 | e4a6c3b8 | Olga Brani | .graph_container {
|
| 150 | e4a6c3b8 | Olga Brani | margin-bottom: 20px; |
| 151 | e4a6c3b8 | Olga Brani | } |
| 152 | e4a6c3b8 | Olga Brani | } |
| 153 | e4a6c3b8 | Olga Brani | } |
| 154 | e4a6c3b8 | Olga Brani | } |
| 155 | e4a6c3b8 | Olga Brani | .content {
|
| 156 | e4a6c3b8 | Olga Brani | h2 {
|
| 157 | e4a6c3b8 | Olga Brani | font-size: emCalc(16px); |
| 158 | e4a6c3b8 | Olga Brani | line-height: 1; |
| 159 | e4a6c3b8 | Olga Brani | margin-bottom: 40px; |
| 160 | e4a6c3b8 | Olga Brani | } |
| 161 | e4a6c3b8 | Olga Brani | } |
| 162 | e4a6c3b8 | Olga Brani | .lt-bar {
|
| 163 | e4a6c3b8 | Olga Brani | @include ltbar($details-lt-width); |
| 164 | e4a6c3b8 | Olga Brani | padding: 0; |
| 165 | e4a6c3b8 | Olga Brani | display: none; |
| 166 | e4a6c3b8 | Olga Brani | .items-list {
|
| 167 | e4a6c3b8 | Olga Brani | .img-wrap {
|
| 168 | e4a6c3b8 | Olga Brani | .snf-font {
|
| 169 | e4a6c3b8 | Olga Brani | font-size: $snf-font-size-medium;; |
| 170 | e4a6c3b8 | Olga Brani | } |
| 171 | e4a6c3b8 | Olga Brani | } |
| 172 | e4a6c3b8 | Olga Brani | } |
| 173 | e4a6c3b8 | Olga Brani | } |
| 174 | e4a6c3b8 | Olga Brani | } |
| 175 | e4a6c3b8 | Olga Brani | |
| 176 | e4a6c3b8 | Olga Brani | .scroll-wrap {
|
| 177 | e4a6c3b8 | Olga Brani | // overflow: auto; |
| 178 | e4a6c3b8 | Olga Brani | position: relative; |
| 179 | e4a6c3b8 | Olga Brani | } |
| 180 | e4a6c3b8 | Olga Brani | |
| 181 | e4a6c3b8 | Olga Brani | .toggle-lt-bar {
|
| 182 | e4a6c3b8 | Olga Brani | position: absolute; |
| 183 | e4a6c3b8 | Olga Brani | left:0; |
| 184 | e4a6c3b8 | Olga Brani | top: 35px; |
| 185 | e4a6c3b8 | Olga Brani | background: $link-color; |
| 186 | e4a6c3b8 | Olga Brani | z-index: 4; |
| 187 | e4a6c3b8 | Olga Brani | color: #fff; |
| 188 | e4a6c3b8 | Olga Brani | display: block; |
| 189 | e4a6c3b8 | Olga Brani | height: 100px; |
| 190 | e4a6c3b8 | Olga Brani | line-height: 85px; |
| 191 | e4a6c3b8 | Olga Brani | padding: 0 5px; |
| 192 | e4a6c3b8 | Olga Brani | &:hover {
|
| 193 | e4a6c3b8 | Olga Brani | background: $link-color-hover; |
| 194 | e4a6c3b8 | Olga Brani | color: #fff; |
| 195 | e4a6c3b8 | Olga Brani | } |
| 196 | e4a6c3b8 | Olga Brani | &.fix-position {
|
| 197 | e4a6c3b8 | Olga Brani | position: fixed; |
| 198 | e4a6c3b8 | Olga Brani | top: $header-height + $bar-height + 35px; |
| 199 | e4a6c3b8 | Olga Brani | left: 50%; |
| 200 | e4a6c3b8 | Olga Brani | margin-left: - ($row-width/2 - emCalc(10px)); |
| 201 | e4a6c3b8 | Olga Brani | border: 1px solid white; |
| 202 | e4a6c3b8 | Olga Brani | |
| 203 | e4a6c3b8 | Olga Brani | } |
| 204 | e4a6c3b8 | Olga Brani | } |
| 205 | e4a6c3b8 | Olga Brani | |
| 206 | e4a6c3b8 | Olga Brani | .list-availables {
|
| 207 | e4a6c3b8 | Olga Brani | &>span{
|
| 208 | e4a6c3b8 | Olga Brani | margin-bottom: 1em; |
| 209 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 210 | e4a6c3b8 | Olga Brani | } |
| 211 | e4a6c3b8 | Olga Brani | ul {
|
| 212 | e4a6c3b8 | Olga Brani | list-style-type: none; |
| 213 | e4a6c3b8 | Olga Brani | li {
|
| 214 | e4a6c3b8 | Olga Brani | line-height: 2.5em; |
| 215 | e4a6c3b8 | Olga Brani | span {
|
| 216 | e4a6c3b8 | Olga Brani | display: inline-block; |
| 217 | e4a6c3b8 | Olga Brani | &:not(:last-child), span:not(:first-child) {
|
| 218 | e4a6c3b8 | Olga Brani | margin-right: 20px; |
| 219 | e4a6c3b8 | Olga Brani | } |
| 220 | e4a6c3b8 | Olga Brani | &:first-child {
|
| 221 | e4a6c3b8 | Olga Brani | margin-right: 30px; |
| 222 | e4a6c3b8 | Olga Brani | } |
| 223 | e4a6c3b8 | Olga Brani | &.snf-font{
|
| 224 | e4a6c3b8 | Olga Brani | vertical-align: middle; |
| 225 | e4a6c3b8 | Olga Brani | &.snf-network-full, &.snf-volume-full {
|
| 226 | e4a6c3b8 | Olga Brani | font-size: 24px; |
| 227 | e4a6c3b8 | Olga Brani | color: $secondary-color; |
| 228 | e4a6c3b8 | Olga Brani | } |
| 229 | e4a6c3b8 | Olga Brani | } |
| 230 | e4a6c3b8 | Olga Brani | &.name {
|
| 231 | e4a6c3b8 | Olga Brani | width: 50%; |
| 232 | e4a6c3b8 | Olga Brani | } |
| 233 | e4a6c3b8 | Olga Brani | } |
| 234 | e4a6c3b8 | Olga Brani | } |
| 235 | e4a6c3b8 | Olga Brani | } |
| 236 | e4a6c3b8 | Olga Brani | } |
| 237 | e4a6c3b8 | Olga Brani | |
| 238 | e4a6c3b8 | Olga Brani | // experiment with select lists |
| 239 | e4a6c3b8 | Olga Brani | .select-list {
|
| 240 | e4a6c3b8 | Olga Brani | border: 0 !important; /*Removes border*/ |
| 241 | e4a6c3b8 | Olga Brani | -webkit-appearance: none; /*Removes default chrome and safari style*/ |
| 242 | e4a6c3b8 | Olga Brani | -moz-appearance: none; /*Removes default style Firefox*/ |
| 243 | e4a6c3b8 | Olga Brani | background-color: transparent; |
| 244 | e4a6c3b8 | Olga Brani | |
| 245 | e4a6c3b8 | Olga Brani | } |