ef5c1bc · urbit.org · git.iko.soy

git.iko.soy/urbit.org

on master help sign in

Resolving conflict from bbfb59ab

ef5c1bcMatilde Park7 years ago

sass/_main.scss+22−637

compare with master

unifiedsplit

@@ -1,646 +1,31 @@

1−/*

2− * core

3− */

4−@import "indigo.scss";

1+@import "indigo";

5−body {

6− font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

7− font-size: (3.5rem / 4);

8− line-height: (6rem / 4);

9− color: #000000;

10−}

11−

12−a {

13− color: #000;

14−}

15−

16−p img {

17− margin: (4rem / 4) 0;

18− width: 100%;

19−}

20−

21−iframe {

22− max-width: 100%;

23−}

24−

25−/*

26− * lay-out

27− */

28−

29−.main-wrapper {

30− margin-top: (24rem / 4);

31−}

32−

33−.wrapper {

34− position: relative;

35− margin: 0 auto;

36− padding: 0 (4rem / 4);

37− max-width: 960px;

38−}

39−

40−.container {

41− display: flex;

42− padding-bottom: (32rem / 4);

43−}

44−

45−.pop-up {

46− width: 100%;

47− max-width: 600px;

48− margin: (28rem / 4) auto;

49− background: #fff;

50−}

51−

52−.container--fixed {

53− position: fixed;

54− margin-top: -(24rem / 4);

55−}

56−

57−// Hack to left-align top-bar text with content

58−.top-bar-inner {

59− max-width: 960px;

60− margin: 0 auto;

61− p {

62− margin-left: (100% / 6);

63− }

64−}

65−

66−.content-nav {

67− width: 20%;

68− min-width: 200px;

69− padding-right: (1rem / 4);

70− margin-top: (24rem / 4);

71− &__item {

72− line-height: (8rem / 4);

73− margin-bottom: (1rem / 4);

74− }

75− li {

76− font-size: inherit;

77− line-height: inherit;

78− }

79−}

80−

81−.content-nav-icon {

82− position: fixed;

83− top: (24rem / 4);

84− width: 10px;

85− height: 10px;

86− cursor: pointer;

87− &:before {

88− content: '';

89− position: absolute;

90− height: 0;

91− border-top: 10px solid transparent;

92− border-bottom: 10px solid transparent;

93− border-right: 10px solid #000;

94− }

95−}

96−

97−.container--overflowed {

98− height: 100%;

99− z-index: 0;

100− .content-nav {

101− &__search-bar {

102− width: 100%;

103− padding-left: 0rem;

104− }

105− &__index {

106− height: calc(100% - 48px);

107− overflow-y: scroll;

108− &__item {

109− &:last-child{

110− padding-bottom: 8rem;

111− }

112− }

113− }

114− .list:first-child {

115− padding-bottom: (14rem / 4);

116− }

117− .list li:last-child .subsub-list li:last-child {

118− padding-bottom: 0;

119− }

120− }

121−}

122−

123−.content-nav-spacer {

124− width: 20%;

125− min-width: 200px;

126− padding-right: (5rem / 4);

127− &__item {

128− line-height: (8rem / 4);

129− margin-bottom: (1rem / 4);

130− }

131−}

132−

133−.content, .content-spacer {

134− flex-basis: 66.66666667%;

135− max-width: 66.66666667%;

136−}

137−

138−.content {

139− position: relative;

140− z-index: 3;

141− margin-top: -(16rem / 4);

142−}

143−

144−.content-nav-icon {

145− display: none;

146−}

147−

148−.no-side-nav-column, .nav-column {

149− flex-basis: 33.33333333%;

150− max-width: 33.33333333%;

151− margin-left: 16.66666667%;

152−}

153−

154−.list, .sub-list {

155− list-style: none;

156− margin: 0;

157−}

158−

159−.sub-list {

160− padding-left: (4rem / 4);

161− .sub-list {

162− padding-left: 0;

163− }

164− .subsub-list {

165− padding-left: (4rem / 4);

166− }

167−}

168−

169−.list {

170− padding: 0;

171− &__item {

172− padding: 0;

173− }

174−}

175−

176−.list--horizontal {

177− display: flex;

178− justify-content: flex-start;

179− .list__item {

180− margin-right: (4rem / 4);

181− }

182−}

183−

184−.body-regular {

185− margin-bottom: (7rem / 4);

186−}

187−

188−.video-wrapper {

189− position: relative;

190− padding-bottom: 56.25%;

191− height: 0;

192−}

193−

194−.video-wrapper iframe {

195− position: absolute;

196− top: 0;

197− left: 0;

198− width: 100%;

199− height: 100%;

200− border: none;

201−}

202−

