You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
786 lines
16 KiB
SCSS
786 lines
16 KiB
SCSS
;; -*- mode:scheme -*-
|
|
(let* (;; FONTS ;;
|
|
(font-proportion-ratio (/ 3 4))
|
|
(largest-font-size 5.5) ; (REM)
|
|
|
|
;; COLORS ;;
|
|
(almost-black "#111")
|
|
(white "white")
|
|
|
|
(primary-color white)
|
|
(primary-light-color "#2ba6cb")
|
|
(inverted-primary-light-color white)
|
|
(secondary-color "#e9e9e9")
|
|
(sub-color "#888")
|
|
(sub-item-color "#999")
|
|
(inverted-primary-color almost-black)
|
|
(inverted-primary-dark-color "#eee")
|
|
(primary-dark-color almost-black)
|
|
(shadow-color "#888")
|
|
(heavy-shadow-color "#111")
|
|
(anchor-color "#ddd")
|
|
(card-background-color "#f5f5f5")
|
|
(card-border-color "#ccc")
|
|
(page-background-color "white")
|
|
|
|
(article-card-viewed-background-color "#f5f5f5")
|
|
(article-card-category-background-color white)
|
|
(article-card-category-color almost-black)
|
|
)
|
|
(use scss)
|
|
|
|
(define *font-sizes*
|
|
(map-in-order
|
|
(lambda (x) (string-append (number->string x) "rem"))
|
|
(fold
|
|
(lambda (i o)
|
|
;; Round down to 3 digits after the decimal.
|
|
(cons (* (inexact->exact (round (* (car o) font-proportion-ratio 1000))) 0.001) o))
|
|
`(,largest-font-size)
|
|
(iota 9))))
|
|
(define (font-size size)
|
|
(if (number? size)
|
|
(list-ref *font-sizes* size)
|
|
(case size
|
|
('largest (list-ref *font-sizes* 9))
|
|
('extra-large (list-ref *font-sizes* 7))
|
|
('large (list-ref *font-sizes* 6))
|
|
('medium (list-ref *font-sizes* 4))
|
|
('small (list-ref *font-sizes* 2))
|
|
('tiny (list-ref *font-sizes* 1))
|
|
('smallest (list-ref *font-sizes 0)))))
|
|
|
|
;; So SCSS can't currently handle media queries. This is a terrible
|
|
;; hack to make it work. The syntax is the same as regular SCSS for
|
|
;; the body of the media query. Also note that part of the hack is
|
|
;; adding a bogus selector and rule to the end with id
|
|
;; nil-and-nil-and-nil. You probably want to avoid using that as an
|
|
;; ID in your document. :) See usage example below.
|
|
;;
|
|
;; ,(mq '|@media only screen and (max-width: 40rem)|
|
|
;; '(.p (font red) (font-size 10px))
|
|
;; '(a (text-decoration none)))
|
|
(define (mq query . body)
|
|
`(,query
|
|
(,(string-append
|
|
(fold (lambda (scss o)
|
|
(string-append (scss->css (cons 'css+ (list scss))) " " o))
|
|
""
|
|
body)
|
|
" #nil-and-nil-and-nill { font")
|
|
"inherit }")))
|
|
|
|
`(css+
|
|
|
|
;; BEGIN GENERIC STYLES
|
|
((h1 h2 h3 h4 h5 h6)
|
|
(margin-top 0.5rem)
|
|
(margin-bottom 0.1rem))
|
|
|
|
(h1
|
|
(font-size ,(font-size 7)))
|
|
(h2
|
|
(font-size ,(font-size 6)))
|
|
(h3
|
|
(font-size ,(font-size 5)))
|
|
(h4
|
|
(font-size ,(font-size 4)))
|
|
(h5
|
|
(font-size ,(font-size 3)))
|
|
(h6
|
|
(font-size ,(font-size 2)))
|
|
|
|
(a
|
|
(text-decoration none)
|
|
(color ,primary-light-color))
|
|
|
|
((|input[type=\"text\"]|
|
|
|input[type=\"password\"]|
|
|
|input[type=\"email\"]|)
|
|
(padding 0.2rem)
|
|
(margin-bottom 1rem)
|
|
(width 100%))
|
|
|
|
(select
|
|
(padding 0.2rem)
|
|
(margin-bottom 1rem))
|
|
|
|
(|input[type=\"email\"]|
|
|
(margin-right 0.3rem)
|
|
(verticle-align middle))
|
|
|
|
(.expand
|
|
(width 100%))
|
|
|
|
(.button
|
|
(font-weight bold)
|
|
(cursor pointer)
|
|
(background-color ,primary-light-color)
|
|
(font-size ,(font-size 3))
|
|
(padding 0.5rem)
|
|
(border "1px solid #2284A1")
|
|
(box-shadow "0px 1px 0px rgba(255, 255, 255, 0.5) inset")
|
|
(color white)
|
|
(transition "background-color 300ms ease-out 0s"))
|
|
|
|
(|.button:hover|
|
|
(background-color "#2284A1"))
|
|
|
|
(.button.secondary
|
|
(background-color "#ccc")
|
|
(border "0.1rem solid #999"))
|
|
|
|
(.button-small
|
|
(font-size ,(font-size 2))
|
|
(padding 0.2rem))
|
|
|
|
(.button.right
|
|
(margin-top 0.6rem)
|
|
(margin-right 0.2rem))
|
|
|
|
(.button-shadowed
|
|
(background-color inherit)
|
|
(padding 0.2rem)
|
|
(margin 0.2rem)
|
|
(box-shadow 0 0 1px 1px ,sub-item-color)
|
|
(border-radius 0.2rem))
|
|
|
|
(.horizontal-spacer
|
|
(height 1rem))
|
|
|
|
(.vertical-spacer
|
|
(width 1rem)
|
|
(display inline-block))
|
|
|
|
(.font-small
|
|
(text-align center))
|
|
|
|
(.center
|
|
(text-align center))
|
|
|
|
(p.small-font
|
|
(font-size ,(font-size 'small))
|
|
(line-height 1.125rem)
|
|
(margin-top 0.2rem)
|
|
(margin-bottom 0.2rem))
|
|
|
|
(p.tiny-font
|
|
(font-size ,(font-size 'tiny))
|
|
(line-height 0.75rem)
|
|
(margin-top 0.2rem)
|
|
(margin-bottom 0.2rem))
|
|
|
|
(.overflow-hidden
|
|
(overflow hidden))
|
|
|
|
(.small-font
|
|
(font-size ,(font-size 'small))
|
|
(line-height 1.25rem))
|
|
|
|
(.inline
|
|
(display inline))
|
|
|
|
(.unstyled-link
|
|
(text-decoration inherit !important)
|
|
(color inherit !important)
|
|
(font-family inherit !important)
|
|
(font-weight inherit !important)
|
|
(font-style inherit !important)
|
|
(line-height inherit !important)
|
|
(background-color inherit !important))
|
|
|
|
(.fixed
|
|
(position fixed))
|
|
|
|
(.hidden
|
|
(visibility hidden))
|
|
|
|
(.icon-button
|
|
(border 0)
|
|
(background inherit))
|
|
|
|
(.display-none
|
|
(display none))
|
|
|
|
(.inline
|
|
(display inline-block))
|
|
|
|
(.accordion-container
|
|
(list-style none)
|
|
(margin-left 0))
|
|
|
|
(|.accordion:first-child|
|
|
(border-top 0.1rem solid ,sub-color))
|
|
|
|
(.accordion
|
|
(border 0.1rem solid ,sub-color)
|
|
(border-top 0)
|
|
(padding 0.3rem)
|
|
(list-style none)
|
|
(background ,anchor-color))
|
|
|
|
(.accordion-selected
|
|
(background inherit))
|
|
|
|
(.accordion-header
|
|
(cursor pointer))
|
|
|
|
(code
|
|
(font-size ,(font-size 'small)))
|
|
|
|
;; END GENERIC STYLES
|
|
|
|
;; BEGIN NEWS STYLES
|
|
|
|
(|#api-landing-background-container|
|
|
(display flex)
|
|
(|-webkit-flex| flex)
|
|
(flex-direction column)
|
|
(|-webkit-flex-direction| column)
|
|
(height 610px))
|
|
|
|
(|#api-landing-background-text-container|
|
|
(flex 1 1 auto)
|
|
(|-webkit-flex| 1 1 auto)
|
|
(display "-webkit-flex")
|
|
(display flex)
|
|
(flex-direction column)
|
|
(|-webkit-flex-direction| column)
|
|
(justify-content center)
|
|
(|-webkit-justify-content| center)
|
|
(text-shadow "0 2px rgba(62,71,76,0.4)")
|
|
(text-shadow "0 0px 5px rgba(62,71,76,0.4), 2px 2px 4px black")
|
|
(text-align center)
|
|
((// |h1,h3|)
|
|
(color white)))
|
|
|
|
(.api-landing-background
|
|
(position absolute)
|
|
(top 0)
|
|
(left 0)
|
|
(right 0)
|
|
(height 610px))
|
|
|
|
(|#api-landing-background-overlay|
|
|
(background "rgba(115, 115, 115, 0.7)"))
|
|
|
|
(|#api-landing-background-image|
|
|
(background-image "url('/res/img/raster/newspaper.jpg')")
|
|
(background-position center)
|
|
(background-repeat no-repeat)
|
|
(background-size cover))
|
|
|
|
(|#api-landing-background-credits-container|
|
|
(position absolute)
|
|
(bottom 3px)
|
|
(left 3px)
|
|
(color ,anchor-color)
|
|
(font-size ,(font-size 2))
|
|
((// a)
|
|
(color ,anchor-color)))
|
|
|
|
(|.row .request-invite-row|
|
|
(margin-top 1rem)
|
|
(margin-bottom 1rem)
|
|
(border-top 0.35rem solid ,almost-black)
|
|
(border-bottom 0.35rem solid ,almost-black))
|
|
|
|
(|.row .tall|
|
|
(margin-top 7rem)
|
|
(margin-bottom 7rem))
|
|
|
|
(.unsubscribe-topic-icon
|
|
(margin-right 0.3rem)
|
|
(color ,primary-light-color))
|
|
|
|
(.remove-topic
|
|
(display inline-block)
|
|
(margin-top 0.3rem))
|
|
|
|
(.headline
|
|
(font-weight bold)
|
|
(font-family "georgia, 'times new roman', times, serif"))
|
|
|
|
(.byline
|
|
(color ,sub-item-color)
|
|
(text-transform uppercase)
|
|
((// a)
|
|
(color ,sub-item-color)
|
|
(text-decoration underline)))
|
|
|
|
(.source-line
|
|
(color ,sub-item-color)
|
|
((// img)
|
|
(opacity 0.5)
|
|
(margin-right 0.2rem))
|
|
((// span)
|
|
(vertical-align middle))
|
|
((// a)
|
|
(color ,sub-item-color)))
|
|
|
|
(.logo-normal
|
|
(margin-top 0.2rem))
|
|
|
|
(.follow-icon-container
|
|
(display inline-block)
|
|
(padding 0.2rem)
|
|
(margin 0.4rem)
|
|
(margin-bottom 0.8rem)
|
|
((// img)
|
|
(width 18px)
|
|
(height 18px)))
|
|
|
|
(.add-follow-label
|
|
(cursor pointer))
|
|
|
|
(.selection-checkbox-container
|
|
(margin 0.5rem)
|
|
(font-size ,(font-size 2))
|
|
((// img)
|
|
(width 18px)
|
|
(height 18px)))
|
|
|
|
(.selection-checkbox
|
|
(display none))
|
|
|
|
(|.selection-label-container|
|
|
(cursor pointer)
|
|
(display inline-block)
|
|
(padding 0.2rem)
|
|
(padding-left 0.1rem))
|
|
|
|
(|.selection-checkbox + label:before|
|
|
(display inline-block)
|
|
(font "normal normal normal 14px/1 FontAwesome")
|
|
(font-size inherit)
|
|
(text-rendering auto)
|
|
("-webkit-font-smoothing" antialiased)
|
|
("-moz-osx-font-smoothing" grayscale)
|
|
(transform "translate(0, 0)")
|
|
(content "'\\f067'"))
|
|
|
|
(|.selection-checkbox:checked + label:before|
|
|
(display inline-block)
|
|
(font "normal normal normal 14px/1 FontAwesome")
|
|
(font-size inherit)
|
|
(text-rendering auto)
|
|
("-webkit-font-smoothing" antialiased)
|
|
("-moz-osx-font-smoothing" grayscale)
|
|
(transform "translate(0, 0)")
|
|
(content "'\\f14a'"))
|
|
|
|
(.interest-icon-add
|
|
((// fa-plus)
|
|
(color black))
|
|
((// fa-check-square)
|
|
(background-color black)
|
|
(color white)))
|
|
|
|
(|#add-interest-input|
|
|
(margin-bottom 0)
|
|
(z-index 3)
|
|
(position relative))
|
|
|
|
(.select-interests-container
|
|
(display none)
|
|
(background white)
|
|
(position absolute)
|
|
(z-index 3)
|
|
(margin-right 0.2rem)
|
|
(overflow-y auto))
|
|
|
|
(.extra-interests-container
|
|
((// li)
|
|
(list-style-type none)))
|
|
|
|
(.interest-element-label
|
|
((// input)
|
|
(margin-right 0.2rem)))
|
|
|
|
(.interest-image-container
|
|
(position relative)
|
|
(cursor pointer)
|
|
(color white)
|
|
(text-shadow 1px 1px ,shadow-color)
|
|
((// img)
|
|
(width 100%)
|
|
(height 150px)))
|
|
|
|
(.interest-element-shadow
|
|
(box-shadow 0 0 4px ,almost-black)
|
|
(border 1px solid ,almost-black))
|
|
|
|
(.interest-image-text
|
|
(font-weight bold)
|
|
(position absolute)
|
|
(bottom 0)
|
|
(z-index 2)
|
|
(color white)
|
|
(width "100%"))
|
|
|
|
(.interest-image-overlay
|
|
(position absolute)
|
|
(background "rgba(115, 115, 115, 0.45)")
|
|
(top 0)
|
|
(left 0)
|
|
(width "100%")
|
|
(height "100%")
|
|
(z-index 1))
|
|
|
|
(.interest-image-checkmark-container
|
|
(position absolute)
|
|
(top 0)
|
|
(right 0)
|
|
(color white)
|
|
(z-index 3)
|
|
(padding 0.5rem))
|
|
|
|
(.level-3
|
|
(z-index 3)
|
|
(position relative))
|
|
|
|
(.flow-button
|
|
(box-shadow 0 0 1px 1px ,sub-item-color)
|
|
(border-radius 0.2rem)
|
|
(background-color ,almost-black)
|
|
(padding 0.3rem)
|
|
(border 0px)
|
|
(font-size ,(font-size 3))
|
|
(color white))
|
|
|
|
(.add-interest
|
|
(box-shadow 0 0 1px 1px "#999")
|
|
(border-radius 0.2rem))
|
|
|
|
(.follow-icons-outer-container
|
|
(margin 0.2rem)
|
|
(display inline-block)
|
|
(background transparent))
|
|
|
|
(.top-bar-container
|
|
(color ,inverted-primary-color)
|
|
(background ,primary-color))
|
|
|
|
(.top-bar-title
|
|
(font-family "Georgia, serif")
|
|
(padding-bottom 0)
|
|
(margin-bottom 0)
|
|
(text-align center)
|
|
(font-size ,(font-size 'medium))
|
|
(color ,inverted-primary-color)
|
|
(font-weight bold))
|
|
|
|
(.menu-bars
|
|
,@(let ((radius '0.3rem))
|
|
`((border-top-left-radius ,radius)
|
|
(border-top-right-radius ,radius)
|
|
(margin-left 0.2rem)
|
|
(margin-top 0.55rem)
|
|
(color ,sub-color)
|
|
(cursor pointer))))
|
|
|
|
(.menu-header
|
|
(font-weight bold)
|
|
(color ,almost-black)
|
|
(border-bottom 0.2rem solid ,almost-black))
|
|
|
|
(.menu-bars-open
|
|
(background ,white)
|
|
(color ,almost-black)
|
|
(border 0.1rem solid ,almost-black)
|
|
(border-bottom 0.2rem solid ,white))
|
|
|
|
(.menu-container
|
|
(margin-top -0.05rem)
|
|
(color ,primary-dark-color)
|
|
(display none)
|
|
(border-top 0.1rem solid ,almost-black)
|
|
(border-bottom 0.2rem solid ,almost-black)
|
|
|
|
((// .fa)
|
|
(margin-right 0.4rem))
|
|
|
|
((// ul)
|
|
(list-style none)
|
|
(margin 0)
|
|
(padding 0)
|
|
|
|
((// li)
|
|
(line-height 2rem)
|
|
(border-bottom 0.15rem solid ,inverted-primary-dark-color)
|
|
(padding 0.5rem)
|
|
|
|
((// a)
|
|
(display block)
|
|
(width 100%)))))
|
|
|
|
(.filter-tags-container
|
|
(text-align center)
|
|
(padding 0.2rem)
|
|
(padding-top 0))
|
|
|
|
,(mq '|@media only screen and (max-width: 40rem)|
|
|
`(.filter-tags-container
|
|
(font-size ,(font-size 'medium))
|
|
(overflow-x auto)
|
|
(white-space nowrap))
|
|
`(.filter-item-selected
|
|
(border-bottom 0.2rem solid ,inverted-primary-color)))
|
|
|
|
,(mq '|@media only screen and (min-width: 40rem)|
|
|
`(.filter-tags-container
|
|
(font-size 'medium))
|
|
`(.filter-item-selected
|
|
(border-bottom 0.1rem solid ,inverted-primary-color)))
|
|
|
|
(.filter-item
|
|
(color ,inverted-primary-color)
|
|
(display inline-block)
|
|
(padding 0.2rem)
|
|
(padding-top 0.6rem)
|
|
(padding-bottom 0.1rem))
|
|
|
|
(.subscribe-container
|
|
(color ,inverted-primary-color)
|
|
(background ,primary-dark-color)
|
|
(padding 0)
|
|
(padding-top 0.4rem)
|
|
(padding-bottom 0.5rem)
|
|
(display inline-block))
|
|
|
|
(.outer-subscribe-container
|
|
(background-color ,page-background-color))
|
|
|
|
(.top-bar-icon
|
|
(font-weight initial)
|
|
(cursor pointer)
|
|
(padding-right 0.2rem))
|
|
|
|
(.subscribe-button
|
|
(padding 0.2rem)
|
|
(padding-top 0.3rem)
|
|
(margin-top 0.55rem)
|
|
(font-size ,(font-size 'small))
|
|
(margin-right 0.5rem)
|
|
(padding-left 0.6rem)
|
|
(padding-right 0.6rem))
|
|
|
|
(.unread-only-label
|
|
(padding-left 0.1rem)
|
|
(font-size ,(font-size 3))
|
|
(color ,inverted-primary-color))
|
|
|
|
(.unread-only-container
|
|
(padding-top 0.2rem))
|
|
|
|
(.top-fixed-container
|
|
(z-index 1)
|
|
(width 100%)
|
|
(left 0))
|
|
|
|
(.article-card
|
|
,@(let ((spacing "0.6rem"))
|
|
`((margin-bottom ,spacing !important)
|
|
(padding-bottom ,spacing)
|
|
(border-bottom 0.1rem dotted ,almost-black))))
|
|
|
|
(.thumbnail
|
|
(background-size cover !important)
|
|
(height 4rem)
|
|
(width 5rem)
|
|
(margin-right 0.5rem))
|
|
|
|
(.flex-container
|
|
(display flex))
|
|
|
|
(.flex-align-center
|
|
(align-items center))
|
|
|
|
(.filler-image
|
|
(opacity 0.05))
|
|
|
|
;; (.thumbnail-extra-large
|
|
;; (height 20rem)
|
|
;; (width 37rem))
|
|
|
|
;; (.thumbnail-large
|
|
;; (height 15.5rem)
|
|
;; (width 18.3rem))
|
|
|
|
;; (.thumbnail-medium
|
|
;; (height 12rem)
|
|
;; (width 14rem))
|
|
|
|
;; (.thumbnail-small
|
|
;; (height 7rem)
|
|
;; (width 8rem))
|
|
|
|
;; (.thumbnail-extra-small
|
|
;; (height 4rem)
|
|
;; (width 5rem))
|
|
|
|
(.article-card-title
|
|
(padding-left 0.2rem !important)
|
|
(padding-right 0.2rem !important))
|
|
|
|
(.article-card-viewed
|
|
((// .article-card-image-container)
|
|
((// .thumbnail)
|
|
(opacity 0.5)))
|
|
((// .article-card-title)
|
|
(opacity 0.5)))
|
|
|
|
(|#personalize-tooltip|
|
|
(position absolute)
|
|
(top 3.2rem)
|
|
(right 1rem)
|
|
(width 10rem)
|
|
(z-index 5)
|
|
(background white)
|
|
(padding 0.4rem)
|
|
(border 0.15rem solid ,almost-black)
|
|
(border-radius 0.3rem)
|
|
(box-shadow 2px 2px 2px grey)
|
|
(display none)
|
|
((// .triangle-up)
|
|
(position absolute)
|
|
(top -1rem)
|
|
(right 0.15rem)))
|
|
|
|
(.triangle-up
|
|
(width 0)
|
|
(height 0)
|
|
(border-left 0.5rem solid transparent)
|
|
(border-right 0.5rem solid transparent)
|
|
(border-bottom 1rem solid black))
|
|
|
|
(.article-card-category
|
|
(position absolute)
|
|
(background-color ,article-card-category-background-color)
|
|
(padding 0.2rem)
|
|
(color ,article-card-category-color)
|
|
(font-weight bold)
|
|
(opacity 0.8))
|
|
|
|
(.empty-column-title
|
|
(border-top 0.1rem solid ,almost-black)
|
|
(margin-top 0.6rem))
|
|
|
|
(.column-title
|
|
(padding 0.4rem 0 0.4rem 0)
|
|
(margin 0.6rem 0 0.6rem 0)
|
|
(border-top 0.1rem solid ,almost-black)
|
|
(border-bottom 0.1rem dashed ,sub-color)
|
|
(font-weight bold))
|
|
|
|
(.lightbox
|
|
;; (visibility hidden)
|
|
(position fixed)
|
|
(z-index 2)
|
|
(width "100%")
|
|
(height "100%")
|
|
(opacity 0.7)
|
|
(background grey)
|
|
(display none))
|
|
|
|
(.lightbox-body-container
|
|
(position fixed)
|
|
(width 100%)
|
|
(height 100%)
|
|
(z-index 3)
|
|
(display none))
|
|
|
|
(.lightbox-body
|
|
(min-width 15rem)
|
|
(position absolute)
|
|
(height auto)
|
|
(width auto)
|
|
(left "50%")
|
|
(top "50%")
|
|
(background white)
|
|
(border 0.2rem solid ,almost-black)
|
|
(transform "translate(-50%, -50%)")
|
|
(|-webkit-transform| "translate(-50%, -50%)")
|
|
(|-moz-transform| "translate(-50%, -50%)")
|
|
(|-ms-transform| "translate(-50%, -50%)")
|
|
(padding 1rem)
|
|
(padding-top 0.1rem)
|
|
(z-index 3)
|
|
(max-height "100%")
|
|
(overflow-x scroll))
|
|
|
|
(.lightbox-full-width
|
|
(width "100%")
|
|
(height "100%"))
|
|
|
|
(|#submit-email-sign-up|
|
|
(width "100%")
|
|
(color white))
|
|
|
|
(.close-lightbox
|
|
(cursor pointer))
|
|
|
|
(.add-content-button
|
|
(width 100%)
|
|
(background inherit)
|
|
(border 0.1rem solid black)
|
|
(font-size ,(font-size 2))
|
|
(box-shadow 0 0 1px 1px "#999")
|
|
(border-radius 0.2rem))
|
|
|
|
(|#add-interests-container|
|
|
(display none))
|
|
|
|
,(mq '|@media only screen and (max-width: 40rem)|
|
|
`(.column-title
|
|
(padding-left 0.3rem)
|
|
(border-top inherit)
|
|
(border-bottom inherit)
|
|
(background-color ,almost-black)
|
|
(color ,white)))
|
|
|
|
(.upvote
|
|
(cursor pointer)
|
|
(margin-right 0.1rem))
|
|
|
|
(.slick-next
|
|
(right 72px)
|
|
(left 25px))
|
|
|
|
,(mq '|@media only screen and (min-width: 40rem)|
|
|
`(.row.right-collapse-medium
|
|
(padding-right 0)
|
|
(padding-left 1.875rem))
|
|
`(.article-card-image-container
|
|
(float left)
|
|
(margin-right 0.7rem)))
|
|
|
|
;; ,(mq '|@media only screen and (max-width: 64.063em)|
|
|
;; `(.thumbnail-small
|
|
;; (height 14rem)))
|
|
|
|
|
|
,(mq '|@media only screen and (max-width: 40rem)|
|
|
`(.row.collapse-small
|
|
(width auto)
|
|
(margin 0)
|
|
(max-width none))
|
|
`(|.row.collapse-small>.columns|
|
|
(padding-left 0)
|
|
(padding-right 0))
|
|
`(.row.right-collapse-small-half
|
|
(padding-right 0)
|
|
(padding-left 0.935rem))
|
|
`(.row.left-collapse-small-half
|
|
(padding-right 0)
|
|
(padding-right 0.935rem))
|
|
`(h6
|
|
(font-size ,(font-size 'small))))
|
|
|
|
|
|
|
|
;; END NEWS STYLES
|
|
|
|
|
|
))
|