git.openstreetmap.org Git - rails.git/blob - app/assets/stylesheets/common.css.scss

1 /* Parameters */

2 $lineheight: 20px;

3 $typeheight: 14px;

5 $offwhite: #f4f4ff;

6 $blue: #7092FF;

7 $lightblue: #B8C5F0;

8 $grey: #AAA;

9 $lightgrey: #CCC;

10 $hovercolor: 20%;

12 /* Styles common to large and small screens */

14 /* Minimal CSS reset */

16 html, body, ul, ol, li, form, fieldset, legend, h1, h2, h3, h4, h5, h6, p, input {

17 margin: 0;

18 padding: 0;

19 border: 0;

20 font-size:100%;

21 }

23 fieldset,img { border: 0; }

25 legend { color: #000; }

27 sup { vertical-align: text-top; }

29 sub { vertical-align: text-bottom; }

31 table {

32 border-collapse: collapse;

33 border-spacing: 0;

34 }

36 li { list-style: none; }

38 input,

39 select,

40 textarea,

41 body { font: #{$typeheight}/#{$lineheight} "Helvetica Neue",Arial,sans-serif; }

43 abbr, acronym {

44 border-bottom: .1em dotted;

45 cursor: help;

46 }

48 /* Micro Clearfix | Details: http://nicolasgallagher.com/micro-clearfix-hack/ */

50 .clearfix:before,

51 .clearfix:after {

52 content: " ";

53 display: table;

54 }

56 .clearfix:after {

57 clear: both;

58 }

60 /* Default rules for the body of every page */

62 * {

63 -moz-box-sizing: border-box;

64 -webkit-box-sizing: border-box;

65 box-sizing: border-box;

66 }

68 body {

69 font-family: 'Helvetica Neue',Arial,sans-serif;

70 font-size: $typeheight;

71 line-height: 1.6666;

72 color: #222;

73 background-color: #fff;

74 margin: 0px;

75 padding: 0px;

76 text-align: left;

77 }

79 body.slim {

80 background-color: #f0f0f0;

81 }

83 h1, h2, h3 {

84 margin-top: $lineheight/2;

85 margin-bottom: $lineheight;

86 font-weight: bold;

87 line-height: 1.2;

88 }

90 h1, h2 {

91 font-size: 32px;

92 }

94 #content h2 {

95 font-size: 21px;

96 }

98 h3 {

99 font-size: 21px;

100 margin-top: $lineheight/2;

101 margin-bottom: $lineheight;

102 }

103

104 h4,h5,h6 {

105 font-size: $typeheight;

106 margin-top: $lineheight/2;

107 margin-bottom: $lineheight/2;

108 font-weight: bold;

109 line-height: 1.5;

110 }

111

112 p, ul {

113 margin-bottom: $lineheight;

114 }

115

116 p > img {

117 width: auto;

118 max-width: 100%;

119 }

120

121 small, aside {

122 font-size: 12px;

123 }

124

125 h1:first-child,

126 h2:first-child,

127 h3:first-child,

128 h4:first-child,

129 h5:first-child,

130 h6:first-child {

131 margin-top: 0;

132 }

133

134 .column-1 {

135 width: 50%;

136 margin: 0 0 $lineheight/2 0;

137 }

138

139 .small_icon {

140 vertical-align: middle;

141 margin-right: $lineheight/4;

142 }

143

144 /* Rules for icons */

145

146 .icon {

147 display:inline-block;

148 vertical-align:top;

149 width:20px;

150 height:20px;

151 background:transparent image-url("sprite.png") no-repeat 0 0;

152 text-indent:-9999px;

153 overflow:hidden;

154 }

155

156 .icon-pre-text {

157 margin-right: 5px;

158 }

159

160 .icon.search { background-position: 0 0; }

161 .icon.donate { background-position: -20px 0; }

162 .icon.zoomin { background-position: -40px 0; }

163 .icon.zoomout { background-position: -60px 0; }

164 .icon.geolocate { background-position: -80px 0; }

165 .active .icon.geolocate { background-position: -80px -20px; }

166 .icon.layers { background-position: -100px 0; }

167 .icon.key { background-position: -120px 0; }

168 .icon.share { background-position: -140px 0; }

169 .icon.clipboard { background-position: -160px 0; }

170 .icon.link { background-position: -180px 0; }

171 .icon.close { background-position: -200px 0; }

172 .icon.check { background-position: -220px 0; }

173 .icon.note { background-position: -240px 0; }

174

175 /* Rules for links */

176

177 a {

178 color: #00f;

179 text-decoration: none;

180 &:hover {

181 text-decoration: underline;

182 }

183 }

184

185 /* Rules for horizontal lines */

186

187 hr {

188 border: none;

189 background-color: #ccc;

190 color: #ccc;

191 height: 1px;

192 }

193

194 /* General styles for tables */

195

196 table {

197 width: 100%;

198 margin-bottom: $lineheight;

199 th, td {

200 text-align: left;

201 padding: $lineheight/4;

202 line-height: $lineheight;

203 }

204 th {

205 font-weight: bold;

206 vertical-align: top;

207 }

208 td {

209 vertical-align: middle;

210 }

211 }

212

213 /* Rules for the whole left sidebar, including the logo */

214

215 #left {

216 position: absolute;

217 height: 100%;

218 width: 185px;

219 font-size: 11px;

220 line-height: 1.1;

221 z-index: 100;

222 border-right: 1px solid #ccc;

223 }

224

225 /* Rules for the OpenStreetMap logo in the top left corner */

226

227 #logo {

228 display: block;

229 width: 170px;

230 min-width: 170px;

231 padding: $lineheight $lineheight/4;

232 text-align: center;

233 margin: auto;

234 }

235

236 #logo h1 {

237 font-size: 18px;

238 line-height: 1;

239 text-align: center;

240 margin: 0;

241 }

242

243 #logo h2 {

244 font-size: $lineheight/2;

245 line-height: 15px;

246 margin: 0;

247 }

248

249 /* Rules for the site name */

250

251 #small-title {

252 display: none;

253 }

254

255 /* Rules for the introductory text displayed in the left sidebar to new users */

256

257 .sidebar-copy {

258 padding: $lineheight/4 $lineheight/2;

259 p {

260 margin: $lineheight/4 0;

261 }

262 }

263 .sidebar-copy.intro {

264 border-top: 1px solid #ccc;

265 }

266

267 /*

268 * Rules for alert boxes shown in the left sidebar when important

269 * information needs to be conveyed such as when the site is

270 * undergoing maintenance.

271 */