203−/*

204− * components

205− */

206−

207−.header {

208− position: fixed;

209− height: (24rem / 4);

210− width: 100%;

211− z-index: 2;

212− top: 0;

213− -webkit-touch-callout: none; /* iOS Safari */

214− -webkit-user-select: none; /* Safari */

215− -khtml-user-select: none; /* Konqueror HTML */

216− -moz-user-select: none; /* Firefox */

217− -ms-user-select: none; /* Internet Explorer/Edge */

218− user-select: none; /* Non-prefixed version, currently

219− supported by Chrome and Opera */

220− &__navigation {

221− display: none;

222− }

223− &__nav-icon {

224− position: absolute;

225− margin-left: (4rem / 4);

226− width: (6rem / 4);

227− height: (10rem / 4);

228− left: 0;

229− top: (6rem / 4);

230− z-index: 3;

231− cursor: pointer;

232− &:before, &:after {

233− content: '';

234− position: absolute;

235− width: 100%;

236− height: (1rem / 4);

237− background: #000;

238− margin-bottom: (4rem / 4);

239− top: 50%;

240− left: 0;

241− transform-origin: 50%;

242− transition: all 0.1s linear;

243− }

244− &:before {

245− transform: translate(0, -7px);

246− }

247− &:after {

248− transform: translate(0, 7px);

249− }

250− }

251− &__search-icon {

252− -webkit-transform: rotate(-45deg);

253− vertical-align: bottom;

254− }

255−}

256−

257−.has-active-main-nav {

258− overflow: hidden;

259− .header {

260− z-index: 4;

261− background: #000;

262− height: 100%;

263− &__navigation {

264− position: fixed;

265− height: 100%;

266− width: 100%;

267− overflow-y: scroll;

268− display: block;

269− }

270− &__nav-icon {

271− &:before, &:after {

272− bottom: 0;

273− background: #fff;

274− }

275− &:before {

276− transform: rotate(45deg);

277− }

278− &:after {

279− transform: rotate(-45deg);

280− }

281− }

282− a, h2, .h2, h4, .h4 {

283− color: #fff;

284− }

285− }

286−}

287−

288−.posts {

289− &__content {

290− z-index: 3;

291− margin-left: -(8rem / 4);

292− }

293−}

294−

295−.footer {

296− width: 100%;

297−}

298−

299−.form {

300− width: 100%;

301− max-width: 320px;

302−}

303−

304−.padding-none {

305− padding: 0 !important;

306−}

307−

308−.border-none {

309− border: none !important;

310−}

311−

312−.b-transparent {

313− background: rgba(0,0,0,0.4);

314−}

315−

316−.top0 {

317− top: 0;

318−}

319−

320−.float-right {

321− float: right;

322−}

323−

324−.search-overlay {

325− .search-bar {

326− &__input {

327− padding-left: 40px;

328− }

329− }

330−}

331−

332−.search-results {

333− max-height: 400px;

334− &__item a:hover {

335− background: #F9F9F9;

336− span {

337− display:inline-block;

338− }

339− }

340−}

341−

342−.has-active-search-window {

343− .search-overlay {

344− display: block;

345− }

346−}

347−

348−#search-reset {

349− cursor: pointer;

350− user-select: none;

351−}

352−

353−.form--big {

354− max-width: 390px;

355− .btn {

356− width: 100%;

357− }

358−}

359−

360−.hoonschool-application {

361− &__experience {

362− resize: vertical;

363− }

364−}

365−

366−.tippy-tooltip {

367− border-radius: 0px;

368−}

369−

370−/*

371− * styling

372− */

373−

374−// remove default x icon

375− input[type="search"]::-webkit-search-decoration,

376− input[type="search"]::-webkit-search-cancel-button,

377− input[type="search"]::-webkit-search-results-button,

378− input[type="search"]::-webkit-search-results-decoration {

379− display: none;

380−}

381−

382−input[type="search"] {

383− border: 1px solid #B1B2B3;

384− font-size: (4rem / 4);

385− line-height: (6rem / 4);

386− transition: all 0.1s linear;

387− padding-right: 40px;

388− position: relative;

389− border-radius: 0 !important;

390−}

391−

392−textarea, input[type="text"], input[type="email"], input[type="number"], input[type="search"], select {

393− border: 1px solid #000;

394− padding: 12px;

395− width: 100%;

396− outline: none;

397− box-sizing: border-box;

398− &:active, &:focus {

399− border: 1px solid #000000;

400− }

401− &:required, &:invalid {

402− box-shadow: none !important;

403− border: 1px solid #EE892B;

404− color: #EE892B;

405− }

406−}

407−

408−textarea {

409− resize: horizontal;

410−}

411−

