diff --git a/perma_web/perma/templates/landing.html b/perma_web/perma/templates/landing.html index 3417f3323..08d7bf26b 100644 --- a/perma_web/perma/templates/landing.html +++ b/perma_web/perma/templates/landing.html @@ -13,12 +13,18 @@
-
-

Perma.cc prevents link rot.

+
+

Websites change. Perma Links don’t.

Perma.cc helps journals, lawyers, courts, and others preserve web citations by creating permanent archives of their cited links.

-

Perma.cc is simple, free to use, and is built and supported by libraries.

+

Perma.cc is simple, free to use, and is built and supported by libraries.

-
+
+ Websites change. Perma Links don’t. +
-
+
{% if request.user.is_authenticated %} Create and manage your Perma Links @@ -42,42 +49,53 @@

Perma.cc prevents link rot.

-
+ +
+
Perma.cc is a simple way to preserve your links
-

1 Find any active URL.

- Perma Step 2 + +

Find any URL.

+ Perma Step 2 +
-

2 Add it to Perma.cc.

- Perma Step 2 + +

Add it to Perma.cc.

+ Perma Step 2 +
-

3 Make a permanent Perma Link archive.

- Perma Step 3 + +

Create a Perma Link.

+ Perma Step 3 +
-

4 Cite using your Perma Link.

- Perma Step 4 + +

Cite safely.

+ Perma Step 4 +
+
@@ -159,20 +177,19 @@

Meet the Perma Link.

We’re committed to preservation

Websites change, go away, and get taken down. When they do, linked citations can lead to broken, blank, unintentional, or even malicious pages. This decay is called “link rot.” Perma.cc helps scholars, journals and courts prevent link rot by creating permanent, reliable, unalterable links to the online sources cited in their work.

- All about Perma Links - Frequently asked questions
-

Websites change. Perma Links don’t.

+

Frequently asked questions

Once you capture a Perma Link, neither its content nor its address will change, no matter what happens to the original link.

- Websites change. + + More questions? Get more answers.
diff --git a/perma_web/static/css/style-responsive.scss b/perma_web/static/css/style-responsive.scss index 9f87cb788..5aab84bd6 100644 --- a/perma_web/static/css/style-responsive.scss +++ b/perma_web/static/css/style-responsive.scss @@ -388,6 +388,14 @@ p { } } +._showDesktop { + display: none; + @include respond-desktop { + display: block; + } +} + + ._soleContent { margin-bottom: $double; } @@ -4196,8 +4204,37 @@ section { #landing-introduction { @include respond-desktop { padding-top: $grid * 4; + //padding-bottom: $grid * 10; + padding-bottom: 0; + } + padding-bottom: $grid * 5; + .row-modules { + @include respond-desktop { + margin-top: $grid * 7; + } + } +} + +h6.image-hed { + padding-bottom: $half; + font-size: 24px; + display: inline-block; + border-bottom: 2px solid $color-blue; + margin-bottom: $grid * 5; + padding-top: 0; + color: $color-blue; + font-weight: 900; + font-family: $font-hed-alt; +} + +.primary-img { + @include respond-tablet { + padding-top: $half; + padding-right: $double; + } + @include respond-tablet { + padding-top: 0; } - padding-bottom: 0; } .cont-subsection { @@ -4213,17 +4250,22 @@ section { @extend .style-container; max-width: 1800px; margin: 0 auto; - padding: $grid * 8 $grid * 8 0; + padding: $grid * 4 $grid * 8 0; + border-top: 1px solid $color-blue; + margin-top: $grid * 8; + border-bottom: 1px solid $color-blue; + text-align: center; } p.caption-hero { font-family: $font-hed-alt; color: $color-blue; - font-weight: 700; - font-size: 13px; + font-weight: 300; + font-size: 21px; padding-bottom: $grid; margin-bottom: 0; position: relative; + text-align: center; span.num { display: inline-block; padding: 0; @@ -4240,6 +4282,13 @@ p.caption-hero { } } +a:hover { + p.caption-hero { + //color: $color-black; + //font-weight: 700; + } +} + .primary-intro { font-family: $font-hed-alt; font-size: 18px; @@ -4262,10 +4311,14 @@ p.caption-hero { } @include respond-tablet { font-size: 28px; + line-height: 1.6; &:last-child { padding-bottom: $grid * 4; } } + @include respond-desktop { + line-height: 1.5; + } @include respond-wide { font-size: 32px; } @@ -4275,6 +4328,18 @@ p.caption-hero { overflow: auto; } +h1.section-title { + @include respond-tablet { + line-height: 1.2; + font-size: 40px; + padding-bottom: 12px; + } + @include respond-desktop { + font-size: 36px; + padding-bottom: 0; + } +} + .section-title { color: $color-black; font-size: 20px; diff --git a/perma_web/static/img/websites-change-square.svg b/perma_web/static/img/websites-change-square.svg new file mode 100644 index 000000000..58a1dfdf5 --- /dev/null +++ b/perma_web/static/img/websites-change-square.svg @@ -0,0 +1,262 @@ + + + + websites-change-square + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/perma_web/static/img/websites-change-vertical.svg b/perma_web/static/img/websites-change-vertical.svg new file mode 100644 index 000000000..2df5a94e8 --- /dev/null +++ b/perma_web/static/img/websites-change-vertical.svg @@ -0,0 +1,254 @@ + + + + websites-change-vertical + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 404 + + + + + + + + + + + + + + + + + + + + + + + + perma.cc + + + + + \ No newline at end of file diff --git a/websites-change-square.svg b/websites-change-square.svg new file mode 100644 index 000000000..78ac23e21 --- /dev/null +++ b/websites-change-square.svg @@ -0,0 +1,282 @@ + + + + websites-change-square + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 404 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + perma.cc/NG87-3RTY + + + + + \ No newline at end of file