272

273 .sidebar-alert {

274 padding: $lineheight/4;

275 border-top: 1px solid #ccc;

276 margin-top: 4px;

277 margin-bottom: -5px;

278 background: #e00;

279 font-size: 12px;

280 font-weight: bold;

281 p {

282 margin: $lineheight/4;

283 }

284 }

285

286 /*

287 * Rules for notice boxes shown in the left sidebar when important, but

288 * non-critical information needs to be conveyed such as notices about

289 * donation drives.

290 */

291

292 .sidebar-notice {

293 padding: $lineheight/4;

294 border-top: 1px solid #ccc;

295 margin-top: 4px;

296 margin-bottom: -5px;

297 background: #ea0;

298 font-size: 12px;

299 p {

300 margin: $lineheight/4;

301 }

302 }

303

304 /* Rules for the menu displayed in the left sidebar */

305

306 .left_menu {

307 left: 0px;

308 margin: 0;

309 padding: $lineheight/4 $lineheight/2 $lineheight/2 $lineheight/2;

310 font-size: 12px;

311 line-height: 1.25;

312 list-style-type: none;

313 border-bottom: 1px solid #ccc;

314 border-top: 1px solid #ccc;

315 img {

316 margin: $lineheight/2 0px;

317 }

318

319 ul {

320 padding: 0;

321 margin: 0;

322 }

323

324 li {

325 list-style-type: none;

326 padding: 0;

327 margin: 0;

328 }

329

330 h4 {

331 padding: $lineheight/4 0 $lineheight/4 0;

332 font-size: 12px;

333 margin: 0;

334 }

335 }

336

337 /*

338 * Rules for "optional boxes" which appear in the left sidebar on

339 * certain pages. Current users are the seach box on the main page

340 * and the tag cloud on the traces pages.

341 */

342

343 .optionalbox {

344 left: 0px;

345 padding: $lineheight/4 $lineheight/2;

346 margin: $lineheight/4 0;

347 text-align: left;

348 }

349

350 /* Rules for the search box */

351

352 #search_field {

353 position: relative;

354

355 form {

356 width: 165px;

357 }

358

359 input[type="text"] {

360 width: 165px;

361 padding: 3px;

362 font-size: $typeheight;

363 line-height: 1.1;

364 height: 25px;

365 padding: 2px 0px 2px $lineheight/4;

366 box-shadow: inset #DDD 0px 1px 3px;

367 }

368

369 input[type="text"]:focus {

370 outline: none;

371 border: 1px solid #000;

372 }

373

374 input[type="submit"] {

375 border: 0;

376 margin: 0;

377 padding: 0;

378 width: 15px;

379 height: 15px;

380 min-width: 0;

381 text-indent: -1000px;

382 overflow: hidden;

383 background: image-url("sprite.png") -2px -2px no-repeat;

384 position: absolute;

385 top: $lineheight/4;

386 right: $lineheight/4;

387 cursor: pointer;

388 }

389 }

390

391 .search_help {

392 margin: $lineheight/4 0 0 0;

393 }

394

395 /* Utility for de-emphasizing content */

396

397 .deemphasize {

398 color: #999;

399 a {

400 color: $blue;

401 }

402 }

403

404 /* Rules for donation request box */

405

406 a.donate {

407 display: block;

408 width: 163px;

409 padding: $lineheight/4;

410 border: 1px solid #AED1A0;

411 background: #cbeea7;

412 font-size: $typeheight;

413 line-height: 1.4;

414 text-align: center;

415 border-radius: 2px;

416 color: #222;

417 margin: $lineheight/2 $lineheight/2 0px $lineheight/2;

418

419 &:hover {

420 background: #9ed485;

421 text-decoration: none;

422 }

423 }

424

425 /* Rules for Creative Commons logo button */

426

427 #cclogo {

428 margin: $lineheight/2 0;

429 float: right;

430 }

431

432 /* Rules for tabbed navigation bar */

433

434 #top-bar {

435 position: relative;

436 margin-left: 185px;

437 height: 30px;

438 border-bottom: 1px solid #ccc;

439 background: white;

440 z-index: 100;

441 }

442

443 .site-edit #top-bar,

444 .site-index #top-bar,

445 .site-export #top-bar {

446 position: fixed;

447 left: 0;

448 right: 0;

449 }

450

451 #tabnav {

452 height: 29px;

453 margin-bottom:0;

454 overflow: hidden;

455 li {

456 display: inline;

457 }

458 a, a:link, a:visited {

459 float: left;

460 font-weight: bold;

461 padding: 3px $lineheight/2;

462 text-decoration: none;

463 color: #333;

464 float: left;

465 margin-right: 1px;

466 -webkit-transition: color 200ms ease-in;

467 -moz-transition: color 200ms ease-in;

468 -o-transition: color 200ms ease-in;

469 transition: color 200ms ease-in;

470 }

471 }

472

473 .site-index #tabnav a#viewanchor,

474 .site-edit #tabnav a#editanchor,

475 .changeset-list #tabnav a#historyanchor {

476 border-bottom: 1px solid #aaa;

477 background: #9ed485;

478 color: #000;

479 }

480

481 #tabnav a:link:hover, #tabnav a:visited:hover {

482 text-decoration: underline;

483 }

484

485 #tabnav a:link.disabled,

486 #tabnav a:visited.disabled,

487 #tabnav a:link:hover.disabled,

488 #tabnav a:visited:hover.disabled {

489 color: #ccc;

490 cursor: default;

491 &:hover {

492 text-decoration: none;

493 }

494 }

495

496 /* Utility for styling notification numbers */

497

498 .count-number {

499 padding: 2px $lineheight/4;

500 border-radius: 2px;

501 background: #d7d7ff;

502 margin: 0 2px;

503 font-size: 11px;

504 color: #333;

505 }

506

507 /* Rules for greeting bar in the top right corner */

508

509 #greeting {

510 float: right;

511 padding-top: 3px;

512 margin-right: $lineheight/4;

513 }

514

515 .greeting-bar-unread {

516 font-weight: bold;

517 }

518

519 /* Rules for the message shown in place of the map when javascript is disabled */

520

521 #noscript {

522 z-index: 20000000;

523 position: absolute;

524 top: 15px;

525 left: 15px;

526 }

527

528 /* Rules for bootstrap tooltips */

529

530 .tooltip {

531 position: absolute;

532 display: none;

533 color:#333;

534 text-align: left;

535 font-size: 12px;

536 }