412−button, .btn {

413− font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

414− font-weight: 500;

415− font-size: (4rem / 4);

416− line-height: (4rem / 4);

417− user-select: none;

418− padding: (3rem /4) (6rem / 4);

419− margin: 0 0 6px;

420− border: none;

421− cursor: pointer;

422−}

423−

424−.search-bar {

425− border: 1px solid #B1B2B3;

426− background: #fff;

427− font-size: (4rem / 4);

428− transition: all 0.1s linear;

429− padding: 12px 12px 12px 40px;

430− position: relative;

431− font-weight: normal;

432− text-align: left;

433− box-shadow: none !important;

434− color: #B1B2B3;

435−}

436−

437−.has-valid-input {

438− position: relative;

439− &:after {

440− content: '✓';

441− color: #2AA779;

442− position: absolute;

443− right: 10px;

444− top: 50%;

445− transform: translate(0,-50%);

446− width: 15px;

447− height: 24px;

448− margin-top: -4px;

449− }

450− input[type="text"], input[type="email"], input[type="number"] {

451− border: 1px solid #2AA779;

452− }

453−}

454−

455−

456−/*

457− * typography

458− */

459−

460@import url('https://rsms.me/inter/inter-ui.css');

2@import url('https://rsms.me/inter/inter-ui.css');

461

462−@font-face {

4+body {

463− font-family: "Source Code Pro";

5+ @extend .sans, .f4, .grid12;

464− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-extralight.woff");

465− font-weight: 200;

466−}

467−

468−@font-face {

469− font-family: "Source Code Pro";

470− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-light.woff");

471− font-weight: 300;

472−}

473−

474−@font-face {

475− font-family: "Source Code Pro";

476− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-regular.woff");

477− font-weight: 400;

478−}

479−

480−@font-face {

481− font-family: "Source Code Pro";

482− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-medium.woff");

483− font-weight: 500;

484−}

485−

486−@font-face {

487− font-family: "Source Code Pro";

488− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-bold.woff");

489− font-weight: 600;

490−}

491−

492−@font-face {

493− font-family: "Source Code Pro";

494− src: url("https://storage.googleapis.com/media.urbit.org/fonts/scp-black.woff");

495− font-weight: 700;

496−}

497−

498−.lowercase {

499− text-transform: lowercase;

500−}

501−

502−h1, h2, h3, h4, h5, h6, .text-heading {

503− margin: 0;

504− font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

505−}

506−

507−h1, h2, h3, h4 {

508− font-weight: 700;

509−}

510−h1 {

511− font-size: (8rem / 4);

512− line-height: (8rem / 4);

513−}

514−h2 {

515− font-size: (6rem / 4);

516− line-height: (6rem / 4);

517−}

518−h3 {

519− font-size: (5rem / 4);

520− line-height: (5rem / 4);

521−}

522−h4 {

523− font-size: (4.5rem / 4);

524− line-height: (4.5rem / 4);

525−}

526−h5 {

527− font-size: (4rem / 4);

528− line-height: (4rem / 4);

529−}

530−

531−.article {

532− h1 {

533− margin-bottom: (7rem / 4);

534− }

535− h2 {

536− margin-top: (8rem / 4);

537− margin-bottom: (4rem / 4);

538− }

539− h3 {

540− margin-top: (7rem / 4);

541− margin-bottom: (3rem / 4);

542− }

543− h4 {

544− margin-top: (6.5rem / 4);

545− margin-bottom: (2.5rem / 4);

546− }

547− h5 {

548− margin-top: (6rem / 4);

549− margin-bottom: (2rem / 4);

550− }

551−}

552−

553−li {

554− font-size: (4rem / 4);

555− line-height: (8rem / 4);

556− font-weight: 400;

557−}

558−

559−p, .p {

560− font-size: (4rem / 4);

561− font-weight: 400;

562− line-height: (8rem / 4);

563− margin: 0 0 (4rem / 4);

6+ margin: 0 32px;

564−}

565−

566−pre, code {

567− font-family: "Source Code Pro", monospace;

568− background-color: #eee !important;

569− color: #000 !important;

570− overflow-y: scroll;

571− font-weight: 400;

572− span {

573− color: #000 !important;

7+ color: #000;

574− }

575− padding: (1rem / 4);

576− font-size: (4rem / 4);

577−}

578−

579−textarea, input[type="text"], input[type="email"], input[type="number"], select {

580− border: 1px solid #B1B2B3;

581− font-family: "Source Code Pro", mono;

582− font-size: (4rem / 4);

583− line-height: (6rem / 4);

584− transition: all 0.1s linear;

585− padding-right: 40px;

586− position: relative;

587− &:active, &:focus {

588− border: 1px solid #000000;

589− }

590− &:required, &:invalid {

591− box-shadow: none !important;

592− border: 1px solid #EE892B;

593− color: #EE892B;

594− }

595−}

596−

597−.has-valid-input {

598− position: relative;

599− &:after {

600− content: '✓';

601− color: #2AA779;

602− position: absolute;

603− right: 10px;

604− top: 50%;

605− transform: translate(0,-50%);

606− width: 15px;

607− height: 24px;

608− margin-top: -4px;

609− }

610− input[type="text"], input[type="email"], input[type="number"] {

611− border: 1px solid #2AA779;

612− }

613−}

614−

615−#mc_embed_signup form {

616− padding: 0;

617− text-align: inherit;

618−}