537

538 .tooltip.in {

539 opacity: 0.8;

540 z-index: 1030;

541 height: auto;

542 display: block;

543 }

544

545 .tooltip.top {

546 margin-top: -20px;

547 text-align: center;

548 }

549

550 .tooltip.right {

551 margin-left: 20px;

552 }

553

554 .tooltip.bottom {

555 margin-top: 20px;

556 text-align: center;

557 }

558

559 .tooltip.left {

560 margin-left: -20px;

561 text-align: right;

562 }

563

564 .tooltip-inner {

565 display: inline-block;

566 padding: 10px;

567 font-weight: normal;

568 background-color: white;

569 }

570

571 .tooltip-arrow {

572 position: absolute;

573 width: 0;

574 height: 0;

575 border-color: transparent;

576 border-style: solid;

577 }

578

579 .tooltip.top .tooltip-arrow {

580 bottom: -5px;

581 left: 50%;

582 margin-left: -5px;

583 border-top-color: white;

584 border-width: 5px 5px 0;

585 }

586

587 .tooltip.right .tooltip-arrow {

588 top: 50%;

589 left: -5px;

590 margin-top: -5px;

591 border-right-color: white;

592 border-width: 5px 5px 5px 0;

593 }

594

595 .tooltip.left .tooltip-arrow {

596 top: 50%;

597 right: -5px;

598 margin-top: -5px;

599 border-left-color: white;

600 border-width: 5px 0 5px 5px;

601 }

602

603 .tooltip.bottom .tooltip-arrow {

604 top: -5px;

605 left: 50%;

606 margin-left: -5px;

607 border-bottom-color: white;

608 border-width: 0 5px 5px;

609 }

610

611 /* Rules for Leaflet maps */

612

613 .leaflet-control .control-button {

614 display: block;

615 height: 40px;

616 width: 40px;

617 background-color: #333;

618 background-color: rgba(0,0,0,.6);

619 -bottom: 1px solid #333;

620 border-radius: 4px 0 0 4px;

621 margin-bottom: 10px;

622 outline: none;

623

624 &:hover {

625 background-color: black;

626 }

627

628 &.active {

629 background-color: #9ed485;

630 }

631

632 &.disabled {

633 background-color: #333;

634 background-color: rgba(0,0,0,.5);

635 cursor: default;

636 }

637

638 .icon {

639 margin: 10px;

640 }

641 }

642

643 .leaflet-control .zoomin,

644 .control-layers .control-button {

645 margin-bottom: 0px;

646 border-radius: 4px 0 0 0;

647 }

648

649 .site .leaflet-control .zoomout,

650 .control-key .control-button {

651 margin-bottom: 0;

652 border-radius: 0;

653 }

654

655 .leaflet-control .zoomout, // For non-main page maps

656 .control-locate .control-button,

657 .control-share .control-button {

658 border-radius: 0 0 0 4px;

659 }

660

661 /* Rules for the home page */

662

663 .site-export #map,

664 .site-index #map,

665 .site-edit #map {

666 height: 100%;

667 overflow: hidden;

668 }

669

670 #map-ui {

671 display: none;

672 position: relative;

673 float: right;

674 width: 250px;

675 height: 100%;

676 background: white;

677 border-left: 1px solid #CCC;

678 overflow: auto;

679

680 .section {

681 border-bottom: 1px solid #DDD;

682 padding: 15px;

683 }

684

685 a.close-button {

686 float: right;

687 padding:5px;

688 font-size:20px;

689 line-height:10px;

690 color:#222;

691 border:1px solid #ddd;

692 }

693 }

694

695 .layers-ui,

696 .share-ui {

697 ul, li:last-child, p:last-child {

698 margin-bottom: 0;

699 }

700 }

701

702 .layers-ui {

703 li {

704 border-radius: 4px;

705 overflow: hidden;

706 margin-bottom: 10px;

707 }

708

709 label {

710 display: block;

711 padding: 5px 5px 5px 7px;

712 background-color: #eee;

713 cursor: pointer;

714 }

715

716 li.active label {

717 background-color: #ccc;

718 }

719

720 .base-layers {

721 .leaflet-container {

722 width: 100%;

723 height: 50px;

724 cursor: pointer;

725 }

726 }

727 }

728

729 .share-ui {

730 .share-tabs {

731 margin-bottom: 10px;

732

733 a {

734 color: #fff;

735 text-decoration: none;

736 background-color: $lightblue;

737 padding: 5px 10px;

738 }

739

740 a:first-child {

741 border-right: 1px solid #fff;

742 border-radius: 4px 0 0 4px;

743 }

744

745 a:last-child {

746 border-left: 1px solid #fff;

747 border-radius: 0 4px 4px 0;

748 }

749

750 a.active {

751 background-color: $blue;

752 }

753 }

754

755 .share-tab {

756 display: none;

757 }

758

759 .share-link {

760 input[type=text],

761 textarea {

762 width: 100%;

763 font-family: monospace;

764 font-size: small;

765 line-height: 1.3;

766 }

767 }

768

769 .share-image {

770 label {

771 margin-right: 10px;

772 }

773 }

774

775 #embed_html {

776 resize: vertical;

777 }

778

779 #mapnik_scale {

780 width: 100px;

781 }

782 }

783

784 .leaflet-top.leaflet-right {

785 top: $lineheight/2 !important;

786 .leaflet-control {

787 margin-right: 0px !important;

788 margin-top: 0px !important;

789 }

790 }

791

792 .leaflet-popup-scrolled {

793 padding-right: $lineheight;

794 border-bottom: 0px !important;

795 border-top: 0px !important;

796 }

797

798 .leaflet-popup-content-wrapper {

799 border-radius: 4px !important;

800 -webkit-border-radius: 4px !important;

801 }

802

803 /* Rules for edit menu */

804

805 .menuicon {

806 padding: 0 $lineheight/4;

807 font-weight: normal;

808 display: inline-block;

809 &:hover {

810 text-decoration: none !important;

811 }

812 }

813

814 .menu {

815 display: none;

816 z-index: 10000;

817 position: absolute;

818 background-color: #ffffff;

819 border: 1px solid $lightgrey;

820 border-top: 0px;

821 ul {

822 margin: 0px;

823 }

824 li {

825 padding: 2px $lineheight/4;

826 border-top: 1px solid #eee;

827 white-space: nowrap;

828 }

829 }

830

831 /* Rules for attribution text under the main map shown on printouts */

832

833 #attribution {

834 display: none;

835 }

836

837 .attribution_license,

838 .attribution_project {

839 text-align: left;

840 }

841

842 .attribution_notice {

843 text-align: center;

844 }

845

846 /* Rules for the popout map sidebar */

847

848 #sidebar {

849 display: none;

850 position: relative;

851 float: left;

852 border-right: 1px solid $lightgrey;

853 width: 33.3333%;

854 height: 100%;

855 ul {

856 margin-bottom: 0;

857 &:last-child {

858 border-bottom: 1px solid #ccc;

859 }

860 li {

861 margin-bottom: $lineheight/4;

862 &:last-child {

863 margin-bottom: 0;

864 }

865 }

866 }

867 }

868

869 .sidebar_heading {

870 position: relative;

871 padding: $lineheight/2 $lineheight;

872 z-index: 9999;

873 background: $offwhite;

874 border-bottom: 1px solid #ccc;

875 h4 {

876 margin: 0;

877 }

878 }

879

880 .sidebar_close {

881 position: absolute;

882 height: $lineheight;

883 top: 0px;

884 bottom: 0;

885 right: $lineheight;

886 margin: auto;

887 }

888

889 #sidebar_content {

890 position: relative;

891 margin-bottom: 20px;

892 overflow: auto;

893 height: 100%;

894 width: 100%;

895 h4 {

896 padding: 0 $lineheight $lineheight/2 $lineheight;

897 margin-top: $lineheight/2;

898 margin-bottom: 0;

899 border-bottom: 1px solid #ddd;

900 }

901 }

902

903 /* Rules for the map key which appears in the popout sidebar */

904

905 #mapkey {

906 .mapkey-table-key img {

907 display: block;

908 margin-left: auto;

909 margin-right: auto;

910 }

911 td {

912 padding: 0 $lineheight/4 $lineheight/4 $lineheight/4;

913 }

914 }

915

916 /* Rules for search results which appear in the popout sidebar */

917

918 .search_searching {

919 margin-top: $lineheight/4;

920 margin-bottom: $lineheight/4;

921 }

922

923 .search_results_entry {

924 margin-bottom: 0;

925

926 .search_details {

927 display: block;

928 text-align: right;

929 }

930 }

931

932 .search_results_entry .search_searching {

933 text-align: center;

934 margin: $lineheight auto;

935 width: $lineheight;

936 display: block;

937 }

938

939 ul.results-list li { border-bottom: 1px solid #ccc; }

940

941 .search_results_error {

942 color: #f00;

943 }

944

945 /* Rules for data browser information which appears in the popout sidebar */

946

947 #browse_content {

948 position: relative;

949 .browse_show_list.button {

950 position: absolute;

951 left: $lineheight;

952 right: $lineheight;

953 bottom: -40px;

954 margin-bottom: 0;

955 }

956 a.more-details {

957 position: absolute;

958 top: 0;

959 right: $lineheight;

960 }

961 ul li {

962 margin-bottom: 0;

963 }

964 }

965

966 .browse_details {

967 position: relative;

968 }

969

970 .browse_status {

971 display: none;

972 }

973

974 /* Rules for export information which appears in the popout sidebar */

975

976 .export_bounds {

977 text-align: center;

978 }

979

980 .export_area_inputs {

981 margin-bottom: $lineheight/2;

982 input[type="text"] {

983 width: 80px;

984 margin-bottom: 5px;

985 }

986 }

987

988 .export_bound {

989 margin: $lineheight/4;

990 }

991

992 /* Rules for the main content area */

993

994 #content {

995 padding: $lineheight;

996 position: relative;

997 }

998

999 .site-edit #content,

1000 .site-index #content,

1001 .site-export #content {

1002 position: fixed;

1003 padding: 0;

1004 top: 30px; bottom: 0;

1005 left: 184px; right: 0;

1006 border-left: 1px solid #ccc;

1007 }

1008

1009 .wrapper {

1010 margin-left: 184px;

1011 border-left: 1px solid #ccc;

1012 text-align: left;

1013 }

1014

1015 .site-edit #content {

1016 top: 30px;

1017 }

1018

1019 #content.maximised {

1020 top: 0;

1021 left: 0;

1022 right: 0;

1023 bottom: 0;

1024 border: 0;

1025 z-index: 1000;

1026 }

1027

1028 #slim_container {

1029 width: 100%;

1030 }

1031

1032 #slim_container_content {

1033 max-width: 50em;

1034 background-color: #FFFFFF;

1035 margin: $lineheight/2 auto;

1036 padding: 3px;

1037 border-radius: 25px;

1038 -moz-border-radius: 25px;

1039 border: 1px solid #e6e6e6;

1040 }

1041

1042 #slim_content {

1043 margin: $lineheight/2;

1044 margin-top: 95px;

1045 max-width: 50em;

1046

1047 .content-heading {

1048 margin-bottom: 15px;

1049 }

1050 }

1051

1052 #slim_header {

1053 margin: 30px $lineheight/2;

1054 position: absolute;

1055 top: 0px;

1056 margin-right: $lineheight/4;

1057 img {

1058 vertical-align: middle;

1059 margin-bottom: $lineheight/4;

1060 margin-right: $lineheight/4;

1061 }

1062 }

1063

1064 .content-heading {

1065 position: relative;

1066 padding: $lineheight;

1067 background: $offwhite;

1068 h1, h2 {

1069 margin-bottom: $lineheight/2;

1070 line-height: 100%;

1071 &:last-child {

1072 margin-bottom: 0;

1073 }

1074 }

1075 p {

1076 margin-top: $lineheight/2;

1077 margin-bottom: 0px;

1078 }

1079 }

1080

1081 /* Rules for small maps in content areas */

1082

1083 .content_map {

1084 position: relative;

1085 width: 45%;

1086 height: 400px;

1087 border: 1px solid #ccc;

1088 margin-bottom: $lineheight;

1089 float: right;

1090 }

1091

1092 .content_map #small_map {

1093 height: 100%;

1094 width: 100%;

1095 margin-bottom: $lineheight;

1096 }

1097

1098 /* Rules for the changeset list shown by the history tab etc */

1099

1100 #changeset_list {

1101 width: 100%;

1102 ul {

1103 padding: $lineheight/2 0;

1104 margin-bottom: 0px;

1105 border-top: 1px solid #ccc;

1106 &:last-child {

1107 border-bottom: 1px solid #ccc;

1108 }

1109 }