619−

620−.no-liga {

621− font-feature-settings: 'liga' 0;

622}

623

624−// Markdown

10+nav {

625−summary {

11+ grid-area: auto / 1 / auto / 3;

626− font-size: (5rem / 4);

627− font-weight: 500;

628− padding-bottom: (2rem / 4);

629− padding-top: (2rem / 4);

630− cursor: pointer;

631− user-select: none;

632− -webkit-user-select: none;

633}

12}

634

635−summary:focus {

14+article {

636− outline: none;

15+ grid-area: auto / 4 / auto / 9;

16+ a {

17+ @extend .bb1, .b-black;

18+ }

637}

19}

638

639−details {

21+// components

640− padding-bottom: (1rem / 4);

22+ // flatten headers

641− padding-top: (1rem / 4);

23+h1, h2, h3, h4, h5 {

642− ul, ol {

24+ @extend .f4, .fw-bold;

643− padding-left: 0;

644− list-style: none;

645− }

646}

25}

26+ // ship styling

27+address {

28+ display: inline;

29+ font-style: normal;

30+ float: right;

31+}

sass/_responsive.scssdeleted−112

@@ -1,112 +0,0 @@

1−@media only screen and (max-width: 1080px) {

2− .header, .main-wrapper {

3− padding-left: 2%;

4− }

5−}

6−@media only screen and (max-width: 800px) {

7− .has-active-search-window .search-overlay, .search-bar {

8− display: none;

9− }

10− .container--fixed, .content-nav {

11− margin: 0;

12− }

13− .content-nav-spacer {

14− width: auto;

15− min-width: initial;

16− }

17− .content-nav {

18− display: none;

19− }

20− .content-nav-icon {

21− display: block;

22− &.none {

23− display: none;

24− }

25− }

26− .content, .content-spacer {

27− flex-basis: 90%;

28− max-width: 90%;

29− }

30− .posts__content {

31− margin-left: (8rem / 4);

32− }

33− .no-side-nav-column {

34− flex-basis: 66.66666667%;

35− max-width: 66.66666667%;

36− }

37− .form {

38− max-width: 270px;

39− }

40− p img {

41− width: 90%;

42− }

43− .header {

44− &__navigation {

45− display: none;

46− &.is-active {

47− display: block;

48− }

49− }

50− }

51− .has-active-main-nav {

52− overflow: hidden;

53− .header {

54− &__navigation {

55− overflow-y: scroll;

56− -webkit-overflow-scrolling: touch;

57− }

58− }

59− }

60− .has-active-content-nav {

61− overflow: hidden;

62− .content-nav-container {

63− height: 100%;

64− z-index: 4;

65− top: 0;

66− width: 100%;

67− top: 0;

68− left: 0;

69− padding: 0 (4rem / 4);

70− background: white;

71− overflow-y: scroll;

72− -webkit-overflow-scrolling: touch;

73− }

74− .content-nav {

75− display: block;

76− margin: (7rem) / 4;

77− overflow: initial;

78− width: 100%;

79− margin: 0;

80− margin-top: (-7rem / 4);

81− &__index {

82− margin: (7rem /4) 0 0 (7rem / 4);

83− padding: (7rem /4) (7rem / 4) 0 0;

84− }

85− }

86− .content-nav-icon {

87− &:before {

88− border-top: 10px solid transparent;

89− border-bottom: 10px solid transparent;

90− border-left: 10px solid #000;

91− border-right: 10px solid transparent;

92− }

93− }

94− .content, .content-spacer {

95− flex-basis: auto;

96− max-width: none;

97− }

98− }

99−}

100−

101−@media only screen and (max-width: 480px) {

102− .no-side-nav-column {

103− margin-left: 8.33333333%;

104− flex-basis: 83.33333333%;

105− max-width: 83.33333333%;

106− }

107− .nav-column {

108− flex-basis: 75%;

109− max-width: 75%;

110− margin-left: 24%;

111− }

112−}

sass/indigo.scss+5907−17309