1110 .selected {

1111 background: #FFFFC0;

1112 }

1113 .date,

1114 .user {

1115 border-left: 1px solid #ccc;

1116 padding-left: $lineheight/4;

1117 margin-right: $lineheight/4;

1118 }

1119 }

1120

1121 #changeset_list_map_wrapper {

1122 position: absolute;

1123 width: 50%;

1124 height: 490px;

1125 top: 0;

1126 right: 0;

1127 }

1128

1129 #changeset_list_map_wrapper.scrolled {

1130 position: fixed;

1131 }

1132

1133 #changeset_list_map {

1134 position: absolute;

1135 bottom: $lineheight;

1136 top: $lineheight;

1137 right: $lineheight;

1138 left: $lineheight;

1139 border: 1px solid #ccc;

1140 }

1141

1142 #changeset_list_map_wrapper.scrolled #changeset_list_map {

1143 margin-left: 93px;

1144 }

1145

1146 /* Rules for the data browser */

1147

1148 .browse-section {

1149 border-top: 1px solid #ccc;

1150 margin-top: $lineheight/2;

1151 padding-top: $lineheight/2;

1152 &:first-child {

1153 margin-top: 0;

1154 }

1155 .warning {

1156 background-color: #ffe0cc;

1157 margin: 0px;

1158 padding: 4px 6px;

1159 max-width: 100%;

1160 }

1161 h4, p {

1162 margin-bottom: $lineheight/4;

1163 }

1164 ul, .bbox, .geo {

1165 display: inline-block;

1166 vertical-align: top;

1167 max-width: 65%;

1168 }

1169 ul p {

1170 margin-left: 0;

1171 margin-bottom: 0;

1172 }

1173 h4 {

1174 float: left;

1175 width: 33.3333%;

1176 display: inline-block;

1177 vertical-align: top;

1178 }

1179 }

1180

1181 .bbox {

1182 div {

1183 width: 33.3333%;

1184 text-align: center;

1185 padding: $lineheight/4 0;

1186 overflow: hidden;

1187 text-overflow: ellipsis;

1188 float: left;

1189 }

1190 .max_lat,

1191 .min_lat {

1192 margin-left: auto;

1193 margin-right: auto;

1194 width: 100%;

1195 }

1196 }

1197

1198 #browse_map .geolink {

1199 display: none;

1200 }

1201

1202 #browse_map .secondary-actions {

1203 margin-bottom: $lineheight/2;

1204 }

1205

1206 /* Rules for the trace list shown by the traces tab etc */

1207

1208 #trace_list {

1209 font-size: $lineheight/2;

1210 border-width: 0px;

1211 text-align: right;

1212

1213 .trace_summary {

1214 font-size: 12px;

1215 color: gray;

1216 }

1217

1218 .trace_pending {

1219 color: red;

1220 }

1221

1222 .trace_public {

1223 color: green;

1224 }

1225

1226 .trace_identifiable {

1227 color: green;

1228 }

1229

1230 .trace_trackable {

1231 color: red;

1232 }

1233

1234 .trace_private {

1235 color: red;

1236 }

1237 }

1238

1239 /* Rules for the user profile page */

1240

1241 #userinformation {

1242

1243 min-height: 100px;

1244 .userinformation-inner {

1245 float: left;

1246 }

1247 h2 {

1248 margin-top: 0;

1249 }

1250 .user-description {

1251 width: 100%;

1252 clear: both;

1253 }

1254 .deemphasize {

1255 margin: 0;

1256 }

1257 }

1258

1259 .admin-user-info small {

1260 margin-bottom: $lineheight/2;

1261 display: inline;

1262 margin-right: $lineheight;

1263 }

1264

1265 .activity-block {

1266 clear: left;

1267 border-bottom: 1px solid #ccc;

1268 padding-bottom: $lineheight;

1269 float: left;

1270 h3 {

1271 margin-bottom: $lineheight/2;

1272 }

1273 }

1274

1275 .contact-activity {

1276 margin-top: $lineheight;

1277 width: 100%;

1278 }

1279

1280 .activity-details p {

1281 margin-left: 70px;

1282 margin-bottom: 0;

1283 }

1284

1285 #friends-container .contact-activity ul {

1286 margin-left: 70px;

1287 }

1288

1289 .user-view {

1290 p#no_home_location {

1291 margin: $lineheight;

1292 }

1293 .user_thumbnail {

1294 margin-top: $lineheight/4;

1295 float: left;

1296 }

1297 }

1298

1299 /* Rules for the user map */

1300

1301 .content_map .leaflet-popup-content {

1302 margin: $lineheight/2;

1303 min-height: 50px;

1304 }

1305

1306 /* Rules for user popups on maps */

1307

1308 .user_popup {

1309 min-width: 200px;

1310 p {

1311 padding: 0 0 5px 0;

1312 margin-top: 0 0 0 60px;

1313 font-size: 12px;

1314 }

1315 img.user_thumbnail {

1316 float: left;

1317 margin: 0 $lineheight/2 0 0;

1318 }

1319 }

1320

1321 /* Rules for the user list */

1322

1323 #user_list {

1324 font-size: $lineheight/2;

1325 width: 100%;

1326

1327 tr {

1328 vertical-align: middle;

1329 }

1330

1331 p {

1332 margin-top: 0px;

1333 margin-bottom: 0px;

1334 }

1335 }

1336

1337 #user_list_actions {

1338 float: right;

1339 margin-top: $lineheight/2;

1340 }

1341

1342 /* Rules for the diary list page */

1343

1344 .diary_entry-list img.user_thumbnail {

1345 float: left;

1346 }

1347

1348 .diary_post {

1349 max-width: 740px;

1350 position: relative;

1351 margin-top: $lineheight/2;

1352 padding-top: $lineheight;

1353 border-top: 1px solid #ccc;

1354

1355 &:first-child {

1356 margin-top: 0;

1357 border-top: 0;

1358 padding-top: 0;

1359 }

1360 h1, h2 {

1361 font-size: 21px;

1362 line-height: 1em;

1363 }

1364 small.deemphasize {

1365 float: left;

1366 display: block;

1367 }

1368 ul.secondary-actions { display: inline-block;}

1369 }

1370

1371 .content-heading .hide_unless_logged_in { // hacky selector, better to just add a new class to this div

1372 display: inline;

1373 }

1374

1375 #content .post_heading {

1376 margin-bottom: $lineheight;

1377 h2 {

1378 margin-top: 0;

1379 margin-bottom: $lineheight/2;

1380 font-size: 24px;

1381 }

1382 }

1383

1384 /* Rules for the diary entry page */

1385

1386 .diary_entry {

1387 #map {

1388 position: relative;

1389 width: 90%;

1390 height: 400px;

1391 border: 1px solid #ccc;

1392 display: none;

1393 margin-bottom: $lineheight;

1394 }

1395 #newcomment {

1396 border-top: 1px solid #ccc;

1397 padding-top: $lineheight;

1398 margin-top: $lineheight/2;

1399 }

1400 .comments {

1401 max-width: 740px;

1402 }

1403 .diary-comment {

1404 margin-top: $lineheight/2;

1405 border-top: 1px dashed #ccc;

1406 padding-top: $lineheight/2;

1407 &:first-child {

1408 margin-top: $lineheight;

1409 padding-top: $lineheight;

1410 border-top: 1px solid #ccc;

1411 }

1412 p {

1413 margin-bottom: $lineheight/2;

1414 }

1415 .comment-heading {

1416 margin-bottom: 0;

1417 margin-top: 0;

1418 }

1419 }

1420 }

1421

1422 .diary_entry-view img.user_thumbnail {

1423 float: left;

1424 }

1425

1426 /* Rules for the login page */

1427

1428 #login_openid_buttons {

1429 margin-bottom: 0;

1430 }

1431

1432 #login_openid_buttons li {

1433 float: left;

1434 padding: $lineheight/4 $lineheight/2;

1435 }

1436

1437 /* Rules for the account confirmation page */

1438

1439 #terms {

1440 .legale {

1441 border: 1px solid #ccc;

1442 padding: $lineheight;

1443 margin-bottom: $lineheight;

1444 overflow: auto;

1445 height: 10em;

1446

1447 &:p#last {

1448 margin-bottom: 0px;

1449 }

1450

1451 &:ol {

1452 margin-bottom: 0px;

1453 }

1454

1455 &:img {

1456 display: block;

1457 margin: $lineheight auto inherit auto;

1458 }

1459 }

1460

1461 form.sign {

1462 input[type=submit] {

1463 float: left;

1464 }

1465 #decline {

1466 background: $grey;

1467 &:hover {

1468 background: darken($grey, $hovercolor);

1469 }

1470 }

1471 }

1472 fieldset {

1473 margin-bottom: $lineheight;

1474 }

1475 #contributorGuidance {

1476 background-color: $offwhite;

1477 border-radius: 4px;

1478 -moz-border-radius: 4px;

1479 }

1480 .signing-buttons {

1481 height: 50px;

1482 }

1483 }

1484

1485 /* Rules for the account settings page */

1486

1487 #accountForm .user_map {

1488 position: relative;

1489 width: 500px;

1490 height: 400px;

1491 border: 1px solid #ccc;

1492 }

1493

1494 #accountForm .user_image {

1495 margin-bottom: 0;

1496 }

1497

1498 #accountForm #user_image {

1499 margin-left: 20px;

1500 }

1501

1502 #accountForm ul.accountImage-options {

1503 margin-left: 120px;

1504 }

1505

1506 .nohome .location {

1507 display: none;

1508 }

1509

1510 #homerow .message {

1511 display: none;

1512 }

1513

1514 .nohome .message {

1515 display: inline !important;

1516 }

1517

1518 .content_map.settings_map {

1519 width: 50%;

1520 float: none;

1521 }

1522

1523 /* Rules for the oauth settings page */

1524

1525 .oauth_clients .buttons .oauth-edit {

1526 border-radius: 2px 0 0 2px;

1527 }

1528

1529 .oauth_clients .buttons .oauth-delete {

1530 border-radius: 0 2px 2px 0;

1531 }

1532

1533 /* Rules for messages pages */

1534

1535 .messages {

1536 width: 100%;

1537 border: 1px solid #ddd;

1538

1539 input[type="submit"] {

1540 margin: auto;

1541 }

1542 tbody tr {

1543 border-top: 1px solid #ccc;

1544 }

1545

1546 .inbox-row {

1547 background: #f8f8ff;

1548 }

1549

1550 .inbox-row-unread {

1551 background:#CBEEA7;

1552 }

1553

1554 .right {

1555 float: right;

1556 }

1557

1558 tr td,

1559 tr th {

1560 padding: $lineheight/4;

1561 }

1562 p:last-child,

1563 h2:last-child,

1564 h3:last-child,

1565 ol:last-child,

1566 ul:last-child {

1567 margin-bottom:0;

1568 }

1569 tr td {

1570 height: 30px;

1571 border-right: 1px solid $lightgrey;

1572 }

1573 }

1574

1575 .inbox-row .inbox-mark-read {

1576 display: none;

1577 }

1578

1579 .info-line {

1580 margin-bottom: $lineheight;

1581 padding: $lineheight/4 0px 4px 0px;

1582 border-bottom: 1px solid #ccc;

1583

1584 form, form div {

1585 display: inline;

1586 }

1587 }

1588

1589 .info-line .user_thumbnail_tiny {

1590 vertical-align: middle;

1591 }

1592

1593 .inbox-mark-unread,

1594 .inbox-mark-read,

1595 .inbox-delete {

1596 width: 1%;

1597 }

1598

1599 .inbox-row-unread .inbox-mark-unread {

1600 display: none;

1601 }

1602

1603 .message-read .message-buttons {

1604 margin-top: $lineheight;

1605 padding-top: $lineheight;

1606 border-top: 1px solid $lightgrey;

1607 }

1608

1609 .message-read .buttons .mark-unread-button {

1610 border-radius: 0;

1611 }

1612

1613 /* Rules for "flash" notice boxes shown at the top of the content area */

1614

1615 .flash {

1616 padding: $lineheight;

1617 &#error {

1618 background-color: #ff7070;

1619 }

1620 &#warning {

1621 background-color: #ffe0cc;

1622 }

1623 &#notice {

1624 background-color: #CBEEA7;

1625 }

1626 }

1627

1628 /* Rules for highlighting fields with rails validation errors */

1629

1630 .field_with_errors {

1631 padding: 2px;

1632 background-color: #ff7070;

1633 display: table;

1634 }

1635

1636 /* Rules for rails validation error boxes */

1637

1638 #errorExplanation {

1639 width: 400px;

1640 border: 2px solid #ff7070;

1641 padding: 0 $lineheight/2;

1642 margin-bottom: $lineheight;

1643 background-color: #f0f0f0;

1644

1645 h2 {

1646 margin: 0 -10px 10px -10px;

1647 padding: $lineheight/4 $lineheight/4 $lineheight/4 15px;

1648 font-weight: bold;

1649 font-size: 12px;

1650 background-color: #c00;

1651 color: #fff;

1652 text-align: left;

1653 }

1654

1655 p {

1656 color: #333;

1657 margin-bottom: 0px;

1658 padding: $lineheight/4;

1659 }

1660

1661 ul {

1662 padding-left: $lineheight;

1663

1664 li {

1665 font-size: 12px;

1666 list-style: disc;

1667 }

1668 }

1669 }

1670

1671 /* Rules for forms */

1672

1673 .standard-form {

1674 fieldset {

1675 margin-bottom: $lineheight;

1676 }

1677 label.standard-label {

1678 display: block;

1679 margin-bottom: $lineheight/4;

1680 font-size: $typeheight;

1681 font-weight: bold;

1682 line-height: 1.5;

1683 }

1684 label.standard-label.secondary {

1685 display: inline-block;

1686 font-weight: normal;

1687 }

1688 .form-help {

1689 font-weight: normal;

1690 }

1691 .form-column {

1692 float: left;

1693 margin-right: 20px;

1694 }

1695 .form-divider {

1696 margin-top: $lineheight;

1697 padding-top: $lineheight;

1698 border-top: 1px solid $lightgrey;

1699 }

1700 .form-row {

1701 margin-bottom: $lineheight/2;

1702 }

1703 .form-list {

1704 margin-bottom: 0;

1705 }

1706 .form-list li {

1707 margin-bottom: 5px;

1708 }

1709 input[type="checkbox"],

1710 input[type="radio"] {

1711 float: left;

1712 margin-top: 5px;

1713 }

1714 }

1715

1716 #remember_me_openid {

1717 display: block;

1718 }

1719

1720 input[type="checkbox"],

1721 input[type="radio"] {

1722 margin-right: 5px;

1723 }

1724

1725 input[type="text"],

1726 input[type="email"],

1727 input[type="url"],

1728 input[type="password"],

1729 textarea {

1730 border: 1px solid #ccc;

1731 padding: 2px 5px;

1732 margin: 0;

1733 width: 200px;

1734 }

1735

1736 textarea {

1737 padding: 5px;

1738 width: 100%;

1739 }

1740

1741 /* Rules for user images */

1742

1743 img.user_image {

1744 max-width: 100px;

1745 max-height: 100px;

1746 border: 1px solid #ccc;

1747 margin-bottom: $lineheight;

1748 float: left;

1749 margin-right: $lineheight;

1750 }

1751

1752 img.user_thumbnail {

1753 max-width: 50px;

1754 max-height: 50px;

1755 border: 1px solid #ccc;

1756 margin-right: $lineheight;

1757 }

1758

1759 img.user_thumbnail_tiny {

1760 max-width: 25px;

1761 max-height: 25px;

1762 border: 1px solid #ccc;

1763 }

1764

1765 /* Rule for "nowrap" class that can be applied to anything to stop wrapping */

1766

1767 .nowrap {

1768 white-space: nowrap;

1769 }

1770

1771 /* Rules for geo microformats */

1772

1773 abbr.geo {

1774 border-bottom: none;

1775 }

1776

1777 /* Rules for RSS buttons */

1778

1779 .rsssmall {

1780 position: relative;

1781 top: 5px;

1782 }

1783

1784 /* General styles for action lists / subnavs / pager navs */

1785

1786 ul.secondary-actions {

1787 font-style: normal;

1788 margin-bottom: 0;

1789 margin-left: 0;

1790 &.pager {

1791 display: inline-block;

1792 margin-right: 60px;

1793 }

1794 li {

1795 display: block;

1796 float: left;

1797 list-style: none;

1798 border-left: 1px solid #ccc;

1799 padding-left: $lineheight/4;

1800 margin-right: $lineheight/4;

1801 &:first-child {

1802 border-left: 0;

1803 padding-left: 0;

1804 }

1805 &:last-child {

1806 margin-right: 0px;

1807 }

1808 }

1809 }

1810

1811 /* Utility for managing inner content areas */

1812

1813 .inner22 { padding: $lineheight;}

1814

1815 .inner12 { padding: $lineheight/2 $lineheight;}

1816

1817 .inner11 { padding: $lineheight/2;}

1818

1819 .inner02 { padding: 0 $lineheight;}

1820

1821 /* Utility for general button styles */

1822

1823 input[type="button"],

1824 input[type="submit"],

1825 input[type="reset"],

1826 a.button {

1827 cursor: pointer;

1828 border: 0;

1829 display: inline-block;

1830 line-height: 20px;

1831 padding: $lineheight/4 $lineheight/2;

1832 min-height: 20px + $lineheight/2;

1833 min-width: 120px;

1834 margin: 0 0 $lineheight/2 0;

1835 color: white;

1836 background: $blue;

1837 text-align: center;

1838 border-radius: 2px;

1839 -moz-border-radius: 2px;

1840 &:hover {

1841 background: darken($blue, $hovercolor);

1842 text-decoration: none;

1843 }

1844 &.deemphasize {

1845 background: $lightblue;

1846 &:hover {

1847 background: darken($lightblue, $hovercolor);

1848 }

1849 }

1850 &:disabled {

1851 background: $lightgrey;

1852 &:hover {

1853 background: $lightgrey;

1854 }

1855 }

1856 &:last-child {

1857 margin-bottom: 0;

1858 }

1859 }

1860

1861 .buttons {

1862 min-width: 200px;

1863 input[type="submit"],

1864 input[type="button"],

1865 input[type="reset"],

1866 .button {

1867 box-sizing: border-box;

1868 float: left;

1869 border-radius: 0;

1870 margin:0;

1871 min-width: 100px;

1872 max-width: 180px;

1873 border-right:1px solid white;

1874 text-overflow: ellipsis;

1875 white-space: nowrap;

1876 overflow: hidden;

1877 }

1878 input:first-child,

1879 .button:first-child {

1880 border-radius:2px 0 0 2px;

1881 }

1882 input:last-child,

1883 .button:last-child {

1884 border-radius:0 2px 2px 0;

1885 border-right-width: 0;

1886 }

1887 input:only-child,

1888 .button:only-child,

1889 *[value="Hide"] + input:last-child,

1890 *[value="Hide"] + .button:last-child {

1891 border-radius:2px;

1892 border-right-width: 0;

1893 }

1894 /* if a 3-button set has a hidden middle button */

1895 *[value="Hide"] + input:nth-child(3),

1896 *[value="Hide"] + .button:nth-child(3) {

1897 border-radius:0 2px 2px 0;

1898 border-right-width: 0;

1899 }

1900 /* if a 3-button set starts with a hidden button */

1901 *[value="Hide"] + input:nth-child(2):not(:last-child),

1902 *[value="Hide"] + .button:nth-child(2):not(:last-child) {

1903 border-radius:2px 0 0 2px;

1904 border-right-width: 1px solid white;

1905 }

1906 }

1907

1908 /* Rules for doing distinct colour of alternate table rows */

1909

1910 .table0,

1911 .item0 {

1912 background: $offwhite;

1913 }

1914

1915 .table1,

1916 .item1 {

1917 background: #fff;

1918 }

1919

1920 /* Rules for OpenID logo */

1921

1922 .openid_logo {

1923 vertical-align: text-bottom;

1924 border: 0;

1925 }

1926

1927 /* Rules for rich text */

1928

1929 .richtext,

1930 .prose {

1931 h1, h2 {

1932 padding-bottom: $lineheight/2;

1933 border-bottom: 1px dashed #cccccc;

1934 margin-bottom: $lineheight/2;

1935 }

1936

1937 h1 {

1938 font-size: 24px;

1939 }

1940

1941 h2 {

1942 font-size: 18px;

1943 }

1944

1945 h3 {

1946 font-size: $typeheight;

1947 }

1948

1949 code {

1950 font-size: 13px;

1951 background: #e8e8e8;

1952 padding: 2px 3px;

1953 }

1954

1955 pre {

1956 font-size: 13px;

1957 background: #e8e8e8;

1958 padding: 2px 3px;

1959

1960 code {

1961 padding: 0;

1962 }

1963 }

1964

1965 img {

1966 padding: $lineheight;

1967 background-color: $offwhite;

1968 display: block;

1969 max-width: 100%;

1970 margin: auto;

1971 }

1972

1973 blockquote {

1974 border-left: $lineheight solid $offwhite;

1975 padding-left: $lineheight;

1976 margin: 0;

1977 color: #7E7E7E;

1978 }

1979

1980 ul, ol {

1981 padding-left: $lineheight;

1982 margin-bottom: $lineheight;

1983 margin-left: $lineheight;

1984 }

1985

1986 ul li {

1987 list-style: disc;

1988 }

1989

1990 ol li {

1991 list-style: decimal;

1992 }

1993 }

1994

1995 .diary_post .richtext {

1996 margin-top: $lineheight;

1997 }

1998

1999 .comments .richtext {

2000 margin-left: 70px;

2001 margin-top: 0;

2002 }

2003

2004 /* Rules for rich text editors */

2005

2006 .richtext_container {

2007 margin-bottom: $lineheight;

2008

2009 .richtext_content {

2010 width: 50%;

2011 display: inline-block;

2012 vertical-align: top;

2013

2014 .richtext_preview {

2015 display: inline-block;

2016 padding: $lineheight;

2017 background-color: $offwhite;

2018 overflow-x: auto;

2019

2020 &.loading {

2021 background-image: image-url("loading.gif");

2022 background-repeat: no-repeat;

2023 background-position: center;

2024 }

2025

2026 > :first-child {

2027 margin-top: 0px;

2028 }

2029 }

2030 }

2031

2032 .richtext_help {

2033 display: inline-block;

2034 vertical-align: top;

2035 margin-left: 15px;

2036 background-color: #f8f8ff;

2037 padding: $lineheight/2;

2038 width: 220px;

2039

2040 ul {

2041 margin-bottom: 0;

2042 }

2043

2044 h4.heading, li {

2045 border-bottom: 1px solid #ccc;

2046 margin-bottom: $lineheight/4;

2047 padding-bottom: $lineheight/4;

2048 }

2049

2050 li h4, li span, li p {

2051 display: inline-block;

2052 vertical-align: top;

2053 font-size: 11px;

2054 }

2055

2056 li h4 {

2057 width: 40%;

2058 margin: 0;

2059 }

2060

2061 li span, li p {

2062 width: 50%;

2063 margin-left: $lineheight/2;

2064 margin-bottom: $lineheight/4;

2065 white-space: nowrap;

2066 }

2067 }

2068 }

2069

2070 /* Rules for the user notes list */

2071

2072 .note_list {

2073 tr.creator {

2074 background-color: #eeeeee;

2075 }

2076

2077 td {

2078 padding: 3px;

2079 }

2080

2081 p {

2082 margin-bottom: 0px;

2083 }

2084 }

2085

2086 /* Rules for the notes interface */

2087

2088 .leaflet-popup-content .note {

2089 padding-top: $lineheight/2;

2090 }

2091

2092 .leaflet-popup-content .note {

2093 h2 {

2094 margin-bottom: $lineheight/2;

2095 }

2096

2097 div {

2098 margin-top: $lineheight/2;

2099 }

2100

2101 .permalink {

2102 position: absolute;

2103 top: $lineheight/4;

2104 left: $lineheight/4;

2105 min-width: 15px;

2106 min-height: 15px;

2107 }

2108

2109 .permalink span {

2110 display: none;

2111 padding-left: $lineheight;

2112 }

2113

2114 .permalink:hover span {

2115 display: block;

2116 }

2117

2118 .warning {

2119 display: block;

2120 background-color: #ffe0cc;

2121 padding: 4px 6px;

2122 margin-bottom: $lineheight/2;

2123 }

2124

2125 .comment_body {

2126 margin-top: 2px;

2127 margin-bottom: 2px;

2128

2129 p {

2130 margin-top: 0px;

2131 margin-bottom: 0px;

2132 }

2133 }

2134

2135 .comment {

2136 width: 100%;

2137 height: 100px;

2138 }

2139

2140 .buttons {

2141 margin-top: $lineheight/4;

2142 text-align: right;

2143 }

2144 }

2145

2146 /*

2147 * Rules for the iD editor

2148 */

2149 .id-embed {

2150 width: 100%;

2151 height: 100%;

2152 }

2153

2154 /* Rules for rotating sidebar ads */

2155 .ad-container {

2156 display: block;

2157 height: 120px;

2158 overflow: hidden;

2159 position: relative;

2160 border-bottom: 1px solid #ccc;

2161 }

2162

2163 .ad {

2164 height: 100px;

2165 border: 0;

2166 background: #fff;

2167 }